@import url(https://fonts.googleapis.com/icon?family=Material+Icons);
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

:root {
  --toastify-color-light:#fff;
  --toastify-color-dark:#121212;
  --toastify-color-info:#3498db;
  --toastify-color-success:#07bc0c;
  --toastify-color-warning:#f1c40f;
  --toastify-color-error:#e74c3c;
  --toastify-color-transparent:hsla(0,0%,100%,.7);
  --toastify-icon-color-info:var(--toastify-color-info);
  --toastify-icon-color-success:var(--toastify-color-success);
  --toastify-icon-color-warning:var(--toastify-color-warning);
  --toastify-icon-color-error:var(--toastify-color-error);
  --toastify-toast-width:320px;
  --toastify-toast-background:#fff;
  --toastify-toast-min-height:64px;
  --toastify-toast-max-height:800px;
  --toastify-font-family:sans-serif;
  --toastify-z-index:9999;
  --toastify-text-color-light:#757575;
  --toastify-text-color-dark:#fff;
  --toastify-text-color-info:#fff;
  --toastify-text-color-success:#fff;
  --toastify-text-color-warning:#fff;
  --toastify-text-color-error:#fff;
  --toastify-spinner-color:#616161;
  --toastify-spinner-color-empty-area:#e0e0e0;
  --toastify-color-progress-light:linear-gradient(90deg,#4cd964,#5ac8fa,#007aff,#34aadc,#5856d6,#ff2d55);
  --toastify-color-progress-dark:#bb86fc;
  --toastify-color-progress-info:var(--toastify-color-info);
  --toastify-color-progress-success:var(--toastify-color-success);
  --toastify-color-progress-warning:var(--toastify-color-warning);
  --toastify-color-progress-error:var(--toastify-color-error);
}

.Toastify__toast-container {
  z-index: var(--toastify-z-index);
  -webkit-transform: translateZ(var(--toastify-z-index));
  position: fixed;
  padding: 4px;
  width: var(--toastify-toast-width);
  box-sizing: border-box;
  color: #fff;
}

.Toastify__toast-container--top-left {
  top: 1em;
  left: 1em;
}

.Toastify__toast-container--top-center {
  top: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.Toastify__toast-container--top-right {
  top: 1em;
  right: 1em;
}

.Toastify__toast-container--bottom-left {
  bottom: 1em;
  left: 1em;
}

.Toastify__toast-container--bottom-center {
  bottom: 1em;
  left: 50%;
  transform: translateX(-50%);
}

.Toastify__toast-container--bottom-right {
  bottom: 1em;
  right: 1em;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast-container {
    width: 100vw;
    padding: 0;
    left: 0;
    margin: 0;
  }
  .Toastify__toast-container--top-center, .Toastify__toast-container--top-left, .Toastify__toast-container--top-right {
    top: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--bottom-center, .Toastify__toast-container--bottom-left, .Toastify__toast-container--bottom-right {
    bottom: 0;
    transform: translateX(0);
  }
  .Toastify__toast-container--rtl {
    right: 0;
    left: auto;
  }
}
.Toastify__toast {
  position: relative;
  min-height: var(--toastify-toast-min-height);
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 8px;
  border-radius: 4px;
  box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 2px 15px 0 rgba(0, 0, 0, 0.05);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  max-height: var(--toastify-toast-max-height);
  overflow: hidden;
  font-family: var(--toastify-font-family);
  cursor: default;
  direction: ltr;
  z-index: 0;
}

.Toastify__toast--rtl {
  direction: rtl;
}

.Toastify__toast--close-on-click {
  cursor: pointer;
}

.Toastify__toast-body {
  margin: auto 0;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  padding: 6px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.Toastify__toast-body > div:last-child {
  word-break: break-word;
  -ms-flex: 1;
  flex: 1;
}

.Toastify__toast-icon {
  -webkit-margin-end: 10px;
  margin-inline-end: 10px;
  width: 20px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  display: -ms-flexbox;
  display: flex;
}

.Toastify--animate {
  animation-fill-mode: both;
  animation-duration: 0.7s;
}

.Toastify--animate-icon {
  animation-fill-mode: both;
  animation-duration: 0.3s;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast {
    margin-bottom: 0;
    border-radius: 0;
  }
}
.Toastify__toast-theme--dark {
  background: var(--toastify-color-dark);
  color: var(--toastify-text-color-dark);
}

.Toastify__toast-theme--colored.Toastify__toast--default, .Toastify__toast-theme--light {
  background: var(--toastify-color-light);
  color: var(--toastify-text-color-light);
}

.Toastify__toast-theme--colored.Toastify__toast--info {
  color: var(--toastify-text-color-info);
  background: var(--toastify-color-info);
}

.Toastify__toast-theme--colored.Toastify__toast--success {
  color: var(--toastify-text-color-success);
  background: var(--toastify-color-success);
}

.Toastify__toast-theme--colored.Toastify__toast--warning {
  color: var(--toastify-text-color-warning);
  background: var(--toastify-color-warning);
}

.Toastify__toast-theme--colored.Toastify__toast--error {
  color: var(--toastify-text-color-error);
  background: var(--toastify-color-error);
}

.Toastify__progress-bar-theme--light {
  background: var(--toastify-color-progress-light);
}

.Toastify__progress-bar-theme--dark {
  background: var(--toastify-color-progress-dark);
}

.Toastify__progress-bar--info {
  background: var(--toastify-color-progress-info);
}

.Toastify__progress-bar--success {
  background: var(--toastify-color-progress-success);
}

.Toastify__progress-bar--warning {
  background: var(--toastify-color-progress-warning);
}

.Toastify__progress-bar--error {
  background: var(--toastify-color-progress-error);
}

.Toastify__progress-bar-theme--colored.Toastify__progress-bar--error, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--info, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--success, .Toastify__progress-bar-theme--colored.Toastify__progress-bar--warning {
  background: var(--toastify-color-transparent);
}

.Toastify__close-button {
  color: #fff;
  background: transparent;
  outline: none;
  border: none;
  padding: 0;
  cursor: pointer;
  opacity: 0.7;
  transition: 0.3s ease;
  -ms-flex-item-align: start;
  align-self: flex-start;
}

.Toastify__close-button--light {
  color: #000;
  opacity: 0.3;
}

.Toastify__close-button > svg {
  fill: currentColor;
  height: 16px;
  width: 14px;
}

.Toastify__close-button:focus, .Toastify__close-button:hover {
  opacity: 1;
}

@keyframes Toastify__trackProgress {
  0% {
    transform: scaleX(1);
  }
  to {
    transform: scaleX(0);
  }
}
.Toastify__progress-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  z-index: var(--toastify-z-index);
  opacity: 0.7;
  transform-origin: left;
}

.Toastify__progress-bar--animated {
  animation: Toastify__trackProgress linear 1 forwards;
}

.Toastify__progress-bar--controlled {
  transition: transform 0.2s;
}

.Toastify__progress-bar--rtl {
  right: 0;
  left: auto;
  transform-origin: right;
}

.Toastify__spinner {
  width: 20px;
  height: 20px;
  box-sizing: border-box;
  border: 2px solid;
  border-radius: 100%;
  border-color: var(--toastify-spinner-color-empty-area);
  border-right-color: var(--toastify-spinner-color);
  animation: Toastify__spin 0.65s linear infinite;
}

@keyframes Toastify__bounceInRight {
  0%, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }
  75% {
    transform: translate3d(10px, 0, 0);
  }
  90% {
    transform: translate3d(-5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInLeft {
  0%, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }
  75% {
    transform: translate3d(-10px, 0, 0);
  }
  90% {
    transform: translate3d(5px, 0, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}
@keyframes Toastify__bounceInUp {
  0%, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  75% {
    transform: translate3d(0, 10px, 0);
  }
  90% {
    transform: translate3d(0, -5px, 0);
  }
  to {
    transform: translateZ(0);
  }
}
@keyframes Toastify__bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}
@keyframes Toastify__bounceInDown {
  0%, 60%, 75%, 90%, to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }
  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }
  75% {
    transform: translate3d(0, -10px, 0);
  }
  90% {
    transform: translate3d(0, 5px, 0);
  }
  to {
    transform: none;
  }
}
@keyframes Toastify__bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }
  40%, 45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }
  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}
.Toastify__bounce-enter--bottom-left, .Toastify__bounce-enter--top-left {
  animation-name: Toastify__bounceInLeft;
}

.Toastify__bounce-enter--bottom-right, .Toastify__bounce-enter--top-right {
  animation-name: Toastify__bounceInRight;
}

.Toastify__bounce-enter--top-center {
  animation-name: Toastify__bounceInDown;
}

.Toastify__bounce-enter--bottom-center {
  animation-name: Toastify__bounceInUp;
}

.Toastify__bounce-exit--bottom-left, .Toastify__bounce-exit--top-left {
  animation-name: Toastify__bounceOutLeft;
}

.Toastify__bounce-exit--bottom-right, .Toastify__bounce-exit--top-right {
  animation-name: Toastify__bounceOutRight;
}

.Toastify__bounce-exit--top-center {
  animation-name: Toastify__bounceOutUp;
}

.Toastify__bounce-exit--bottom-center {
  animation-name: Toastify__bounceOutDown;
}

@keyframes Toastify__zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  50% {
    opacity: 1;
  }
}
@keyframes Toastify__zoomOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  to {
    opacity: 0;
  }
}
.Toastify__zoom-enter {
  animation-name: Toastify__zoomIn;
}

.Toastify__zoom-exit {
  animation-name: Toastify__zoomOut;
}

@keyframes Toastify__flipIn {
  0% {
    transform: perspective(400px) rotateX(90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }
  40% {
    transform: perspective(400px) rotateX(-20deg);
    animation-timing-function: ease-in;
  }
  60% {
    transform: perspective(400px) rotateX(10deg);
    opacity: 1;
  }
  80% {
    transform: perspective(400px) rotateX(-5deg);
  }
  to {
    transform: perspective(400px);
  }
}
@keyframes Toastify__flipOut {
  0% {
    transform: perspective(400px);
  }
  30% {
    transform: perspective(400px) rotateX(-20deg);
    opacity: 1;
  }
  to {
    transform: perspective(400px) rotateX(90deg);
    opacity: 0;
  }
}
.Toastify__flip-enter {
  animation-name: Toastify__flipIn;
}

.Toastify__flip-exit {
  animation-name: Toastify__flipOut;
}

@keyframes Toastify__slideInRight {
  0% {
    transform: translate3d(110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translateZ(0);
  }
}
@keyframes Toastify__slideInLeft {
  0% {
    transform: translate3d(-110%, 0, 0);
    visibility: visible;
  }
  to {
    transform: translateZ(0);
  }
}
@keyframes Toastify__slideInUp {
  0% {
    transform: translate3d(0, 110%, 0);
    visibility: visible;
  }
  to {
    transform: translateZ(0);
  }
}
@keyframes Toastify__slideInDown {
  0% {
    transform: translate3d(0, -110%, 0);
    visibility: visible;
  }
  to {
    transform: translateZ(0);
  }
}
@keyframes Toastify__slideOutRight {
  0% {
    transform: translateZ(0);
  }
  to {
    visibility: hidden;
    transform: translate3d(110%, 0, 0);
  }
}
@keyframes Toastify__slideOutLeft {
  0% {
    transform: translateZ(0);
  }
  to {
    visibility: hidden;
    transform: translate3d(-110%, 0, 0);
  }
}
@keyframes Toastify__slideOutDown {
  0% {
    transform: translateZ(0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, 500px, 0);
  }
}
@keyframes Toastify__slideOutUp {
  0% {
    transform: translateZ(0);
  }
  to {
    visibility: hidden;
    transform: translate3d(0, -500px, 0);
  }
}
.Toastify__slide-enter--bottom-left, .Toastify__slide-enter--top-left {
  animation-name: Toastify__slideInLeft;
}

.Toastify__slide-enter--bottom-right, .Toastify__slide-enter--top-right {
  animation-name: Toastify__slideInRight;
}

.Toastify__slide-enter--top-center {
  animation-name: Toastify__slideInDown;
}

.Toastify__slide-enter--bottom-center {
  animation-name: Toastify__slideInUp;
}

.Toastify__slide-exit--bottom-left, .Toastify__slide-exit--top-left {
  animation-name: Toastify__slideOutLeft;
}

.Toastify__slide-exit--bottom-right, .Toastify__slide-exit--top-right {
  animation-name: Toastify__slideOutRight;
}

.Toastify__slide-exit--top-center {
  animation-name: Toastify__slideOutUp;
}

.Toastify__slide-exit--bottom-center {
  animation-name: Toastify__slideOutDown;
}

@keyframes Toastify__spin {
  0% {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(1turn);
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.transaction-header {
  font-size: 22px;
  line-height: 26px;
  margin-bottom: 25px;
}

.pdf-viewer-block {
  margin: auto;
}

.pdf-pages {
  margin-bottom: 10px;
}
.pdf-pages:last-child {
  margin-bottom: 0px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.not-found-page-container {
  height: 100vh;
  padding: 10% 0 0 25%;
  background-color: #e6e6e6;
  margin: 0;
  color: #000000;
  font-family: "Segoe UI", Tahoma, sans-serif;
  cursor: auto;
}
.not-found-page-container img {
  height: 50px;
}
.not-found-page-container h1 {
  font-size: 22.5px;
  color: #202124;
  font-weight: 500;
  margin-block-start: 0.82em;
  margin-block-end: 0.67em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-family: "Segoe UI", Tahoma, sans-serif;
  cursor: auto;
}
.not-found-page-container p {
  font-size: 15px;
  font-weight: normal;
  color: #5f6368;
  display: block;
  margin-block-start: 1.2em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
.not-found-page-container p.error-404 {
  margin-block-start: 1.3em;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.react-tabs {
  -webkit-tap-highlight-color: transparent;
}

.react-tabs__tab-list {
  border-bottom: 1px solid #aaa;
  margin: 0 0 10px;
  padding: 0;
}

.react-tabs__tab {
  display: inline-block;
  border: 1px solid transparent;
  border-bottom: none;
  bottom: -1px;
  position: relative;
  list-style: none;
  padding: 6px 12px;
  cursor: pointer;
}

.react-tabs__tab--selected {
  background: #fff;
  border-color: #aaa;
  color: black;
  border-radius: 5px 5px 0 0;
}

.react-tabs__tab--disabled {
  color: GrayText;
  cursor: default;
}

.react-tabs__tab:focus {
  outline: none;
}

.react-tabs__tab:focus:after {
  content: "";
  position: absolute;
  height: 5px;
  left: -4px;
  right: -4px;
  bottom: -5px;
  background: #fff;
}

.react-tabs__tab-panel {
  display: none;
}

.react-tabs__tab-panel--selected {
  display: block;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.fsEdition-container {
  margin: 0 auto;
  position: relative;
  top: 2em;
}
.fsEdition-container h1 {
  font-size: 26px;
  text-align: center;
  color: #ffffff;
  line-height: 31.2px;
  font-family: volte_medium !important;
}
.fsEdition-container .instructions {
  font-size: 20px;
  line-height: 24px;
  text-align: center;
  color: #cdcee5;
  margin-top: 20px;
  margin-bottom: 24px;
  font-family: volte_medium !important;
}
.fsEdition-container .radio-block {
  background: none;
  padding: 20px;
  width: 396px;
  height: auto;
  margin: 0px auto 20px auto;
  border: 1px solid #564372;
  box-sizing: border-box;
  border-radius: 10px;
}
.fsEdition-container .radio-block .radio-text {
  font-size: 18px;
  color: #ffffff;
  font-family: volte_medium;
  float: left;
  width: 293px;
  margin-right: 1.8rem;
}
.fsEdition-container .radio-block .radio-button {
  margin: 0;
  right: 0;
  bottom: 4px;
}
.fsEdition-container .radio-block .radio-desc {
  color: #f3cbe3;
  line-height: 1.25;
  font-size: 16px;
  font-family: volte_medium;
  width: auto;
}
.fsEdition-container .second {
  background: none;
  padding: 20px;
  width: 396px;
  height: auto;
  margin: 0 auto 0px auto;
  border: 1px solid #564372;
  box-sizing: border-box;
  border-radius: 10px;
}
.fsEdition-container .second .radio-text {
  font-size: 18px;
  color: #ffffff;
  font-family: volte_medium;
  float: left;
  width: 293px;
  text-align: left;
  margin-right: 1.8rem;
}
.fsEdition-container .second .radio-button {
  margin: 0;
  right: 0;
  bottom: 4px;
}
.fsEdition-container .second .radio-desc {
  color: #f3cbe3;
  line-height: 1.25;
  font-size: 16px;
  font-family: volte_medium;
  width: auto;
}
.fsEdition-container .btn-block {
  width: 396px;
  margin: 0 auto;
  text-align: center;
}
.fsEdition-container .btn-block a {
  text-decoration: none;
}
.fsEdition-container .btn-block .button-margin {
  margin-bottom: 20px;
  margin-top: 60px;
}
.fsEdition-container .btn-block .button-text {
  font-size: 16px;
}
.fsEdition-container .btn-block .btn-link {
  color: #f3cbe3 !important;
  font-size: 16px;
  font-family: volte_medium, serif;
  cursor: pointer;
  margin-bottom: 100px;
}
.fsEdition-container .fs-img {
  text-align: center;
  margin-bottom: 40px;
}
.fsEdition-container .address-container .hidden {
  visibility: hidden;
}
.fsEdition-container .address-container .instructions {
  margin: 20px auto 0 auto;
}
.fsEdition-container .address-container .instructions.second {
  margin: 3 auto 30px auto;
}
.fsEdition-container .address-container .form {
  text-align: center;
  margin: 3.5em auto;
  width: 324px;
  height: auto;
}
.fsEdition-container .address-container .form .form-block {
  margin-bottom: 20px;
  text-align: left;
}
.fsEdition-container .address-container .form .form-block textarea {
  margin: 0 auto;
  width: 324px;
  height: 156px;
  display: block;
  font-family: volte_reg;
  padding: 10px 10px 14px 15px;
  color: #ffffff;
  background: #33354d;
  border-radius: 2px;
  box-sizing: border-box;
  border: 1px solid transparent;
  resize: none;
  font-size: 16px;
}
.fsEdition-container .address-container .form .form-block textarea:focus {
  outline: none;
}
.fsEdition-container .address-container .form .form-block .heading {
  font-size: 18px;
  line-height: 1.33;
  letter-spacing: normal;
  color: #a3a6c2;
  margin-bottom: 5px;
}
.fsEdition-container .address-container .form .form-block .value {
  color: #ffffff;
  font-size: 16px;
  width: 324px;
  margin: 0 auto;
  line-height: 18px;
}
.fsEdition-container .address-container .form .form-block .valued {
  color: #A3A6C2;
  font-size: 16px;
  width: 324px;
  margin: 0 auto;
  line-height: 16px;
  margin-bottom: 50px;
}
.fsEdition-container .installation-container .instructions {
  margin-bottom: 30px;
}
.fsEdition-container .installation-container .form {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3em;
  width: 396px;
  height: auto;
  margin-bottom: 60px;
}
.fsEdition-container .installation-container .form .form-block {
  margin-bottom: 10px;
}
.fsEdition-container .installation-container .form .form-block:first-child, .fsEdition-container .installation-container .form .form-block:last-child {
  margin-bottom: 30px;
}
.fsEdition-container .installation-container .form .form-block .heading {
  font-size: 16px;
  line-height: 0.94;
  letter-spacing: normal;
  text-align: left;
  color: #ffffff;
  margin-bottom: 5px;
}
.fsEdition-container .installation-container .form .form-block .select-box {
  width: 396px;
  height: 59px;
  background: #020005;
  border: 1px solid #564372;
  box-sizing: border-box;
  border-radius: 10px;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  color: #A3A6C2;
  padding-left: 1em;
}
.fsEdition-container .installation-container .form .form-block .select-box option {
  margin: 40px;
  padding: 20px;
}
.fsEdition-container .installation-container .btn-block {
  margin-left: auto;
  margin-right: auto;
}

@media only screen and (max-width: 600px) {
  .fsEdition-container {
    top: 5em;
  }
  .fsEdition-container h1 {
    font-size: 25px;
    line-height: 35px;
  }
  .fsEdition-container .instructions {
    font-size: 15px;
    line-height: 20px;
  }
  .fsEdition-container .radio-block {
    padding: 20px;
    width: 325px;
    height: auto;
  }
  .fsEdition-container .radio-block .radio-text {
    font-size: 16px;
    width: 230px;
  }
  .fsEdition-container .radio-block .radio-desc {
    line-height: 17px;
    font-size: 14px;
  }
  .fsEdition-container .second {
    padding: 20px;
    width: 325px;
    height: auto;
  }
  .fsEdition-container .second .radio-text {
    font-size: 16px;
    width: 230px;
  }
  .fsEdition-container .second .radio-desc {
    color: #f3cbe3;
    line-height: 17px;
    font-size: 14px;
    font-family: volte_medium;
    width: auto;
  }
  .fsEdition-container .btn-block {
    width: 324px;
  }
  .fsEdition-container .btn-block .btn-link {
    margin-bottom: 150px;
  }
  .fsEdition-container .installation-container .form {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    margin-top: 3em;
    margin-bottom: 140px;
    width: 324px;
  }
  .fsEdition-container .installation-container .form .form-block {
    margin-bottom: 10px;
  }
  .fsEdition-container .installation-container .form .form-block:first-child, .fsEdition-container .installation-container .form .form-block:last-child {
    margin-bottom: 30px;
  }
  .fsEdition-container .installation-container .form .form-block .select-box {
    width: 324px;
  }
  .fsEdition-container .installation-container .form .form-block .select-box option {
    margin: 40px;
    padding: 20px;
  }
  .fsEdition-container .installation-container .btn-block {
    margin-left: auto;
    margin-right: auto;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

button:focus,
button:active {
  -webkit-tap-highlight-color: transparent;
  -moz-tap-highlight-color: transparent;
  -o-tap-highlight-color: transparent;
}

.btn {
  font-family: volte_semiBold;
  line-height: 1.2;
  padding: 13px 40px;
  border-radius: 25px;
  color: #000000;
  transition: all 0.3s ease;
  margin-right: 12px;
  margin-bottom: 10px;
  cursor: pointer;
}

/*.btn[disabled],
.btn[disabled]:hover {
  background: $gray-color !important;
  color: $black-color !important;
  cursor: not-allowed;
  border-color: #ccc;
}*/
.btn-block {
  width: 100%;
}

.primary-btn {
  color: #ffffff;
  background-blend-mode: normal, overlay;
  background: #e10092;
  font-size: 16px;
  border: solid 2px #e10092;
  cursor: pointer;
}
.primary-btn:hover {
  color: #ffffff;
  border: 2px solid #ffffff;
  transition: 0ms;
}

.primary-btn[disabled] {
  background: #8e81a1;
  color: #ffffff;
  cursor: not-allowed !important;
  border: 2px solid #8e81a1;
}
.primary-btn[disabled]:hover {
  box-shadow: none;
}

.secondary-btn {
  background: #ffffff;
  color: #5087c7;
  border: solid 1px #5087c7;
  box-shadow: none;
}
.secondary-btn:hover {
  color: #ffffff;
  background-image: linear-gradient(to right, #5087c7, #f18931);
}

.secondary-btn[disabled] {
  background: #ffffff;
  color: #52547a;
  cursor: not-allowed;
  border: solid 1px #52547a;
}
.secondary-btn[disabled]:hover {
  box-shadow: none;
}

.large-button {
  width: 330px;
}

.button-tag {
  display: inline-block;
  cursor: pointer;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.page-heading {
  color: #ffffff;
}
.page-heading .page-main-heading {
  font-size: 35px;
  font-family: volte_medium;
}
.page-heading .page-sub-heading {
  font-size: 14px;
  margin-top: 8px;
  font-family: volte_medium !important;
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .page-heading .page-main-heading {
    font-size: 32px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.my-offers-container {
  width: 100%;
}
.my-offers-container .card {
  width: 30%;
  display: inline-block;
  float: left;
  margin: 0 1%;
  background: #33354d;
  padding: 20px;
  box-sizing: border-box;
}
.my-offers-container .card .card-image img {
  width: 100%;
  height: 200px;
  object-fit: contain;
}
.my-offers-container .card .card-content {
  margin-top: 5px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.loader-container {
  width: 100%;
  position: fixed;
  bottom: 0;
  height: 100vh;
  display: flex;
  justify-content: center;
  overflow: hidden;
  align-items: center;
  z-index: 10001;
  text-align: center;
}
.loader-container img.scroll-loader {
  width: 200px;
  height: 200px;
  text-align: center;
}
@media only screen and (max-width: 480px) {
  .loader-container img.scroll-loader {
    width: 150px;
    height: 150px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.no-data {
  padding: 40px 0px;
  margin-bottom: 30px;
  text-align: center;
  color: #ffffff;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.radio-button {
  margin: 10px 0px;
  position: relative;
}
.radio-button label {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #564372;
  display: inline-block;
  overflow: hidden;
}
.radio-button label i.icon-check {
  display: none;
  font-size: 1.143rem;
}
.radio-button input[type=radio] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 1;
}
.radio-button input[type=radio]:disabled + label {
  opacity: 0.3;
}
.radio-button input[type=radio]:checked + label {
  border-color: #e10092;
  background-color: #e10092;
}
.radio-button input[type=radio]:checked + label i.icon-check {
  display: block;
}
.radio-button input[type=radio]:checked + label i.icon-check:after {
  width: 6px;
  height: 6px;
  border-radius: 100%;
  background: white;
  content: "";
  display: block;
  margin: 8px;
}
.radio-button input[type=radio]:checked + label i.icon-check:before {
  content: none;
}
.radio-button .radio-text {
  color: #000000;
  margin-left: 10px;
  position: relative;
  bottom: 4px;
}

.select-content {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50%;
  background: #564372;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.device-management-container {
  padding: 0;
  margin-top: 10px;
}
.device-management-container .device-management-heading h2 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  margin-bottom: 20px;
}
.device-management-container .device-management-sub-heading-section .logged-in h2 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 22px;
  line-height: 120%;
  margin-bottom: 10px;
}
.device-management-container .device-management-sub-heading-section .logged-in p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 120%;
  color: #ffffff;
  width: 100%;
  opacity: 0.9;
}
.device-management-container .device-section {
  margin-top: 12px;
  width: 100%;
  color: #ffffff;
}
.device-management-container .device-section .device-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: start;
  gap: 12px 20px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
.device-management-container .device-section .device-container .icon-delete .path1::before {
  color: #e10092;
}
.device-management-container .device-section .device-container div.device-left > i {
  font-size: 19px;
}
.device-management-container .device-section .device-section-head {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 110%;
  color: #ffffff;
}
.device-management-container .device-section .delete-device {
  cursor: pointer;
}
.device-management-container .device-section .device {
  border: 1px solid #564372;
  box-sizing: border-box;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  padding: 16px 12px 16px 12px;
  cursor: pointer;
}
.device-management-container .device-section .device .device-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.device-management-container .device-section .device .last-activity {
  font-size: 14px;
  font-weight: 500;
  line-height: 16.8px;
  color: #8E81A1;
  margin-top: 6px;
  font-family: volte_medium;
}
.device-management-container .device-section .device .last-activity b {
  font-family: volte_semiBold;
}
.device-management-container .device-section .device .primary-msg {
  font-family: volte_reg;
  font-size: 12px;
  font-weight: 500;
  line-height: 14.4px;
  color: #8E81A1;
  text-align: left;
  margin-top: 6px;
}
.device-management-container .device-section .device .device-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 70%;
}
.device-management-container .device-section .device .device-left .web-icon {
  max-width: 20px;
  max-height: 20px;
}
.device-management-container .device-section .device .device-left .mobile-icon {
  max-width: 20px;
  max-height: 20px;
}
.device-management-container .device-section .device .device-left .tv-icon {
  max-width: 20px;
  max-height: 20px;
}
.device-management-container .device-section .device .device-right {
  width: 30%;
}
.device-management-container .device-section .device .device-right-tv {
  margin: -15px;
}
.device-management-container .device-section .device span {
  margin-left: 10px;
}
.device-management-container .device-section .device span.device-name {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  color: #ffffff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 200px;
  padding-top: 1px;
}
.device-management-container .device-section .device span.this-device {
  color: #8E81A1;
  font-size: 14px;
  position: relative;
  font-weight: 400;
  line-height: 110%;
  font-family: volte_semiBold;
}
.device-management-container .device-section .device-count {
  justify-content: end;
  width: 100%;
  font-size: 12px;
  font-family: volte_reg;
  color: #d6c6f4;
  margin-top: 8px;
}
.device-management-container .device-section .tv-device {
  display: flex;
  justify-content: space-between;
  width: 420px;
  margin-top: -6px;
}
.device-management-container .device-section .device-count,
.device-management-container .device-section .tv-device > span {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  line-height: 20px;
  text-align: right;
  color: #d6c6f4;
}
.device-management-container .select-content {
  width: 22px !important;
  height: 22px !important;
}
.device-management-container .select-content.active {
  background: #E10092;
}
.device-management-container .select-content img {
  width: 22.7px;
  height: 40px;
}
.device-management-container .button-container {
  margin-top: 30px;
}
.device-management-container .button-container .primary-btn {
  font-size: 20px;
}
.device-management-container .button-container .primary-btn:hover {
  color: #ffffff;
  border: solid 2px #e10092;
  transition: 0ms;
}
.device-management-container .button-container .primary-btn[disabled]:hover {
  border: 2px solid #8e81a1;
}
.device-management-container .button-container .btn {
  border-radius: 4px;
  padding: 11px 0px;
  width: 280px;
}
.device-management-container .alert-icon {
  font-size: 36px;
  margin-right: 10px;
}

@media only screen and (max-width: 945px) {
  .device-management-container {
    margin-top: 32px;
    width: 100%;
  }
}
@media (min-width: 768px) and (max-width: 1115px) {
  .device-management-container .device-section .device-container {
    grid-template-columns: repeat(1, 1fr);
  }
}
.device-management-modal .popupSec {
  box-sizing: border-box;
  width: 640px;
  text-align: center;
  border-radius: 16px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
}
.device-management-modal .popupSec .modal-body {
  padding: 30px;
}
.device-management-modal .popupSec .modal-body h1 {
  font-style: normal;
  font-weight: normal;
  font-family: volte_medium;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  margin-top: 10px;
}
.device-management-modal .popupSec .modal-body .alert-icon {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 100%;
  height: 40px;
}
.device-management-modal .popupSec .modal-body .alert-icon .icon-remove-phone-upd::before {
  font-size: 40px;
}
.device-management-modal .popupSec .modal-body .btn-group {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0px auto;
}
.device-management-modal .popupSec .modal-body .primary-btn {
  width: 280px;
  height: 44px;
  font-size: 16px;
  font-family: volte_semiBold;
  margin: 20px 0px;
}
.device-management-modal .popupSec .modal-body .secondary-btn {
  width: 280px;
  color: #f3cbe3;
  font-size: 16px;
  border: none;
  background: none;
  font-family: volte_medium;
  margin: 0px;
  padding: 0px;
}
.device-management-modal .popupSec .modal-body .btn :hover {
  cursor: pointer;
}

@media only screen and (max-width: 768px) {
  .device-management-modal .popupSec {
    border-radius: 50%;
  }
  .device-management-modal .popupOuter .popupSec {
    width: 75%;
    border-radius: 20px;
  }
  .device-management-modal .popupOuter .popupSec .modal-body {
    padding: 35px 20px 30px;
  }
  .device-management-modal .popupOuter .popupSec .modal-body p {
    width: 280px;
    padding: 0px;
  }
  .device-management-modal .popupOuter .popupSec h1 {
    font-size: 20px;
  }
  .device-management-container {
    padding: 0;
    margin-top: 0;
  }
  .device-management-container .device-management-heading h2 {
    font-size: 19px;
    margin-bottom: 22px;
  }
  .device-management-container .device-management-sub-heading-section .logged-in h2 {
    font-size: 20px;
    margin-bottom: 8px;
  }
  .device-management-container .device-management-sub-heading-section .logged-in p {
    width: 100%;
    font-size: 14px;
    font-weight: 400;
    line-height: 16.8px;
    font-family: volte_reg;
  }
  .device-management-container .device-section {
    margin-top: 4px;
  }
  .device-management-container .device-section .device-container {
    display: flex;
    gap: 0;
  }
  .device-management-container .device-section .device {
    margin: 12px 0px 0 0;
    width: 100%;
  }
  .device-management-container .device-section .device .this-device {
    font-family: volte_medium;
  }
  .device-management-container .device-section .device-count {
    width: 100% !important;
  }
  .device-management-container .device-section .tv-device {
    margin-top: 7px;
  }
  .device-management-container .tv-device,
  .device-management-container .device-count {
    margin-top: 7px;
  }
  .device-management-container .button-container {
    width: 90%;
    position: fixed;
    bottom: 16px;
    bottom: 50px;
  }
  .device-management-container .button-container.login-btn {
    bottom: 16px;
  }
  .device-management-container .button-container .btn {
    width: 100%;
    font-size: 16px;
    padding: 13.5px 70.5px;
  }
}
@media only screen and (max-width: 480px) {
  .device-management-modal .popupOuter .popupSec {
    width: 320px;
  }
}
div.main-container.bottom-margin.top-margin > div.device-management-container.addPadding {
  padding: 10px 20px;
}
div.main-container.bottom-margin.top-margin > div.device-management-container.addPadding .not-now {
  cursor: pointer;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #f3cbe3;
  margin-top: 73px;
  text-align: center;
  position: fixed;
  bottom: 23px;
  left: 44%;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.selection-container {
  position: relative;
  height: auto;
}

.languageId-subHeading {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  color: #a3a6c2;
  padding: 0;
  margin: 10px 0;
}

.languageId-container {
  display: flex;
  flex-wrap: wrap;
  column-gap: 11px;
  justify-content: flex-start;
}

.languageId-innercontainer {
  width: 200px;
  height: 52px;
  display: flex;
  border-radius: 6px;
  cursor: pointer;
  margin-top: 20px;
  border: 2px solid #564372;
  background: #220046;
  justify-content: end;
  position: relative;
}
@media only screen and (min-width: 768px) {
  .languageId-innercontainer:hover {
    border: 2px solid #ffffff;
  }
}
.languageId-innercontainer .select-content {
  margin: 0px 6px 0px 8px;
}
.languageId-innercontainer .language-contr {
  display: flex;
  align-items: center;
  position: absolute;
  left: 0;
  top: 7px;
}
.languageId-innercontainer .language-contr .language-name-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.languageId-innercontainer .language-contr .language-name-wrapper img {
  width: auto;
  height: 100%;
}
.languageId-innercontainer .language-contr .language-name-wrapper .language-name {
  left: 15px;
  top: 15px;
  bottom: 15px;
  text-align: justify;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  color: #ffffff;
}
.languageId-innercontainer .language-contr .language-name-wrapper .language-image {
  height: 14px;
}
.languageId-innercontainer .lang-contr-image {
  top: 14px;
}
.languageId-innercontainer .celebrity-image {
  width: 48%;
}
.languageId-innercontainer .celebrity-image img {
  height: 100%;
  width: 100%;
  border-bottom-right-radius: 4px;
}
.languageId-innercontainer .celebrity-image img.broken-image {
  display: none;
}

.save-prefernces-button {
  width: 280px;
  height: 44px;
  background: #e10092;
  border-radius: 100px;
  outline: none;
  margin: 20px 0;
  border: none;
  cursor: pointer;
  color: #ffffff;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
}
.save-prefernces-button.swipe-screen {
  transform: translate(-50%, 0);
  position: absolute;
  top: 16%;
}
.save-prefernces-button .button-text {
  font-family: volte_medium !important;
}

.save-prefernces-button[disabled] {
  background: #8e81a1;
  color: #ffffff;
  cursor: not-allowed !important;
  border: none;
}
.save-prefernces-button[disabled]:hover {
  box-shadow: none;
}

.selected-language-btn {
  width: 202px;
  height: 40px;
  background: #e10092;
  border-radius: 22px;
  outline: none;
  margin: 20px 0;
  border: none;
  cursor: pointer;
  color: #ffffff;
  font-style: normal;
  font-size: 16px;
  font-weight: 600;
  line-height: 100%;
}

.not-click {
  color: #f3cbe3;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  cursor: pointer;
  margin-bottom: 15px;
}
@media only screen and (max-width: 480px) {
  .not-click {
    font-size: 16px;
  }
}
.not-click:focus-visible {
  outline: none;
}
.not-click.swipe-screen-not-click {
  position: absolute;
  top: 33%;
  left: 0;
  right: 0;
}

.toast-body-container {
  display: flex;
  align-items: center;
}
.toast-body-container .toast-success-image {
  margin-right: 10px;
  width: 40px;
  height: 40px;
}
.toast-body-container .toast-success-image img {
  width: 100%;
  height: 100%;
}
.toast-body-container .toast-message-text {
  display: flex;
  font-family: volte_medium;
  line-height: 110%;
  color: #ffffff;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
}

.lang-toast-wrapper {
  display: flex;
  align-items: center;
  border: 1px solid #564372;
  bottom: -130px;
  font-family: volte_medium !important;
  border-radius: 10px;
  background: linear-gradient(315deg, #A22736 0%, #220046 100%);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
  margin: 0 auto;
}

.Toastify__toast {
  width: 720px !important;
  border-radius: 10px !important;
}
.Toastify__close-button {
  padding-top: 0.8% !important;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .languageId-innercontainer {
    width: 154px;
    height: 52px;
    display: flex;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 12px;
    border: 2px solid #564372;
    background: #220046;
  }
  .language-name-wrapper .language-name {
    font-family: volte_reg !important;
  }
  .save-prefernces-button {
    width: 320px;
    height: 46px;
    cursor: pointer;
    z-index: 1000;
  }
  .languageId-container {
    width: 318px;
    margin-left: auto;
    margin-right: auto;
    column-gap: unset;
    justify-content: space-between;
  }
  .toast-body-container {
    width: 100%;
  }
  .toast-body-container .toast-success-image {
    margin-right: 10px;
    width: 8%;
    height: 24px;
  }
  .toast-body-container .toast-message-text {
    font-size: 14px;
    width: 92%;
  }
  .lang-toast-wrapper {
    bottom: -28%;
    height: 52px !important;
    width: 98% !important;
  }
  .celebrity-image {
    width: 55% !important;
  }
  .Toastify__toast.lang-toast-wrapper {
    width: 95% !important;
  }
}
@media only screen and (max-device-width: 320px) {
  .languageId-innercontainer {
    width: 140px;
  }
  .languageId-container {
    width: 290px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.movie-popup-movie {
  margin-top: 47px;
}

.movie-popup .prev-next {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}
.movie-popup .prev-next .container-link {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.movie-popup .prev-next .container-link .arrow {
  height: 15px;
  width: 15px;
}
.movie-popup .language-section img {
  width: 20px;
  height: 20px;
}
.movie-popup .popup-desc {
  padding: 5px 0;
}

.image-container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 41px;
}
.image-container .season-container {
  width: 310px;
  height: 173px;
  margin-right: 0;
  margin-bottom: 20px;
  border-radius: 10px;
}
.image-container .image-season-container {
  position: relative;
}
.image-container .season-image {
  width: 100%;
  height: 173px;
  border-radius: 5px;
  opacity: 1;
}
.image-container .video-icon {
  position: absolute;
  top: 45%;
  left: 45%;
  width: 30px;
  height: 30px;
}
.image-container .duration {
  position: absolute;
  top: 10px;
  right: 10px;
  color: white;
}

.popup-header {
  font-size: 26px;
  margin-bottom: 10px;
  color: white;
  font-family: volte_medium;
}

.desc-scroll-mobile {
  max-height: 80px;
  overflow: auto;
}

.desc-scroll-large {
  max-height: 100px;
  overflow: auto;
  margin-bottom: 10px;
}

.popup-header-brand {
  font-size: 26px;
  color: #ffffff;
  font-family: volte_medium;
  margin-bottom: 20px;
}

.popup-desc {
  font-size: 16px;
  color: #ffffff;
  text-align: left;
  font-family: volte_reg;
  line-height: 19.2px;
  height: 58px;
}

.movie-popup-divider {
  border-bottom: 1px solid #564372;
  margin-top: 10px;
  margin-bottom: 20px;
}

.divider-header-threedots {
  border-bottom: 1px solid #564372;
  margin-top: -10px;
  margin-bottom: 10px;
}

.movie-popup-detail-title {
  font-size: 16px;
  color: #a3a6c2;
  text-align: left;
  font-family: volte_reg;
}

.wrap-text {
  flex-direction: row;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

.movie-popup-detail-subtitle {
  font-size: 16px;
  color: white;
  text-align: left;
  padding-top: 5px;
  font-family: volte_reg;
}
.movie-popup-detail-subtitle span {
  margin: auto 2px;
}

.close-link {
  font-size: 16px;
  color: #f3cbe3;
  cursor: pointer;
  padding-right: 10px;
  padding-left: 10px;
  padding-bottom: 17px;
  padding-top: 28px;
  position: relative;
  top: -5px;
}

.close-container {
  margin-top: 0;
  border: 2px solid #f3cbe3;
  box-sizing: border-box;
  border-radius: 100px;
  width: 156px;
  height: 46px;
  padding: 13px 0px;
  margin-left: calc(50% - 78px);
  margin-bottom: 8%;
}

@media only screen and (max-width: 480px) {
  .popup-desc {
    font-size: 16px;
    line-height: 120%;
    color: #ffffff;
    height: 79px;
    padding-top: 2px;
  }
  .close-container {
    border: none;
  }
}
@media only screen and (max-width: 769px) {
  .series-desc {
    padding-top: 3px;
    height: auto;
  }
  .image-container {
    margin-top: 33px;
  }
  .image-container .season-container {
    margin-bottom: 0;
    margin-right: 0;
    width: 156px;
    height: 89px;
  }
  .image-container .season-image {
    height: 89px;
  }
  .image-container .video-icon {
    top: 35%;
    width: 23px;
    height: 23px;
  }
  .movie-popup {
    margin-top: 35px;
    margin-left: 20px;
    margin-right: 20px;
    position: relative;
    z-index: 1;
  }
  .movie-popup-series {
    margin-top: 19px;
  }
  .popup-header {
    font-size: 22px;
  }
  .popup-header-brand {
    font-size: 16px;
    color: #ffffff;
    line-height: 19.2px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.language-section {
  display: flex;
  margin-top: 25px;
  margin-bottom: 25px;
  justify-content: center;
}
.language-section img {
  height: 24px;
  width: 24px;
}
.language-section .language-section-container {
  display: flex;
  margin-left: 15px;
  align-items: center;
  width: 95%;
  flex-wrap: wrap;
}
.language-section .language-popup-center {
  width: auto;
}
.language-section .language-block {
  display: flex;
  align-items: center;
}
.language-section .language-text {
  font-size: 16px;
  color: #ffffff;
  padding-right: 11px;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
}
.language-section .bullet-points {
  height: 8px;
  width: 8px;
  background-color: #ffffff;
  border-radius: 8px;
  margin-right: 8px;
}

@media only screen and (max-width: 769px) {
  .language-section {
    margin-top: 25px;
    margin-bottom: 25px;
    padding: 0 6.9%;
  }
  .language-section img {
    height: 16.17px;
    width: 16.17px;
    margin-right: 7px;
  }
  .language-section .language-text {
    font-size: 12px;
    padding-right: 7px;
  }
  .language-section .bullet-points {
    height: 4px;
    width: 4px;
    border-radius: 4px;
  }
  .language-section .language-section-container {
    margin-left: 0;
    width: 95%;
    flex-wrap: wrap;
  }
  .language-section .language-popup-center {
    width: auto;
  }
  .mobile-movie-popup {
    justify-content: center;
    align-items: center;
    padding: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.otp-container {
  width: 320px;
  margin: auto;
}
.otp-container .hide-timer {
  justify-content: end !important;
}
.otp-container.otp-four-container {
  width: 300px;
}
.otp-container.otp-four-container .otp-placeholder {
  font-size: 14px;
  padding-bottom: 5px;
  font-family: volte_medium;
}
.otp-container.otp-four-container .otp-resend-container {
  margin-top: 5px;
}
.otp-container.otp-four-container .otp-resend-container .timer-container {
  font-size: 14px;
  font-family: volte_medium;
}
.otp-container.otp-four-container .otp-resend-container .resend-btn a {
  font-size: 16px;
  font-family: volte_medium;
  line-height: 120%;
  font-family: 400;
}
.otp-container.otp-four-container .otp-input-wrapper .editable-container {
  margin-right: 16px;
  width: 44px;
  height: 44px;
  font-size: 24px;
}
.otp-container.otp-four-container .otp-input-wrapper .editable-container.editable-container {
  line-height: 162%;
}
.otp-container.smart-tv-screen .otp-resend-container {
  justify-content: center;
}
.otp-container .otp-resend-container {
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 3px;
}
.otp-container .otp-resend-container .timer-container {
  font-family: volte_medium;
  color: #ffffff;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}
.otp-container .otp-resend-container .resend-btn a {
  font-family: volte_semiBold;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 18px;
  color: #f3cbe3;
  cursor: pointer;
}
.otp-container .otp-resend-container .disabled-resend-button a {
  cursor: default;
  opacity: 0.2;
}
.otp-container .otp-placeholder {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 24px;
  color: #ffffff;
  display: flex;
}
.otp-container.smart-tv-screen .otp-input-wrapper input,
.otp-container.smart-tv-screen .otp-input-wrapper .editable-container {
  width: 44px;
  height: 44px;
  margin-right: 6px;
  font-family: volte_reg;
  line-height: 200% !important;
}
.otp-container .otp-input-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.otp-container .otp-input-wrapper.smart-tv-screen input,
.otp-container .otp-input-wrapper.smart-tv-screen .editable-container {
  width: 44px;
  height: 44px;
  margin-right: 6px;
  font-family: volte_reg;
}
.otp-container .otp-input-wrapper input,
.otp-container .otp-input-wrapper .editable-container {
  background: #020005;
  border: solid 1px #564372;
  width: 38px;
  height: 40px;
  color: #ffffff;
  border-radius: 12px;
  text-align: center;
  margin-right: 11px;
  font-style: normal;
  font-weight: normal;
  font-size: 22px;
  line-height: 120%;
  font-family: sky_reg;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  position: relative;
}
.otp-container .otp-input-wrapper input:focus,
.otp-container .otp-input-wrapper .editable-container:focus {
  outline: 0;
}
.otp-container .otp-input-wrapper input.editable-container,
.otp-container .otp-input-wrapper .editable-container.editable-container {
  line-height: 152%;
}
.otp-container .otp-input-wrapper input.cursor-moz,
.otp-container .otp-input-wrapper .editable-container.cursor-moz {
  text-align: justify;
  padding-left: 18px;
}
.otp-container .otp-input-wrapper input:last-child,
.otp-container .otp-input-wrapper .editable-container:last-child {
  margin-right: 0;
}
.otp-container .otp-input-wrapper input::placeholder,
.otp-container .otp-input-wrapper .editable-container::placeholder {
  font-size: 23px;
}
.otp-container .incorrect-otp input,
.otp-container .incorrect-otp .editable-container {
  border: 1px solid #e56c6c;
}
.otp-container .otp-mask input,
.otp-container .otp-mask .editable-container {
  font-family: password_mask;
}
.otp-container .error-message {
  font-family: volte_medium;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  color: #e56c6c;
  margin-left: 5px;
}

@media only screen and (max-width: 300px) {
  .otp-container {
    width: 100%;
    padding: 0 10px;
    margin-top: 14px;
  }
  .otp-container .otp-input-wrapper input,
  .otp-container .otp-input-wrapper .editable-container {
    width: 30px;
    height: 30px;
    margin-right: 8px;
  }
}
@media only screen and (max-width: 320px) {
  .otp-container {
    width: 90%;
  }
  .otp-container .otp-input-wrapper input,
  .otp-container .otp-input-wrapper .editable-container {
    width: 32px;
    height: 35px;
  }
}
@media only screen and (max-width: 480px) {
  .otp-container {
    margin-top: 20px;
    margin-bottom: 18px;
  }
  .otp-container.otp-four-container {
    width: 300px;
  }
  .otp-container.otp-four-container .otp-placeholder {
    font-size: 14px;
    line-height: 24px;
    padding-bottom: 6px;
    justify-content: center;
  }
  .otp-container.otp-four-container .otp-input-wrapper .editable-container {
    margin-right: 12px;
  }
  .otp-container.otp-four-container .otp-input-wrapper .editable-container.editable-container {
    line-height: 170%;
  }
  .otp-container.otp-four-container .otp-resend-container {
    margin-top: 6px;
  }
  .otp-container.otp-four-container .otp-resend-container .timer-container {
    font-size: 14px;
  }
  .otp-container.otp-four-container .otp-resend-container .resend-btn a {
    font-size: 14px;
  }
  .otp-container .otp-input-wrapper input,
  .otp-container .otp-input-wrapper .editable-container {
    border-radius: 8px;
    width: 12%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/* Slider */
.slick-slider {
  position: relative;
  display: block;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -khtml-user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent;
}

.slick-list {
  position: relative;
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

.slick-list:focus {
  outline: none;
}

.slick-list.dragging {
  cursor: pointer;
  cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}

.slick-track {
  position: relative;
  top: 0;
  left: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.slick-track:before,
.slick-track:after {
  display: table;
  content: "";
}

.slick-track:after {
  clear: both;
}

.slick-loading .slick-track {
  visibility: hidden;
}

.slick-slide {
  display: none;
  float: left;
  height: 100%;
  min-height: 1px;
}

[dir=rtl] .slick-slide {
  float: right;
}

.slick-slide img {
  display: block;
}

.slick-slide.slick-loading img {
  display: none;
}

.slick-slide.dragging img {
  pointer-events: none;
}

.slick-initialized .slick-slide {
  display: block;
}

.slick-loading .slick-slide {
  visibility: hidden;
}

.slick-vertical .slick-slide {
  display: block;
  height: auto;
  border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
  display: none;
}
@charset "UTF-8";
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/* Slider */
.slick-loading .slick-list {
  background: #fff url(/fb6f3c230cb846e25247dfaa1da94d8f.gif) center center no-repeat;
}

/* Icons */
@font-face {
  font-family: "slick";
  font-weight: normal;
  font-style: normal;
  src: url(/a4e97f5a2a64f0ab132323fbeb33ae29.eot);
  src: url(/a4e97f5a2a64f0ab132323fbeb33ae29.eot?#iefix) format("embedded-opentype"), url(/295183786cd8a138986521d9f388a286.woff) format("woff"), url(/c94f7671dcc99dce43e22a89f486f7c2.ttf) format("truetype"), url(/2630a3e3eab21c607e21576571b95b9d.svg#slick) format("svg");
}
/* Arrows */
.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 20px;
  height: 20px;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
  color: transparent;
  outline: none;
  background: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
  opacity: 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
  opacity: 0.25;
}

.slick-prev:before,
.slick-next:before {
  font-family: "slick";
  font-size: 20px;
  line-height: 1;
  opacity: 0.75;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
  left: -25px;
}

[dir=rtl] .slick-prev {
  right: -25px;
  left: auto;
}

.slick-prev:before {
  content: "←";
}

[dir=rtl] .slick-prev:before {
  content: "→";
}

.slick-next {
  right: -25px;
}

[dir=rtl] .slick-next {
  right: auto;
  left: -25px;
}

.slick-next:before {
  content: "→";
}

[dir=rtl] .slick-next:before {
  content: "←";
}

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px;
}

.slick-dots {
  position: absolute;
  bottom: -25px;
  display: block;
  width: 100%;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: 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;
  color: transparent;
  border: 0;
  outline: none;
  background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  font-family: "slick";
  font-size: 6px;
  line-height: 20px;
  position: absolute;
  top: 0;
  left: 0;
  width: 20px;
  height: 20px;
  content: "•";
  text-align: center;
  opacity: 0.25;
  color: black;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
  opacity: 0.75;
  color: black;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

section.login-slider {
  margin: 17px 0;
}
section.login-slider .marquee {
  overflow: hidden;
  pointer-events: none;
  display: flex;
  flex-direction: row;
  align-items: center;
}
section.login-slider .marquee-inner {
  width: fit-content;
  display: flex;
  position: relative;
  transform: translate3d(calc(-25% + 20vw), 0, 0);
  animation: marquee 30s linear infinite;
  animation-play-state: paused;
  opacity: 0;
  transition: opacity 0.1s;
  pointer-events: none;
}
section.login-slider .marquee .marquee-inner {
  animation-play-state: running;
  opacity: 1;
  transition-duration: 0.4s;
  white-space: nowrap;
}
@keyframes marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
section.login-slider .login-slider-item {
  width: 50px;
  margin: 0 10px;
}
section.login-slider .login-slider-item img {
  width: 50px;
  height: 50px;
  border-radius: 3.45282px;
  cursor: default;
}
@media only screen and (max-width: 480px) {
  section.login-slider {
    margin: 20px 0;
  }
  section.login-slider .login-slider-item {
    width: 36px;
    margin: 0 5px;
  }
  section.login-slider .login-slider-item img {
    width: 36px;
    height: 36px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.rmn-input-container .form-data {
  width: 420px;
  height: 44px;
  margin: auto;
}
.rmn-input-container .form-data .initialVal {
  font-size: 16px;
  font-family: volte_medium;
  color: #e9e9e9;
  top: -1px;
  left: 0;
  padding: 10px 8px 10px 10px;
  font-style: normal;
  font-weight: normal;
  line-height: 24px;
}
.rmn-input-container .form-data input {
  width: 100%;
  height: 44px;
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  box-sizing: border-box;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  outline: none;
  font-family: volte_medium;
  color: #ffffff;
  background: #020005;
  border: solid 1px #564372;
}
.rmn-input-container .form-data input::placeholder {
  color: #8a8ba7;
}
.rmn-input-container .form-data input:focus {
  outline: none;
  border: 1px solid #444764;
}
.rmn-input-container .form-data .error-message {
  margin-top: 8px;
  font-family: volte_medium;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.rmn-input-container .form-data input[type=tel] {
  padding: 8px 10px 10px 43px;
}
.rmn-input-container .button-container .get-otp-btn {
  margin-bottom: 20px;
  width: 280px;
  height: 46px;
  border-radius: 24px;
  margin-right: 0;
  cursor: pointer;
  padding: 12.5px;
}
.rmn-input-container .button-container .get-otp-btn .button-text {
  font-family: volte_semiBold;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px;
  text-align: center;
  color: #ffffff;
}
.rmn-input-container .login-license {
  padding: 20px 0;
}
.rmn-input-container .login-license p {
  color: #ffffff;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 120%;
  text-align: center;
}
.rmn-input-container .login-license p span {
  text-decoration: none;
}
.rmn-input-container .login-license p span a {
  padding-left: 1px;
  text-decoration: none;
  color: #f3cbe3;
}
.rmn-input-container .rmn-not-now {
  cursor: pointer;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #f3cbe3;
}

.incorrect-input-container .form-data input {
  border: 1px solid #e56c6c;
}

@media only screen and (max-width: 480px) {
  .rmn-input-container .form-data {
    width: 320px;
  }
  .rmn-input-container .login-license {
    padding: 20px 0;
  }
  .rmn-input-container .button-container {
    margin-bottom: 20px;
  }
  .rmn-input-container .button-container .get-otp-btn {
    width: 320px;
    height: 46px;
    border-radius: 22px;
    line-height: 18px;
    padding: 0;
    margin: 0;
  }
  .rmn-input-container .button-container .get-otp-btn .button-text {
    line-height: 18px;
  }
  .rmn-input-container .rmn-not-now {
    margin-bottom: 18px;
  }
}
@media only screen and (max-width: 320px) {
  .rmn-input-container .form-data {
    width: 90%;
  }
  .rmn-input-container .button-container .get-otp-btn {
    width: 90%;
  }
}
.login-fail {
  display: flex;
  align-items: center;
  border: 2px solid #564372;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15) !important;
}

.login-not-now {
  display: flex;
  align-items: center;
}
.login-not-now .text-fail {
  display: flex;
  font-family: volte_medium;
  font-style: normal;
  flex: 1;
  letter-spacing: 0.8px;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  color: #ffffff;
}
.login-not-now .text-fail div:nth-child(2) {
  color: #f3cbe3;
}
.login-not-now i {
  font-size: 36px;
  margin-right: 31px;
}

@media only screen and (max-width: 480px) {
  .login-fail {
    align-items: center;
    height: 48px !important;
  }
  .login-fail .text-fail {
    font-size: 14px;
    letter-spacing: 0.2px;
    line-height: 20px;
    font-weight: normal;
    flex: none;
  }
  .login-fail .text-fail div:first-child {
    margin-right: 5px;
  }
  .login-fail .login-not-now i {
    font-size: 22px;
    margin-right: 10px;
    margin-bottom: 4px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.subscriber-list-header {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  color: #ffffff;
  margin: 12px 0;
  font-size: 24px;
}

.subscriber-subheader {
  font-family: volte_medium;
  font-style: normal;
  color: #a3a6c2;
  width: 75%;
  margin: 0 auto 12px;
  font-size: 18px;
  font-weight: 500;
  line-height: 120%;
}

.subscriber-list {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.subscriber-list li {
  width: 320px;
  height: auto;
  padding: 8px 15px;
  background: var(--background-app-background, #020005);
  margin-bottom: 6px;
  border-radius: 10px;
  border: 1px solid #564372;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  box-sizing: border-box;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}
.subscriber-list li:last-child {
  margin-bottom: 10px;
}
.subscriber-list li .sudId-wrapper {
  display: flex;
  flex-direction: column;
  align-items: start;
}
.subscriber-list li .sudId-wrapper .plan-name {
  font-weight: 500;
  line-height: 120%;
  font-family: volte_medium;
  font-size: 18px;
  line-height: 21px;
  color: #ffffff;
}
.subscriber-list li .sudId-wrapper .active {
  display: flex;
  padding: 2px 3px;
  justify-content: center;
  font-family: volte_medium;
  align-items: center;
  border-radius: 2px;
  background: var(--branding-colours-purple-25, #D6C6F4);
  margin-bottom: 4px;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}
.subscriber-list li .sudId-wrapper .inactive {
  display: flex;
  padding: 2px 3px;
  justify-content: center;
  font-family: volte_medium;
  align-items: center;
  margin-bottom: 4px;
  border-radius: 2px;
  background: var(--alerts-error-red, #E56C6C);
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}
.subscriber-list li .sudId-wrapper .alias-name {
  color: #FFF;
  font-family: volte_reg;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  margin-top: 4px;
  text-align: left;
}

.button-container .login-btn {
  margin: 20px 0 30px 0;
  width: 280px;
  border-radius: 22px;
  height: 46px;
  padding: 12px 30px;
}
.button-container .login-btn .button-text {
  font-family: volte_semiBold;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
}

.sub-not-now {
  cursor: pointer;
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #f3cbe3;
}

@media only screen and (max-width: 480px) {
  .subscriber-list-header {
    font-size: 22px;
    margin: 20px 0 5px 0;
  }
  .subscriber-subheader {
    width: 86.6%;
    font-size: 16px;
  }
  .subscriber-list li {
    width: 320px;
  }
  .sub-swipe-screen {
    max-height: 175px;
    overflow: auto;
  }
  .button-container .login-btn {
    width: 320px !important;
    margin: 10px 0 36px 0;
  }
  .sub-not-now {
    display: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.login-with-otp-modal .popupOuter {
  background: transparent;
}
.login-with-otp-modal.alert-modal .popupSec {
  max-height: 600px;
  width: 640px;
  background: linear-gradient(99deg, #8E81A1 0.32%, #564372 40.3%, #220046 78.3%, #030106 99.48%) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 20px;
  border: 1px solid #564372;
  overflow: hidden;
}
.login-with-otp-modal.alert-modal .popupSec .modal-body {
  padding: 37px 0;
  max-height: 573px;
  overflow: auto;
}
.login-with-otp-modal.alert-modal .popupSec.otp-container-block {
  height: 315px;
}
.login-with-otp-modal.alert-modal .popupSec.otp-container-block .modal-body {
  padding: 32.5px 0;
}

.login-details-container .back-arrow {
  width: 18px;
  height: 18px;
  margin-left: 19px;
  margin-top: -13px;
  cursor: pointer;
}
.login-details-container .back-arrow img {
  width: 100%;
}
.login-details-container .scroll-loader {
  height: 200px;
  max-width: 200px;
  position: absolute;
  display: block;
  top: 40%;
  left: 34%;
  z-index: 199999;
}
@media only screen and (max-width: 480px) {
  .login-details-container .scroll-loader {
    width: 150px;
    height: 150px;
    left: 35%;
    top: 20%;
  }
}
.login-details-container .header-logo img {
  height: 18px;
  width: 80px;
  object-fit: cover;
}
.login-details-container .login-title-web {
  display: block;
  color: #ffffff;
  font-family: volte_medium;
  font-size: 26px;
  padding-top: 20px;
  font-weight: normal;
  font-style: normal;
  line-height: 120%;
}
.login-details-container .login-title-small {
  display: none;
}

.free-trial-toast {
  border: 2px solid #ffa800 !important;
}

.Toastify__toast-container--bottom-center {
  bottom: 50px !important;
  border: none !important;
  font-family: volte_medium;
}

.Toastify__toast {
  display: flex !important;
  align-items: center !important;
  padding: 13px 25px 13px 15px !important;
  border-radius: 6px !important;
  font-family: volte_medium !important;
  margin-top: 65px;
}
.Toastify__toast .Toastify__toast-body {
  padding: 0 !important;
  margin: 0 !important;
  font-family: volte_medium !important;
}
.Toastify__toast .Toastify__close-button {
  padding-top: 0 !important;
  display: none;
  font-family: volte_medium !important;
}
.Toastify__toast.login-fail {
  padding: 13px 61px 13px 15px !important;
}

.switch-toast {
  bottom: 30px;
}

.login-toast-wrapper {
  display: flex;
  align-items: center;
  border: 2px solid #564372;
  bottom: -130px;
  background-color: linear-gradient(294.99deg, #A22736 0%, #220046 100%) !important;
  font-family: volte_medium !important;
}
.login-toast-wrapper.device-toast-wrapper {
  border: 1px solid #564372;
  width: 670px !important;
}
.login-toast-wrapper.device-toast-wrapper .login-body-container .login-success-image {
  margin-right: 10px;
  margin-top: 4px;
}
.login-toast-wrapper.device-toast-wrapper .login-body-container .login-success-text {
  font-size: 18px;
}
.login-toast-wrapper:before {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
}
.login-toast-wrapper .Toastify__close-button {
  padding-top: 0.8% !important;
}

.login-border {
  border: double 1px transparent;
  background-image: linear-gradient(294.99deg, #A22736 0%, #220046 100%), linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
}

.login-body-container {
  display: flex;
  align-items: center;
}
.login-body-container .login-success-image {
  margin-right: 30px;
}
.login-body-container .icon-logout {
  margin-right: 15px;
  font-size: 22px;
  margin-bottom: 2px;
}
.login-body-container .icon-logout:before {
  color: #ffffff;
}
.login-body-container .login-cross-image {
  position: absolute;
  right: 15px;
}
.login-body-container .login-success-text {
  display: flex;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  color: #ffffff;
}
.login-body-container .login-success-text .free-trail {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-left: 5px;
}

.login-body-container.amazon_toast .login-success-image {
  margin-right: 20px;
  margin-top: 6px;
}
.login-body-container.amazon_toast .favourite-text {
  font-family: volte_reg;
  font-size: 18px;
  font-weight: 500;
}
.login-body-container.amazon_toast .login-cross-image {
  width: 18px;
  height: 18px;
  right: 20px;
  top: 10px;
}

@media only screen and (max-width: 640px) {
  .login-with-otp-modal.alert-modal .popupSec {
    width: 90%;
  }
}
@media only screen and (max-width: 480px) {
  .switch-toast {
    bottom: -13px !important;
  }
  .login-toast-wrapper.amazon_toast_wrapper {
    width: 94% !important;
    border-radius: 8px;
  }
  .free-trial-toast {
    width: 92% !important;
    height: 48px !important;
  }
  .login-toast-wrapper {
    bottom: -28%;
    height: 48px !important;
    width: 98% !important;
  }
  .login-toast-wrapper.device-toast-wrapper {
    width: 90% !important;
    bottom: 0% !important;
  }
  .login-toast-wrapper.device-toast-wrapper .login-body-container .login-success-image {
    margin-right: 10px;
    margin-top: 4px;
  }
  .login-toast-wrapper.device-toast-wrapper .login-body-container .login-success-text {
    font-size: 14px;
  }
  .login-toast-wrapper .Toastify__close-button {
    display: none;
  }
  .login-details-container .back-arrow {
    margin-top: 0px;
    margin-left: 21px;
    position: relative;
  }
  .login-details-container .back-arrow img {
    position: absolute;
    top: 5px;
  }
  .login-details-container .header-logo img {
    height: 20px;
    width: 85px;
  }
  .login-details-container .login-title-small {
    display: block;
    padding-top: 0;
    font-size: 20px;
    margin-bottom: 20px;
    color: #ffffff;
    font-family: volte_medium;
    font-weight: 500;
    font-style: normal;
    line-height: 120%;
  }
  .login-details-container .login-title-web {
    display: none;
  }
  .login-body-container {
    align-items: center;
    height: 48px;
  }
  .login-body-container .login-success-image {
    margin-right: 10px;
    margin-top: 6px;
  }
  .login-body-container .login-success-image img {
    width: 24px;
    height: 24px;
  }
  .login-body-container .icon-logout {
    margin-right: 10px;
    font-size: 16px;
    margin-bottom: 2px;
  }
  .login-body-container .icon-logout:before {
    color: #ffffff;
  }
  .login-body-container .favourite-text {
    margin-bottom: 3px;
  }
  .login-body-container .login-success-text {
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
  }
  .login-body-container.amazon_toast .favourite-text {
    font-size: 14px;
  }
}
@media only screen and (max-width: 300px) {
  .login-details-container .login-title-small {
    margin-bottom: 14px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.plan-container {
  padding: 13px 14px;
  background: #020005;
  border: 1px solid #564372;
  box-sizing: border-box;
  border-radius: 10px;
  position: relative;
}
.plan-container .overlay-shadow {
  position: absolute;
  width: 100%;
  height: 43px;
  background: linear-gradient(180deg, rgba(32, 1, 66, 0) 0%, #0a0015 100%);
  transform: rotate(180deg);
  /* left: -13px; */
  /* top: -12px; */
  top: 0;
  left: 0;
  border-radius: 10px;
  z-index: 1;
}
.plan-container .elite-plan {
  position: absolute;
  width: 100%;
  height: 62px;
  left: 1px;
  top: 0px;
  background: linear-gradient(339.81deg, #220046 59.34%, #e10092 134.97%);
  border-radius: 9px 9px 0px 0px;
}
.plan-container.plan-select {
  border: 2px solid #e10092;
  padding: 12px 13px;
}
.plan-container:not(:last-child) {
  margin-bottom: 10px;
}
.plan-container.hover:hover {
  border: 2px solid #ffffff;
  cursor: pointer;
  padding: 12px 13px;
}
.plan-container .crown-wrapper {
  width: 20px;
  height: 28px;
}
.plan-container .crown-wrapper img {
  width: 100%;
  image-rendering: pixelated;
}
.plan-container .description-container {
  position: relative;
}
.plan-container .description-container .pack-highlight {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.plan-container .description-container .checkbox {
  display: inline-flex;
  align-items: center;
}
.plan-container .description-container .checkbox .checkbox-text {
  margin-right: 10px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 19px;
  line-height: 120%;
  text-align: right;
  color: #ffffff;
}
.plan-container .description-container .checkbox label {
  border-radius: 50%;
  position: unset;
  margin-top: 4px;
  background: #564372;
}
.plan-container .pack-description {
  font-family: "Volte Play";
  font-style: normal;
  font-weight: 500;
  font-size: 12px;
  line-height: 120%;
  color: #ffffff;
}
.plan-container .discount-amount-container {
  display: flex;
}
.plan-container .discount-amount-container .discount-amount {
  padding-top: 2px;
}
.plan-container .discount-amount-container .discount-amount span {
  color: #ffffff;
  display: inline-flex;
  align-items: center;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  text-decoration-line: line-through;
}
.plan-container .discount-amount-container .discount-amount span:last-child {
  padding-right: 6px;
}
.plan-container .radio-wrapper {
  display: flex;
  align-items: center;
}
.plan-container .radio-wrapper .radio-button {
  margin: 0;
  top: 2px;
}
.plan-container .radio-wrapper span:nth-child(1) {
  font-size: 20px;
  padding-bottom: 5px;
  font-family: volte_semiBold;
}
.plan-container .radio-wrapper span:nth-child(2) {
  font-size: 20px;
  padding-bottom: 5px;
  font-family: volte_semiBold;
}
.plan-container .radio-wrapper span {
  color: #ffffff;
  font-size: 12px;
  display: inline-flex;
  align-items: center;
}
.plan-container .radio-wrapper span:not(:nth-child(1)) {
  padding-right: 5px;
}
.plan-container .flex-sb {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.plan-container .flex-sb p {
  font-family: volte_medium;
  padding-left: 10px;
}
.plan-container .device-details {
  margin-top: 6px;
}
.plan-container .device-details .mobile-wrapper {
  padding-left: 3px;
}
.plan-container .device-details .mobile-wrapper div {
  max-width: 15px;
  width: 15px;
}
.plan-container .device-details .mobile-wrapper img {
  max-width: 15px;
  height: 13px;
}
.plan-container .device-details .mobile-wrapper p {
  padding-left: 11px;
}
.plan-container .device-details p {
  color: #8e81a1;
  font-family: volte_medium;
  font-size: 12px;
}
.plan-container .partner-container {
  width: 85%;
  display: flex;
  flex-wrap: wrap;
  margin-top: 13px;
  position: relative;
}
.plan-container .partner-container .img-container {
  width: 46px;
  height: 46px;
  margin-right: 6px;
}
.plan-container .partner-container .img-container.premium-content {
  background-image: linear-gradient(#ffa800 100%, #fff389 100%, #ffa800 100%);
  border-radius: 100%;
  padding: 2px;
  width: 50px;
  height: 50px;
}
.plan-container .partner-container .img-container img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.plan-container .partner-container > * {
  margin-bottom: 12px;
}
.plan-container .firetv-notify {
  width: 70%;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 9px;
  line-height: 120%;
  letter-spacing: -0.1px;
  color: #d6c6f4;
}
.plan-container .sunnext-msg {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 9px;
  line-height: 120%;
  color: #d6c6f4;
  text-align: left;
}
.plan-container .packFooterMessage {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 9px;
  line-height: 120%;
  letter-spacing: -0.1px;
  color: #d6c6f4;
  margin-top: 6px;
  text-align: left;
  width: 80%;
}
.plan-container .packFooterMessage.mb-pack {
  margin-top: 0px;
}
.plan-container .packFooterMessage.regional-verbiage {
  font-size: 10px;
}

.current-pack-tag {
  padding: 2px 5px;
  width: fit-content;
  height: 16px;
  background: #6B00DD;
  border-radius: 6px 6px 0px 0px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 10px;
  line-height: 120%;
  color: #FFFFFF;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 7px;
}

@media only screen and (min-width: 320px) and (max-width: 480px) {
  .plan-container:not(:last-child) {
    margin-bottom: 10px;
  }
  .plan-container.hover:hover {
    border: 1px solid #564372;
    cursor: pointer;
    padding: 13px 14px;
  }
  .plan-container .crown-wrapper {
    width: 20px;
    height: 28px;
  }
  .plan-container .crown-wrapper img {
    width: 100%;
    image-rendering: pixelated;
  }
  .plan-container .device-details .mobile-wrapper p {
    padding-left: 12px;
  }
  .plan-container .description-container {
    position: relative;
  }
  .plan-container .description-container .pack-highlight {
    background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .plan-container .description-container .checkbox {
    display: inline-flex;
    align-items: center;
  }
  .plan-container .description-container .checkbox .checkbox-text {
    margin-right: 10px;
    font-family: volte_medium;
    font-style: normal;
    font-weight: 600;
    font-size: 19px;
    line-height: 120%;
    text-align: right;
    color: #ffffff;
  }
  .plan-container .description-container .checkbox label {
    border-radius: 50%;
    position: unset;
    margin-top: 4px;
    background: #564372;
  }
  .plan-container .pack-description {
    font-family: "Volte Play";
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 120%;
    color: #ffffff;
    padding-left: 10px;
  }
  .plan-container .radio-wrapper {
    display: flex;
    align-items: center;
  }
  .plan-container .radio-wrapper .radio-button {
    margin: 0;
    top: 2px;
  }
  .plan-container .radio-wrapper span:nth-child(1) {
    font-size: 20px;
    padding-bottom: 5px;
  }
  .plan-container .radio-wrapper span:nth-child(2) {
    font-size: 20px;
    padding-bottom: 5px;
  }
  .plan-container .radio-wrapper span {
    color: #ffffff;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
  }
  .plan-container .radio-wrapper span:not(:nth-child(1)) {
    padding-right: 5px;
  }
  .plan-container .flex-sb {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .plan-container .flex-sb p {
    font-family: volte_medium;
    padding-left: 10px;
  }
  .plan-container .device-details {
    margin-top: 6px;
  }
  .plan-container .device-details .mobile-wrapper img {
    max-width: 15px;
    height: 13px;
  }
  .plan-container .device-details p {
    color: #8e81a1;
    font-family: volte_medium;
    font-size: 12px;
  }
  .plan-container .partner-container {
    width: 92%;
    display: flex;
    flex-wrap: wrap;
    margin-top: 13px;
    position: relative;
  }
  .plan-container .partner-container .img-container {
    width: 46px;
    height: 46px;
    margin-right: 4px;
  }
  .plan-container .partner-container .img-container.premium-content {
    background-image: linear-gradient(#FFA800 100%, #FFF389 100%, #FFA800 100%);
    border-radius: 100%;
    padding: 2px;
    width: 50px;
    height: 50px;
  }
  .plan-container .partner-container .img-container img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
  }
  .plan-container .firetv-notify {
    width: 70%;
    font-family: volte_medium;
    font-style: normal;
    font-weight: 500;
    font-size: 9px;
    line-height: 120%;
    letter-spacing: -0.1px;
    color: #d6c6f4;
  }
  .plan-container .sunnext-msg {
    font-family: volte_medium;
    font-style: normal;
    font-weight: 500;
    font-size: 9px;
    line-height: 120%;
    color: #d6c6f4;
    text-align: left;
  }
  .plan-container .packFooterMessage {
    font-family: volte_medium;
    font-style: normal;
    font-weight: 500;
    font-size: 9px;
    line-height: 120%;
    letter-spacing: -0.1px;
    color: #d6c6f4;
    margin-top: 6px;
    text-align: left;
    width: 80%;
  }
  .plan-container .packFooterMessage.regional-verbiage {
    width: 92%;
  }
}
@media only screen and (min-width: 346px) and (max-width: 480px) {
  .plan-container .partner-container {
    width: 300px;
  }
}
@media only screen and (min-width: 335px) and (max-width: 345px) {
  .plan-container .partner-container {
    width: 100%;
    margin-bottom: 0;
  }
  .plan-container .partner-container .img-container {
    width: 40px;
    height: 40px;
  }
  .plan-container .partner-container .img-container.premium-content {
    width: 42px;
    height: 42px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 334px) {
  .plan-container .partner-container {
    width: 100%;
  }
  .plan-container .partner-container .img-container {
    width: 36px;
    height: 36px;
  }
  .plan-container .partner-container .img-container.premium-content {
    padding: 2px;
    width: 38px;
    height: 38px;
  }
  .plan-container .device-details {
    margin-top: 4px;
  }
  .plan-container .device-details .mobile-wrapper {
    padding-left: 3px;
  }
  .plan-container .device-details .mobile-wrapper img {
    max-width: 15px;
    height: 13px;
  }
  .plan-container .device-details p {
    font-size: 12px;
  }
  .plan-container .radio-wrapper span:nth-child(1) {
    font-size: 12px;
    padding-bottom: 2px;
  }
  .plan-container .radio-wrapper span:nth-child(2) {
    font-size: 12px;
    padding-bottom: 2px;
  }
  .plan-container .radio-wrapper span:not(:nth-child(1)) {
    padding-right: 2px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.plan-wrapper.disable-events {
  pointer-events: none;
  overflow: hidden;
}
.plan-wrapper .popupOuter .popupSec {
  overflow: hidden;
  width: 640px;
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%) !important;
}
.plan-wrapper .popupOuter .popupSec .modal-body {
  padding: 30px 100px;
}
.plan-wrapper .login-msg {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  cursor: pointer;
  text-align: end;
  color: #f3cbe3;
  margin-bottom: 16px;
  margin-right: -11%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.plan-wrapper .login-msg span {
  padding-right: 11px;
}
.plan-wrapper .heading {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 26px;
  line-height: 120%;
  color: #ffffff;
  margin-bottom: 20px;
  padding-right: 8px;
}
@media only screen and (max-width: 395px) {
  .plan-wrapper .heading {
    font-size: 18px;
  }
}
@media only screen and (min-width: 396px) and (max-width: 480px) {
  .plan-wrapper .heading {
    font-size: 19px;
  }
}
.plan-wrapper .plan-details-container {
  height: 40vh;
  overflow-y: scroll;
  padding-right: 8px;
  scrollbar-color: #f3cbe3;
}
.plan-wrapper .plan-details-container::-webkit-scrollbar {
  width: 12px;
  cursor: pointer;
}
.plan-wrapper .plan-details-container::-webkit-scrollbar-thumb {
  background: #f3cbe3;
  border-radius: 6px;
  width: 12px;
}
.plan-wrapper .plan-details-container:hover::-webkit-scrollbar-thumb {
  background: white;
  cursor: pointer;
}
.plan-wrapper .plan-details-container::-webkit-scrollbar-track {
  box-shadow: none;
  border-radius: 5px;
}
.plan-wrapper .plan-details-container .box-shadow {
  position: absolute;
  height: 43px;
  top: 24.5%;
  left: 15.3%;
  background: linear-gradient(180deg, rgba(2, 0, 5, 0) 0%, #020005 100%);
  transform: rotate(180deg);
  width: 420px;
  z-index: 10;
}
.plan-wrapper .plan-details-container .box-shadow.rm-top {
  top: 17%;
}
.plan-wrapper .btn-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin-top: 10px;
  padding-right: 16px;
}
.plan-wrapper .btn-container .box-shadow {
  position: absolute;
  height: 43px;
  top: -49px;
  background: linear-gradient(180deg, rgba(32, 1, 66, 0) 0%, #210143 100%);
  width: 97%;
}
.plan-wrapper .btn-container .proceed-btn {
  width: 49%;
}
.plan-wrapper .btn-container .proceed-btn .btn-wrapper {
  border: none;
  padding: 10.5px 40px;
}
.plan-wrapper .btn-container .proceed-btn .btn-wrapper .button-text {
  color: #ffffff;
}
.plan-wrapper .btn-container .proceed-btn .btn-wrapper[disabled] {
  background: #8e81a1;
  cursor: not-allowed;
  border: none;
}
.plan-wrapper .btn-container .proceed-btn .btn-wrapper[disabled] .button-text {
  color: rgba(255, 255, 255, 0.7);
}
.plan-wrapper .btn-container .proceed-btn .btn-wrapper[disabled]:hover {
  box-shadow: none;
}
.plan-wrapper .btn-container .do-later {
  width: 49%;
}
.plan-wrapper .btn-container .do-later .btn-wrapper {
  background-color: inherit;
  padding: 10.5px 40px;
}
.plan-wrapper .btn-container .do-later .btn-wrapper .button-text {
  color: #f3cbe3;
}
.plan-wrapper .btn-container .do-later .primary-btn {
  border: solid 2px #f3cbe3;
}
.plan-wrapper .btn-container .btn-wrapper {
  width: 100%;
}
.plan-wrapper .compare-plan {
  margin: 10px 0;
}
.plan-wrapper .compare-plan span {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  color: #f3cbe3;
  text-align: center;
  cursor: pointer;
}
.plan-wrapper .box-shadow-wrapper {
  position: absolute;
  height: 43px;
  top: unset;
  left: unset;
  background: linear-gradient(180deg, rgba(2, 0, 5, 0) 0%, #020005 100%);
  transform: rotate(180deg);
  width: 420px;
  z-index: 10;
}
.plan-wrapper .box-shadow-wrapper.rm-top {
  top: 17%;
}

@media only screen and (max-width: 480px) {
  .plan-wrapper {
    padding-left: 20px;
    padding-right: 9px;
    position: relative;
  }
  .plan-wrapper .login-msg {
    font-family: volte_semiBold;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 120%;
    cursor: pointer;
    text-align: end;
    color: #f3cbe3;
    margin-bottom: 24px;
    margin-right: 0%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 18px;
    margin-top: 18px;
  }
  .plan-wrapper .login-msg span {
    padding-right: 11px;
  }
  .plan-wrapper .heading {
    font-family: volte_medium;
    font-style: normal;
    font-weight: 500;
    font-size: 22px;
    line-height: 120%;
    color: #ffffff;
    margin-bottom: 20px;
    padding-right: 8px;
  }
  .plan-wrapper .plan-details-container {
    height: 55vh;
    overflow-y: scroll;
    padding-right: 7px;
    scrollbar-color: #f3cbe3;
    scroll-behaviour: smooth;
  }
  .plan-wrapper .plan-details-container::-webkit-scrollbar {
    width: 4px;
    height: 10px;
    min-height: 20px;
    cursor: pointer;
  }
  .plan-wrapper .plan-details-container::-webkit-scrollbar-button {
    height: 12px;
  }
  .plan-wrapper .plan-details-container::-webkit-scrollbar-thumb {
    background: #f3cbe3;
    border-radius: 6px;
    width: 4px;
  }
  .plan-wrapper .plan-details-container:hover::-webkit-scrollbar-thumb {
    background: #f3cbe3;
    cursor: pointer;
  }
  .plan-wrapper .plan-details-container::-webkit-scrollbar-track {
    box-shadow: none;
    border-radius: 5px;
  }
  .plan-wrapper .plan-details-container .box-shadow {
    position: absolute;
    height: 38px;
    top: 16%;
    left: 0%;
    background: linear-gradient(-10deg, rgba(32, 1, 66, 0) 0%, #0A0015 100%);
    width: 100%;
    left: 20px;
    right: 16px;
    z-index: 10;
    display: none;
  }
  .plan-wrapper .drawer-background {
    display: none;
    position: absolute;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 50.52%, #000000 100%);
  }
  .plan-wrapper .btn-container {
    z-index: 2;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding-right: 14px;
    margin-bottom: 20px;
    position: sticky;
    bottom: 20px;
    margin-top: 20px;
  }
  .plan-wrapper .btn-container.mb-down {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 50.52%, #000000 100%);
    padding-right: 5px;
  }
  .plan-wrapper .btn-container .box-shadow {
    position: absolute;
    height: 43px;
    top: -49px;
    background: linear-gradient(180deg, rgba(32, 1, 66, 0) 0%, #210143 100%);
    width: 100%;
    left: 0px;
    right: 16px;
    display: none;
  }
  .plan-wrapper .btn-container .proceed-btn {
    width: 49%;
  }
  .plan-wrapper .btn-container .proceed-btn .btn-wrapper {
    border: none;
    padding: 10.5px 40px;
  }
  .plan-wrapper .btn-container .proceed-btn .btn-wrapper .button-text {
    color: #ffffff;
  }
  .plan-wrapper .btn-container .proceed-btn .btn-wrapper[disabled] {
    background: #8e81a1;
    cursor: not-allowed;
    border: none;
  }
  .plan-wrapper .btn-container .proceed-btn .btn-wrapper[disabled]:hover {
    box-shadow: none;
  }
  .plan-wrapper .btn-container .do-later {
    width: 49%;
  }
  .plan-wrapper .btn-container .do-later .btn-wrapper {
    padding: 10.5px 10px;
    background: transparent;
  }
  .plan-wrapper .btn-container .do-later .primary-btn {
    border: solid 2px #f3cbe3;
  }
  .plan-wrapper .btn-container .btn-wrapper {
    width: 100%;
  }
  .plan-wrapper .compare-plan {
    margin: 10px 0;
    padding-bottom: 10px;
  }
  .plan-wrapper .compare-plan span {
    font-family: volte_semiBold;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 120%;
    color: #f3cbe3;
    text-align: center;
    cursor: pointer;
  }
}
@media only screen and (min-width: 320px) and (max-width: 326px) {
  .plan-wrapper .heading {
    font-size: 18px;
  }
  .plan-wrapper .plan-details-container {
    height: 32vh;
  }
}
@media only screen and (min-width: 340px) and (max-width: 355px) {
  .plan-wrapper .heading {
    font-size: 21px;
  }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (orientation: portrait) {
  /* styles*/
  .plan-wrapper .plan-details-container {
    height: 44vh;
  }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (orientation: portrait) and (device-aspect-ratio: 2/3) {
  /* styles*/
  .plan-wrapper .plan-details-container {
    height: 37vh;
  }
}
@media only screen and (min-width: 360px) and (max-width: 361px) {
  .plan-wrapper .heading {
    font-size: 20px;
  }
  .plan-wrapper .plan-details-container {
    height: 51vh;
  }
}
@media only screen and (min-width: 362px) and (max-width: 376px) {
  .plan-wrapper .plan-details-container {
    height: 52vh;
  }
}
@media only screen and (min-width: 351px) and (max-width: 359px) {
  .plan-wrapper .plan-details-container {
    height: 53vh;
  }
}
@media only screen and (min-width: 383px) and (max-width: 385px) {
  .plan-wrapper .plan-details-container {
    height: 51vh;
  }
}
@media only screen and (min-width: 386px) and (max-width: 480px) {
  .plan-wrapper .plan-details-container {
    height: 59vh;
  }
}
@media only screen and (min-width: 412px) and (max-width: 415px) {
  .plan-wrapper .plan-details-container {
    height: 63vh;
  }
}
@media only screen and (min-width: 360px) and (max-width: 361px) {
  .plan-wrapper .heading {
    font-size: 20px;
  }
  .plan-wrapper .plan-details-container {
    height: 51vh;
  }
}
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (device-width: 414px) and (device-height: 736px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 3) and (-webkit-device-pixel-ratio: 3) {
  .plan-wrapper .plan-details-container {
    height: 56vh;
  }
}
@media only screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3) {
  .plan-wrapper .plan-details-container {
    height: 60vh;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.tenure-selection-modal .popup_overlay.black_overlay {
  background: rgba(43, 45, 65, 0.9);
}
.tenure-selection-modal .popupSec {
  width: 640px;
  height: auto;
  max-height: 593px;
  overflow-y: auto;
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%);
  border: 1px solid #564372;
  box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 20px;
}
.tenure-selection-modal .popupSec .modal-body {
  padding: 0;
  overflow-y: auto;
}
.tenure-selection-modal .popupSec .tenure-modal-body {
  padding: 33px 78px 28px 78px;
  display: flex;
  flex-direction: column;
  align-items: center;
  max-height: 70vh;
  overflow-y: none;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-title {
  text-align: center;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-title img {
  height: 40px;
  width: 40px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-title .discount-verbiage {
  font-size: 22px;
  font-family: volte_reg;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-title h1 {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-bottom: 10px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-title h1.disable-highlight {
  background: unset;
  -webkit-text-fill-color: unset;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-title p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  color: #ffffff;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail .payment-container {
  display: flex;
  flex-direction: column;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail .payment-container > span {
  display: flex;
  justify-content: space-between;
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  padding: 20px 8% 15px 8%;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail .payment-container > span:first-child {
  border-bottom: 1px solid #564372;
  padding-top: 0px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail .payment-container .current-bal {
  color: #a3a6c2;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail .payment-container .pending-bal {
  color: white;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail p {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  color: #a3a6c2;
  margin-bottom: 10px;
  text-align: center;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul {
  padding: 20px 0px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li {
  margin-bottom: 33px;
  position: relative;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li:last-child {
  margin-bottom: 0;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-offer {
  padding: 4px 20px;
  position: absolute;
  height: 23px;
  left: 20px;
  bottom: 77px;
  background: #6b00dd;
  border-radius: 6px 6px 0px 0px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 13px;
  line-height: 120%;
  color: #ffffff;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item {
  width: 420px;
  height: 76px;
  padding: 16px 15px 17px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  background: #020005;
  mix-blend-mode: normal;
  border: 1px solid #564372;
  box-sizing: border-box;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item:hover {
  padding: 15px 14px 16px;
  border: 2px solid #FFFFFF;
  cursor: pointer;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item.selected-tenure {
  border: 2px solid #E10092;
  padding: 15px 14px 16px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item.selected-tenure:hover {
  border: 2px solid #E10092;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item {
  display: flex;
  align-items: center;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-icon {
  margin-right: 26px;
  width: 38px;
  height: 38px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-icon img {
  width: 100%;
  height: 100%;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration span {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration span:first-child {
  font-size: 20px;
  color: #ffffff;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration span:last-child {
  font-size: 16px;
  color: #c7c0d0;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item {
  display: flex;
  align-items: center;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  margin-right: 15px;
  display: flex;
  align-items: center;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .old-tenure-amount {
  font-size: 16px;
  color: #C7C0D0;
  text-decoration-line: line-through;
  margin-right: 15px;
  font-family: volte_reg;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .old-tenure-amount span:first-child {
  margin-right: 1px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .new-tenure-amount {
  color: #ffffff;
  font-size: 20px;
  font-family: volte_medium;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .new-tenure-amount span:first-child {
  margin-right: 1px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .hide-radio-btn {
  visibility: hidden;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul li .current-plan-text {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 12px;
  line-height: 120%;
  color: #f3cbe3;
  text-align: start;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul .current-plan .tenure-offer {
  bottom: 90px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .tenure-list-detail ul .current-plan .tenure-item {
  opacity: 0.5;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-footer {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  margin-bottom: 10px;
  font-family: volte_medium !important;
  color: #d6c6f4;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-action {
  text-align: center;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-action .primary-btn {
  width: 420px;
  margin-right: 0;
  margin-bottom: 20px;
  font-size: 20px;
  line-height: 120%;
  height: 45px;
  padding: 9px 40px;
}
.tenure-selection-modal .popupSec .tenure-modal-body .modal-action .tenure-not-now {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  color: #f3cbe3;
  cursor: pointer;
  margin-bottom: 30px;
}
.tenure-selection-modal .popupSec .discount-verbiage-footer {
  font-style: normal;
  font-weight: volte_reg;
  font-weight: 500;
  font-size: 14px;
  line-height: 120%;
  color: #D6C6F4;
  margin-top: -10px;
  margin-bottom: 20px;
  width: 420px;
  text-align: start;
}
.tenure-selection-modal .popupSec .discount-verbiage-footer.verbiage-bottom {
  font-size: 12px;
  line-height: 120%;
  margin-top: 0px;
}

@media only screen and (max-width: 480px) {
  .tenure-modal-body {
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    max-height: 70vh;
    overflow-y: none;
  }
  .tenure-modal-body .back-arrow {
    width: 18px;
    height: 18px;
    display: flex;
    align-self: flex-start;
    margin-left: 23px;
  }
  .tenure-modal-body .back-arrow img {
    width: 100%;
  }
  .tenure-modal-body .modal-title {
    text-align: center;
  }
  .tenure-modal-body .modal-title img {
    height: 40px;
    width: 40px;
  }
  .tenure-modal-body .modal-title .discount-verbiage {
    font-size: 22px;
    font-family: volte_reg;
  }
  .tenure-modal-body .modal-title h1 {
    font-family: volte_medium;
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 120%;
    text-align: center;
    background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 10px 0;
  }
  .tenure-modal-body .modal-title h1.disable-highlight {
    background: unset;
    -webkit-text-fill-color: unset;
  }
  .tenure-modal-body .modal-title p {
    font-family: volte_medium;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 120%;
    color: #ffffff;
    margin-bottom: 20px;
  }
  .tenure-modal-body .tenure-list-detail {
    width: 100%;
  }
  .tenure-modal-body .tenure-list-detail .payment-container {
    display: flex;
    flex-direction: column;
    padding: 16px 14% !important;
    height: auto;
  }
  .tenure-modal-body .tenure-list-detail .payment-container > span {
    display: flex;
    justify-content: space-between;
    font-family: volte_reg;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 120%;
    padding: 20px 8% 15px 8%;
  }
  .tenure-modal-body .tenure-list-detail .payment-container > span:first-child {
    border-bottom: 1px solid #564372;
    padding-top: 0px;
  }
  .tenure-modal-body .tenure-list-detail .payment-container .current-bal {
    color: #a3a6c2;
  }
  .tenure-modal-body .tenure-list-detail .payment-container .pending-bal {
    color: white;
  }
  .tenure-modal-body .tenure-list-detail p {
    font-family: volte_reg;
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 120%;
    color: #a3a6c2;
    margin-bottom: 10px;
    text-align: center;
  }
  .tenure-modal-body .tenure-list-detail ul {
    padding: 0px 20px;
  }
  .tenure-modal-body .tenure-list-detail ul li {
    margin-bottom: 33px;
    position: relative;
  }
  .tenure-modal-body .tenure-list-detail ul li:last-child {
    margin-bottom: 0;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-offer {
    padding: 4px 20px;
    position: absolute;
    height: 23px;
    left: 20px;
    bottom: 66px;
    background: #6b00dd;
    border-radius: 6px 6px 0px 0px;
    font-family: volte_reg;
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 120%;
    color: #ffffff;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item {
    padding: 9px 17px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    background: #020005;
    mix-blend-mode: normal;
    border: 1px solid #564372;
    box-sizing: border-box;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
    border-radius: 10px;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item:hover {
    padding: 15px 14px 16px;
    border: 2px solid #FFFFFF;
    cursor: pointer;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item.selected-tenure {
    border: 2px solid #E10092;
    padding: 8px 16px;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item.selected-tenure:hover {
    border: 2px solid #E10092;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item {
    display: flex;
    align-items: center;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-icon {
    margin-right: 12px;
    width: 38px;
    height: 38px;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-icon img {
    width: 100%;
    height: 100%;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration span {
    font-family: volte_medium;
    font-style: normal;
    font-weight: normal;
    line-height: 120%;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration span:first-child {
    font-size: 16px;
    color: #ffffff;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .left-item .tenure-duration span:last-child {
    font-size: 14px;
    color: rgba(255, 255, 255, 0.75);
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item {
    display: flex;
    align-items: center;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount {
    font-family: volte_medium;
    font-style: normal;
    font-weight: normal;
    line-height: 120%;
    margin-right: 15px;
    display: flex;
    align-items: center;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .old-tenure-amount {
    font-size: 16px;
    color: #C7C0D0;
    text-decoration-line: line-through;
    margin-right: 6px;
    font-family: volte_reg;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .old-tenure-amount span:first-child {
    margin-right: 1px;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .new-tenure-amount {
    color: #ffffff;
    font-size: 20px;
    font-family: volte_medium;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .tenure-ammount .new-tenure-amount span:first-child {
    margin-right: 1px;
  }
  .tenure-modal-body .tenure-list-detail ul li .tenure-item .right-item .hide-radio-btn {
    visibility: hidden;
  }
  .tenure-modal-body .tenure-list-detail ul li .current-plan-text {
    font-family: volte_reg;
    font-style: normal;
    font-weight: normal;
    font-size: 12px;
    line-height: 120%;
    color: #f3cbe3;
    text-align: start;
  }
  .tenure-modal-body .tenure-list-detail ul .current-plan .tenure-offer {
    bottom: 90px;
  }
  .tenure-modal-body .tenure-list-detail ul .current-plan .tenure-item {
    opacity: 0.5;
  }
  .tenure-modal-body .footer-message {
    padding: 0 20px;
    font-size: 13px;
  }
  .tenure-modal-body .modal-footer {
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 120%;
    text-align: center;
    font-family: volte_medium !important;
    color: #d6c6f4;
    margin: 20px 0px 5px 0px;
  }
  .tenure-modal-body .modal-action {
    text-align: center;
    width: 100%;
    padding: 0 20px;
  }
  .tenure-modal-body .modal-action .primary-btn {
    margin-right: 0;
    margin-bottom: 20px;
    font-size: 16px;
    line-height: 120%;
    height: 45px;
    padding: 9px 40px;
    width: 100%;
  }
  .tenure-modal-body .modal-action .tenure-not-now {
    font-family: volte_medium;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 120%;
    color: #f3cbe3;
    cursor: pointer;
    margin-bottom: 30px;
  }
  .tenure-modal-body .discount-verbiage-footer {
    font-style: normal;
    font-family: volte_reg;
    font-weight: 500;
    font-size: 12px;
    line-height: 120%;
    color: #D6C6F4;
    margin-bottom: 20px;
    width: 100%;
    padding: 0 20px 0 23px;
    text-align: start;
  }
  .tenure-modal-body .discount-verbiage-footer.verbiage-bottom {
    font-size: 10px;
    margin-top: 0px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.selection-drawer {
  background: transparent;
}
.selection-drawer .popupOuter {
  background: transparent;
}
.selection-drawer.alert-modal .popupSec {
  height: 585px;
  width: 640px;
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%) !important;
  border: 1px solid #564372;
  box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 20px;
}
.selection-drawer.alert-modal .popupSec .modal-body {
  padding-top: 26px;
  padding-bottom: 30px;
  padding-right: 30px;
  padding-left: 0;
}

.selection-container .login-text {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  color: #f3cbe3;
}
.selection-container .login-text span {
  cursor: pointer;
}
.selection-container .login-text img {
  padding-left: 9px;
}
.selection-container .selection-wrapper {
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-top: 21px;
}
.selection-container .selection-wrapper .start-heading {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 150px;
  height: 30px;
  margin-bottom: 10px;
}
.selection-container .selection-wrapper .start-heading .crown-container {
  padding-right: 12px;
  margin-top: 6px;
  left: -46%;
  bottom: -12px;
}
.selection-container .selection-wrapper .start-heading .crown-container img {
  width: 100%;
}
.selection-container .selection-wrapper .start-heading .logo-container {
  width: 108px;
  height: 25px;
}
.selection-container .selection-wrapper .start-heading .logo-container img {
  width: 100%;
}
.selection-container .selection-wrapper .heading-container {
  display: flex;
  margin-top: 6px;
  padding: 0 50px;
}
.selection-container .selection-wrapper .heading-container p {
  padding-left: 11px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 26px;
  line-height: 120%;
  color: #ffffff;
}
.selection-container .selection-wrapper .sub-head-container {
  margin-top: 16px;
}
.selection-container .selection-wrapper .sub-head-container p {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 120%;
  color: #ffffff;
}
.selection-container .selection-wrapper .sub-head-container p span {
  font-family: volte_bold;
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.selection-container .selection-wrapper .partner-container {
  display: flex;
  align-items: center;
  margin-top: 16px;
}
.selection-container .selection-wrapper .partner-container div {
  display: flex;
  align-items: center;
}
.selection-container .selection-wrapper .partner-container.fixed-plan {
  width: 336px;
  height: 190px;
  background: #f7f4fc;
  border: 1px solid #564372;
  border-radius: 10px;
  display: unset;
  padding: 25px;
  padding-right: 3px;
  padding-top: 13.5px;
}
.selection-container .selection-wrapper .partner-container.fixed-plan div {
  flex-wrap: wrap;
}
.selection-container .selection-wrapper .partner-container.fixed-plan div.img-container {
  margin: 0 16px 12px 0px;
}
.selection-container .selection-wrapper .partner-container .img-container {
  width: 60px;
  height: 60px;
  margin-right: 6px;
}
.selection-container .selection-wrapper .partner-container .img-container img {
  width: 100%;
  border-radius: 4.31023px;
}
.selection-container .selection-wrapper .partner-container p {
  color: #220046;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  margin-left: -35px;
  margin-top: 1px;
}
.selection-container .selection-wrapper .terms {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  text-align: center;
  letter-spacing: -0.1px;
  color: #d6c6f4;
  margin-top: 16px;
}
.selection-container .selection-wrapper .explore-btn {
  width: 320px;
  margin-top: 20px;
}
.selection-container .selection-wrapper .explore-btn .btn {
  padding: 15px 67px;
  margin-bottom: 0;
  border-radius: 22px;
  width: 100%;
  border: none;
  outline: none;
  letter-spacing: 0.5px;
}
.selection-container .selection-wrapper .explore-btn .btn:hover {
  border: none;
}
.selection-container .selection-wrapper .explore-btn .btn .button-text {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 100%;
  text-align: center;
}
.selection-container .selection-wrapper .btn-container {
  cursor: pointer;
  margin-top: 24px;
  box-sizing: border-box;
  width: 420px;
  height: 64px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  border-radius: 10px;
  padding: 0 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.selection-container .selection-wrapper .btn-container.mt-top {
  margin-top: 16px;
}
.selection-container .selection-wrapper .btn-container .btn-left-container {
  display: flex;
  align-items: center;
}
.selection-container .selection-wrapper .btn-container .btn-left-container .img-container {
  width: 40px;
  height: 40px;
}
.selection-container .selection-wrapper .btn-container .btn-left-container .img-container img {
  width: 100%;
}
.selection-container .selection-wrapper .btn-container .btn-left-container p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  color: #ffffff;
  padding-left: 24px;
}
.selection-container .selection-wrapper .btn-container .btn-right-container {
  width: 24px;
  height: 24px;
  background: #e10092;
  border-radius: 53px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.selection-container .selection-wrapper .btn-container .btn-right-container .img-container {
  width: 14px;
  height: 7px;
  object-fit: contain;
}
.selection-container .selection-wrapper .btn-container .btn-right-container .img-container img {
  width: 100%;
}
.selection-container .selection-wrapper .do-later {
  margin-top: 19px;
  border-radius: 100px;
  box-sizing: border-box;
}
.selection-container .selection-wrapper .do-later .btn {
  width: 100%;
  font-weight: 600;
  font-size: 20px;
  background: inherit;
  border: 2px solid #f3cbe3;
  padding: 9px 0px;
  margin-bottom: 0;
  margin-right: 0;
  border: none;
  padding: 0;
  color: #f3cbe3;
}

@media only screen and (max-width: 480px) {
  .selection-container {
    padding: 0 20px;
  }
  .selection-container.fixed-container {
    padding: 0 16px 0 11px;
  }
  .selection-container .login-text {
    padding-right: 2px;
    font-size: 16px;
  }
  .selection-container .selection-wrapper {
    position: relative;
    margin-top: 19px;
  }
  .selection-container .selection-wrapper .start-heading {
    width: 112px;
    height: 24px;
  }
  .selection-container .selection-wrapper .start-heading .crown-container {
    margin-top: 0px;
  }
  .selection-container .selection-wrapper .start-heading .logo-container {
    width: 86px;
    height: 20px;
  }
  .selection-container .selection-wrapper .heading-container {
    margin-top: 12px;
    align-items: center;
  }
  .selection-container .selection-wrapper .heading-container .rm-pl {
    padding: 0;
    font-size: 18px;
  }
}
@media only screen and (max-width: 480px) and (min-width: 359px) and (max-width: 361px) {
  .selection-container .selection-wrapper .heading-container .rm-pl {
    font-size: 18px;
  }
}
@media only screen and (max-width: 480px) {
  .selection-container .selection-wrapper .heading-container p {
    font-size: 20px;
  }
  .selection-container .selection-wrapper .sub-head-container {
    margin-top: 11px;
  }
  .selection-container .selection-wrapper .sub-head-container.fixed-sub-header {
    z-index: 2;
    margin-top: 25px;
  }
  .selection-container .selection-wrapper .sub-head-container p {
    font-size: 16px;
  }
  .selection-container .selection-wrapper .sub-head-container p span big {
    font-size: 19px;
  }
  .selection-container .selection-wrapper .partner-container {
    margin-top: 12px;
  }
  .selection-container .selection-wrapper .partner-container p {
    font-size: 14px;
  }
  .selection-container .selection-wrapper .partner-container .img-container {
    width: 40px;
    height: 40px;
  }
  .selection-container .selection-wrapper .partner-container .img-container img {
    width: 100%;
    border-radius: 4.31023px;
  }
  .selection-container .selection-wrapper .partner-container.fixed-plan {
    width: 268px;
    height: 161px;
    padding: 16.5px;
    padding-right: 0px;
    z-index: 2;
  }
  .selection-container .selection-wrapper .partner-container.fixed-plan div {
    flex-wrap: wrap;
  }
  .selection-container .selection-wrapper .partner-container.fixed-plan div.img-container {
    width: 46px;
    height: 46px;
  }
  .selection-container .selection-wrapper .btn-container {
    z-index: 2;
    margin-top: 20px;
    width: 100%;
    padding: 0 15px;
  }
  .selection-container .selection-wrapper .btn-container .btn-left-container .img-container {
    width: 32px;
    height: 32px;
  }
  .selection-container .selection-wrapper .btn-container .btn-left-container .img-container img {
    width: 100%;
  }
  .selection-container .selection-wrapper .btn-container .btn-left-container p {
    font-size: 16px;
    padding-left: 30px;
  }
  .selection-container .selection-wrapper .btn-container .btn-right-container .img-container {
    width: 14px;
    height: 7px;
  }
  .selection-container .selection-wrapper .btn-container .btn-right-container .img-container img {
    width: 100%;
  }
  .selection-container .selection-wrapper .do-later {
    margin-top: 24px;
    border-radius: 100px;
    box-sizing: border-box;
    margin-bottom: 25px;
    z-index: 2;
  }
  .selection-container .selection-wrapper .do-later .btn {
    width: 100%;
    font-size: 16px;
    background: inherit;
    border: 2px solid #f3cbe3;
    padding: 13px 0px;
    margin-bottom: 0;
    margin-right: 0;
    border: none;
    padding: 0;
  }
  .selection-container .selection-wrapper .terms {
    margin-top: 6px;
    font-size: 12px;
    z-index: 2;
  }
  .selection-container .selection-wrapper .explore-btn {
    width: 280px;
    z-index: 2;
    margin-top: 20px;
  }
  .selection-container .selection-wrapper .explore-btn .btn {
    width: 100%;
  }
  .selection-container .selection-wrapper .explore-btn .btn:hover {
    border: none;
    outline: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.apple-know-more-block {
  display: flex;
  flex-direction: row;
  margin-top: -10px;
  border: 2px solid transparent;
}
.apple-know-more-block:hover {
  border-radius: 4px;
  border: 2px solid #e10092;
  width: 519.4px;
}
.apple-know-more-block:hover .thumbnail {
  border: none;
}
.apple-know-more-block .thumbnail {
  cursor: pointer;
  border-radius: 4px 0px 0px 4px;
  border: 1px solid #d6c6f4;
  width: 104.4px;
  height: 60px;
  position: relative;
}
.apple-know-more-block .thumbnail img {
  width: 100%;
  height: 100%;
}
.apple-know-more-block .thumbnail .apple_play_image {
  width: 37.2px;
  height: 37.2px;
  top: 12px;
  left: 33.2px;
  position: absolute;
}
.apple-know-more-block .text-block {
  width: 415px;
  height: 60px;
  padding: 11px 10px;
  align-items: center;
  gap: 10px;
  border-radius: 0px 4px 4px 0px;
  background: #D6C6F4;
}
.apple-know-more-block .text-block > div:first-child, .apple-know-more-block .text-block > div .know-more-link {
  color: #000000;
  font-family: volte_medium;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%; /* 19.2px */
}
.apple-know-more-block .text-block .know-more-link {
  font-weight: 600;
  width: 30%;
  color: #e10092;
  cursor: pointer;
  margin-top: 1px;
  font-family: volte_semiBold;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .apple-know-more-block {
    margin-top: 14px;
    justify-content: center;
  }
  .apple-know-more-block:hover {
    border: none;
    width: 100%;
  }
  .apple-know-more-block:hover .thumbnail {
    border: 1px solid #d6c6f4;
  }
  .apple-know-more-block .thumbnail {
    width: 23.7%;
    height: 50px;
  }
  .apple-know-more-block .thumbnail .apple_play_image {
    width: 32px;
    height: 32px;
    top: 9px;
    left: 29.2px;
  }
  .apple-know-more-block .text-block {
    width: 77.3%;
    height: 50px;
  }
  .apple-know-more-block .text-block div:first-child {
    font-size: 11px;
  }
  .apple-know-more-block .text-block .know-more-link {
    font-size: 12px;
    width: 50%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.form-data {
  position: relative;
}
.form-data > label {
  display: block;
  margin-bottom: 6px;
  font-family: volte_medium;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.2;
  color: #a3a6c2;
}
.form-data div {
  position: relative;
}
.form-data input {
  display: block;
  font-family: volte_medium;
  padding: 13px 10px 13px 15px;
  color: #ffffff;
  background: #020005;
  border-radius: 2px;
  border: solid 1px #564372;
  box-sizing: border-box;
  line-height: 18px;
}
.form-data input.show-text {
  font-family: volte_medium;
}
.form-data input:focus {
  border: solid 2px #a3a6c2;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12);
}
.form-data input.error {
  border: 2px solid #e56c6c;
}
.form-data input[type=tel] {
  padding: 13px 14px 13px 35px;
}
.form-data input[type=password] {
  padding: 13px 40px 13px 15px;
}
.form-data .asterick {
  position: absolute;
  right: 10px;
  top: -2px;
}
.form-data .error-message {
  font-size: 14px;
  display: block;
  color: #e56c6c;
  margin-top: 10px;
  position: relative;
  top: -5px;
  line-height: normal;
}
.form-data .num-to-words {
  display: block;
  position: absolute;
  top: 100%;
  left: 0;
  font-size: 0.8rem;
}
.form-data span.optional-text {
  color: #f3cbe3;
  position: relative;
  left: 5px;
  font-size: 0.89rem;
}
.form-data.prefill-input input {
  padding-left: 48px;
}
.form-data.prefill-input .text {
  position: absolute;
  top: 8px;
  left: 10px;
  font-weight: bold;
}
.form-data .show-password {
  position: absolute;
  top: 45px;
  right: 18px;
  cursor: pointer;
}
.form-data.text-password input[type=text] {
  padding: 13px 40px 13px 15px;
}

.initialVal {
  position: absolute;
  top: 43px;
  font-family: volte_medium;
  color: #e9e9e9;
  left: 6px;
  display: block;
  line-height: 18px;
  padding: 16px 0;
}

span.req-field {
  position: relative;
  left: 4px;
  color: #e56c6c;
}

.login-modal .modal-body .login-container .login-tab-header .form-data input.initial-val-input,
.signup-parent .signup form .form-data input.initial-val-input {
  padding: 10px 0 10px 37px;
}

.login-modal .modal-body .login-container .password__show {
  top: 44px;
}
.login-modal .modal-body .login-container .password__show:before {
  font-size: 16px;
}

input::placeholder {
  color: #8a8ba7;
  font-family: volte_medium;
  font-size: 16px;
}
input::-ms-input-placeholder {
  color: #8a8ba7;
  font-family: volte_medium;
  font-size: 16px;
}
input::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  color: #8a8ba7;
  font-family: volte_medium;
  font-size: 16px;
}
input::-moz-placeholder {
  /* Firefox 19+ */
  color: #8a8ba7;
  font-family: volte_medium;
  font-size: 16px;
}
input:-ms-input-placeholder {
  /* IE 10+ */
  color: #acafca !important;
  font-family: sky_med;
  font-size: 16px;
}
input:-moz-placeholder {
  /* Firefox 18- */
  color: #8a8ba7;
  font-family: volte_medium;
  font-size: 16px;
}

i.icon-visibility_on, i.icon-visibility_off {
  color: #a3a6c2 !important;
  font-size: 18px;
}

@-moz-document url-prefix() {
  @media only screen and (min-width: 200px) and (max-width: 730px) {
    .initialVal {
      line-height: inherit;
    }
  }
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  /* IE10+ specific styles go here */
  .initialVal {
    top: 45px;
  }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  input:focus {
    border: 2px solid #a3a6c2;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.flexi-plan-container.alert-modal .popupSec i.icon-close {
  font-size: 24px;
}
.flexi-plan-container.alert-modal .popupSec {
  width: 640px;
}
.flexi-plan-container.alert-modal .popupSec .modal-body {
  padding: 30px 60px;
}
.flexi-plan-container.alert-modal .popupSec .icon-close {
  top: 32px;
  right: 60px;
}
.flexi-plan-container .flexi-plan-wrapper .crown-icon-wrapper img {
  width: 50px;
  height: 50px;
}
.flexi-plan-container .flexi-plan-wrapper .heading {
  font-family: volte_reg;
  font-size: 22px;
  font-weight: 500;
  line-height: 26.4px;
  text-align: center;
  margin-top: 12px;
  color: #FFFFFF;
}
.flexi-plan-container .flexi-plan-wrapper .sub-title {
  font-family: volte_reg;
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  text-align: center;
  margin-top: 12px;
  color: #D6C6F4;
}
.flexi-plan-container .flexi-plan-wrapper .partner-image-wrapper {
  padding: 0 72px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  grid-row-gap: 12px;
  grid-column-gap: 24px;
  margin: 20px 0;
}
.flexi-plan-container .flexi-plan-wrapper .partner-image-wrapper .partner-image {
  width: 56px;
  height: 56px;
}
.flexi-plan-container .flexi-plan-wrapper .partner-image-wrapper .partner-image img {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}
.flexi-plan-container .flexi-plan-wrapper .footer {
  font-family: volte_reg;
  font-size: 14px;
  font-weight: 500;
  line-height: 16.8px;
  text-align: center;
  color: #D6C6F4;
}
.flexi-plan-container .flexi-plan-wrapper .btn {
  padding: 13.2px 92px;
  margin-top: 20px;
  border-radius: 4px;
  margin-right: 0;
  margin-bottom: 0;
  border: none;
}
.flexi-plan-container .flexi-plan-wrapper .btn.primary-btn:hover {
  border: none;
}
.flexi-plan-container .flexi-plan-wrapper .btn .button-text {
  font-size: 16px;
  font-weight: 600;
  line-height: 19.2px;
  text-align: center;
}

@media only screen and (max-width: 480px) {
  .flexi-plan-container .popupOuter .popupSec .icon-close:before {
    font-size: 20px;
  }
  .flexi-plan-container.alert-modal .popupSec {
    width: 90%;
  }
  .flexi-plan-container.alert-modal .popupSec .modal-body {
    padding: 20px;
  }
  .flexi-plan-container.alert-modal .popupSec .icon-close {
    top: 20px;
    right: 20px;
  }
  .flexi-plan-container .flexi-plan-wrapper .crown-icon-wrapper img {
    width: 40px;
    height: 40px;
  }
  .flexi-plan-container .flexi-plan-wrapper .heading {
    margin-top: 20px;
  }
  .flexi-plan-container .flexi-plan-wrapper .sub-title {
    font-size: 16px;
    line-height: 19.2px;
    margin-top: 20px;
  }
  .flexi-plan-container .flexi-plan-wrapper .partner-image-wrapper {
    padding: 0px;
    grid-row-gap: 12px;
    grid-column-gap: 12px;
    margin: 12px 0;
  }
  .flexi-plan-container .flexi-plan-wrapper .partner-image-wrapper .partner-image {
    width: 46px;
    height: 46px;
  }
  .flexi-plan-container .flexi-plan-wrapper .footer {
    font-size: 12px;
    line-height: 14.4px;
  }
  .flexi-plan-container .flexi-plan-wrapper .btn {
    padding: 13.5px 92px;
  }
  .flexi-plan-container .flexi-plan-wrapper .btn.primary-btn:hover {
    border: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.home-container .container {
  width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
  position: relative;
  margin-bottom: 15px;
}
.home-container .container.new-hero-banner .slick-list .slick-slide .hero-banner.custom-static-hb {
  cursor: initial;
}
.home-container .container.new-hero-banner .slick-list .slick-slide .hero-banner img:first-child {
  height: 100%;
  width: 100%;
  border-radius: 12px;
}
@media only screen and (max-width: 480px) {
  .home-container .container.new-hero-banner .slick-list .slick-slide .hero-banner img:first-child {
    margin: unset !important;
    height: 100%;
    width: 100%;
    max-width: 100%;
    border-radius: 0px;
    transition: unset;
    border-radius: 0;
  }
}
.home-container .container .hb-slick-dots ul {
  padding: 0;
  display: flex;
  transition: all 0.32s;
  position: relative;
  margin: 0px;
  align-items: baseline;
  margin-top: 16px;
}
.home-container .container .hb-slick-dots ul li {
  position: relative;
  display: flex;
  align-items: center;
  width: 20px;
  height: 20px;
  margin: 0 4px;
  padding: 0;
  transition: all 0.32s;
}
.home-container .container .hb-slick-dots ul li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 0px;
  color: transparent;
  border: 0;
  outline: 0;
  background: 0 0;
  background: #8E81A1;
  width: 12px;
  height: 12px;
  border-radius: 100%;
}
.home-container .container .hb-slick-dots ul li.slick-active button {
  background: #F4F2F5;
  width: 14px;
  height: 14px;
  border-radius: 100%;
}
.home-container .container .hb-slick-dots ul li.small button {
  width: 10px;
  height: 10px;
  border-radius: 100%;
}
.home-container .container .play-now-btn {
  position: absolute;
  bottom: 20px;
  left: 30px;
  z-index: 9;
}
.home-container .container .play-now-btn .btn:before {
  content: "";
  background: url(/6ca05bdf64bd91c43817087438f4c192.svg);
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 9px;
  background-repeat: no-repeat;
  vertical-align: bottom;
}
.home-container .container .play-now-btn .btn {
  padding: 7.5px 25.5px 8.5px 25.5px;
  border-radius: 4px;
  font-size: 20px;
  line-height: 120%;
  color: #ffffff;
  background-blend-mode: normal, overlay;
  background: #e10092;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  margin: 0;
}
.home-container .container .play-now-btn .btn .button-text {
  padding-right: 3.3px;
  top: 1px;
  position: relative;
}
.home-container .container .slick-slider .hero-banner-shadow {
  position: fixed;
  height: 20.33%;
  bottom: -1px;
  background: linear-gradient(180deg, #020005 0%, rgba(2, 0, 5, 0) 100%);
  transform: rotate(-180deg);
  width: 100%;
  cursor: pointer;
  margin-left: -1px;
}
.home-container .container .slick-slider .hero-banner-shadow.not-active {
  cursor: unset;
  bottom: 5%;
  transition: all 0.1s;
}
.home-container .container .categoryPopup {
  position: absolute;
  bottom: 36px;
  color: #eeeeff;
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  z-index: 10;
  left: 4.9%;
  background: none;
}
.home-container .container .slick-list .slick-slide .hero-banner {
  position: relative;
}
.home-container .container .slick-list .slick-slide .hero-banner.custom-static-hb img:first-child.active-banner {
  cursor: initial;
}
.home-container .container .slick-list .slick-slide .hero-banner img:first-child {
  margin: auto;
  height: 95%;
  width: 100%;
  max-width: 98.6%;
  position: absolute;
  border-radius: 16.6667px;
  transition: height 0.1s;
}
.home-container .container .slick-list .slick-slide .hero-banner img:first-child.active-banner {
  height: 100%;
  cursor: pointer;
}
@media only screen and (max-width: 480px) {
  .home-container .container .slick-list .slick-slide .hero-banner img:first-child {
    border-radius: 6px;
  }
}
.home-container .container div {
  width: 100%;
}
.home-container .container div.placeholder-image {
  position: relative;
  text-align: center;
}
.home-container .container div.placeholder-image i.icon-image {
  font-size: 55px;
  top: 40%;
  position: relative;
}
.home-container .container .slick-dot-container {
  height: 3px;
  width: 11px;
  background-color: #e5e7e9;
  border-radius: 4px;
}
.home-container .container .slick-dot-container:hover {
  width: 14px;
  height: 6px;
}
.home-container .container .slick-dots {
  white-space: nowrap;
  bottom: -30px;
}
.home-container .container .slick-dots li {
  width: 12px;
  height: 8px;
}
.home-container .container .slick-prev,
.home-container .container .slick-next {
  top: 46%;
}
.home-container .container button.slick-next {
  right: 28px;
  z-index: 2;
}
.home-container .container button.slick-prev {
  left: 28px;
  z-index: 2;
}
.home-container .container .slick-prev:before,
.home-container .container .slick-next:before {
  font-size: 42px;
}
.home-container .container a {
  text-decoration: none;
}
.home-container .container .bannerLogo {
  display: inline-block;
  width: 120px;
  height: 32px;
  margin: 0;
  position: absolute;
  /* right: 150px;
   bottom: 43px;*/
  right: 11.5%;
  bottom: 15%;
  background: transparent;
  /* img {
     width: 120px;
     height: 32px;
     margin: 0;
     position: absolute;
     right: 150px;
     bottom: 43px;
   }*/
}
.home-container .container .partner-hero-banner {
  overflow: hidden;
  position: initial;
}
.home-container .container .partner-hero-banner img {
  width: 100%;
  height: 100%;
}
.home-container .container .partner-hero-banner .bannerLogo {
  display: inline-block;
  width: 120px;
  height: 32px;
  margin: 0;
  position: absolute;
  right: 150px;
  bottom: 103px;
  background: transparent;
}
.home-container .container .partner-hero-banner .bannerLogo img {
  bottom: 103px;
  width: 120px;
  height: 32px;
}

.slick-slide img {
  margin: auto;
  height: 100%;
  width: 100%;
  position: absolute;
}
.slick-slide img.crown-image {
  width: 30px;
  height: 30px;
  top: 17px;
  left: 17px;
}
.slick-slide img.banner-provider-image {
  width: 38px;
  height: 38px;
  top: 19px;
  right: 31px;
  border-radius: 5.118px;
}
.slick-slide img.hide-logo {
  display: none;
}

.container .slick-list {
  position: relative;
}
.container .slick-list .slick-slide {
  width: 56.33vw;
}

.slick-arrow {
  width: 34px;
  height: 34px;
  border-radius: 50%;
}
.slick-arrow:before {
  content: "";
  border: solid #e796c7;
  border-width: 0 4px 4px 0;
  display: inline-block;
  padding: 5px;
  box-shadow: 0px 8px 12px rgb(0, 0, 0.85);
}

.slick-prev:before {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}

.slick-next:before {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

.slick-dots li.slick-active .slick-dot-container {
  background-color: #e10092;
}

@media only screen and (max-width: 480px) {
  .home-container .container {
    margin-bottom: 10px;
  }
  .home-container .container .hb-slick-dots ul {
    margin-top: 5px;
  }
  .home-container .container .hb-slick-dots ul li {
    margin: 0 3px;
  }
  .home-container .container .hb-slick-dots ul li button {
    width: 6px;
    height: 6px;
  }
  .home-container .container .hb-slick-dots ul li.slick-active button {
    width: 8px;
    height: 8px;
  }
  .home-container .container .hb-slick-dots ul li.small button {
    width: 4px;
    height: 4px;
  }
  .home-container .container .play-now-btn {
    bottom: 11px;
    left: 20px;
  }
  .home-container .container .play-now-btn .btn:before {
    content: "";
    margin-right: 9px;
    width: 11px;
    height: 11px;
    background-size: contain;
  }
  .home-container .container .play-now-btn .btn {
    font-size: 12px;
    padding: 5.5px 12.5px 6.5px 11.5px;
    border: solid 2px #e10092;
  }
  .home-container .container .play-now-btn .btn .button-text {
    padding-right: 0;
  }
  .home-container .container .slick-list .slick-slide .crown-image {
    width: 20px;
    height: 20px;
    top: 10px;
    left: 10px;
  }
  .home-container .container .slick-list .slick-slide .banner-provider-image {
    height: 32px;
    width: 32px;
    top: 12px;
    right: 12px;
  }
  .home-container .container .slick-list .slick-slide .hero-banner img:first-child {
    max-width: 100%;
    height: 100%;
  }
  .home-container .container .slick-list .slick-slide.slick-active .hero-banner:before {
    content: none;
  }
  .home-container .container .slick-list .slick-slide.slick-active .hero-banner:after {
    content: none;
  }
  .slick-prev:before,
  .slick-next:before {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  .home-container .category-page-banner {
    top: 2em;
  }
  .home-container .container {
    padding: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.infinite-scroll-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.infinite-scroll-container .season-container {
  width: 223px;
  height: 111px;
  margin-right: 20px;
  margin-bottom: 25px;
  border-radius: 10px;
}
.infinite-scroll-container .image-season-container {
  position: relative;
}
.infinite-scroll-container .season-image {
  width: 100%;
  height: 111px;
  border-radius: 5px;
  opacity: 1;
}

.seasons-listing .listing-vertical.season-rail {
  margin-bottom: 20px !important;
}
.seasons-listing .listing-vertical.season-rail .see-all-link {
  display: none;
}
.seasons-listing .listing-vertical:last-child {
  margin-bottom: 0px;
}
.seasons-listing .listing-vertical .listing-container .slick-list .slick-track .slick-slide.slick-active {
  margin-bottom: 0;
}
.seasons-listing .listing-vertical .listing-container .slick-list .slick-track .slick-slide.slick-active .listing-block .listing-item.seasons-list .overBottomContent {
  bottom: 7%;
}
.seasons-listing .listing-vertical .listing-container .listing-vertical .listing-landscape li {
  height: 111px;
  width: 200px;
  margin-right: 20px;
  border-radius: 6px;
}
.seasons-listing .listing-vertical .listing-container .listing-vertical .listing-landscape li .card-image {
  width: 100%;
  height: 100%;
}

.view-all-episode-container {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-bottom: 10px;
}
.view-all-episode-container .view-all {
  font-size: 16px;
  color: #f3cbe3;
  text-decoration: none;
  font-family: volte_semiBold;
  line-height: 120%;
  font-weight: 600;
  cursor: pointer;
}
.view-all-episode-container .view-all:hover {
  color: #fff;
}

.mobile-border-bottom {
  border-bottom: 1px solid #564372;
  margin-top: 20px;
  margin-bottom: 20px;
}

.sports-rail-item .sports-duration-detail {
  font-family: volte_reg;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 15px;
  letter-spacing: 0px;
  color: #ffffff;
  position: absolute;
  right: 0px;
  margin: 8px 8px;
  top: 0;
}
.sports-rail-item .sport-rail-detail {
  display: flex;
  position: absolute;
  bottom: 5px;
  align-items: center;
  padding: 4px 8px;
  width: 100%;
}
.sports-rail-item .sport-rail-detail .play-video-icon {
  width: 20px;
  height: 20px;
}
.sports-rail-item .sport-rail-detail .sports-video-title {
  margin-left: 4px;
  color: #ffffff;
  font-family: "sky_reg";
  font-size: 12px;
  font-style: normal;
  z-index: 999;
  font-weight: 400;
  overflow: hidden;
  line-height: 14.4px;
  letter-spacing: 1px;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  bottom: 2px;
}

.seasons {
  display: block;
  position: relative;
  padding-right: 9%;
  padding-left: 2.8%;
  z-index: 1;
}
.seasons.left-arrow {
  padding-left: 8.5%;
}
.seasons .continue-watching-range {
  position: absolute;
  height: 3px;
  width: 100%;
  z-index: 1;
  bottom: 0;
  left: 0;
}
.seasons .continue-watching-range .range-background {
  position: absolute;
  height: 3px;
  width: 100%;
  margin-left: 0;
  background-color: #e5007d;
}
.seasons .seasons-number {
  overflow-x: scroll;
  margin-bottom: 20px;
  white-space: nowrap;
  scrollbar-width: none;
}
.seasons .seasons-number li {
  width: 150px;
  text-align: center;
  color: #ffffff;
  opacity: 0.75;
  margin-right: 5px;
  cursor: pointer;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 400;
  font-size: 22px;
  line-height: 120%;
}
.seasons .seasons-number li.active {
  color: #ffffff;
  border-bottom: 3px solid #e10092;
  padding-bottom: 0px;
  text-align: center;
  font-family: volte_semiBold;
  opacity: 1;
}
.seasons .seasons-number li:hover {
  color: #ffffff;
  opacity: 1;
  font-weight: 500;
}
.seasons .seasons-number i {
  position: absolute;
  margin-top: -7px;
  width: 34px;
  height: 34px;
  background-color: #e10092;
  border-radius: 100%;
  cursor: pointer;
  z-index: 20;
}
.seasons .seasons-number i:after {
  color: #ffffff;
  top: 7px;
  display: inline-block;
  position: relative;
  left: 11px;
}
.seasons .seasons-number .left-icon {
  left: 5%;
}
.seasons .seasons-number .left-icon:after {
  content: "<";
}
.seasons .seasons-number .right-icon {
  right: 5%;
}
.seasons .seasons-number .right-icon:after {
  content: ">";
}
.seasons .season-detail {
  overflow: hidden;
  margin-bottom: 40px;
}
.seasons .season-detail li {
  cursor: pointer;
  display: flex;
  position: relative;
  box-sizing: border-box;
  padding: 14px 20px 14px 30px;
  width: 100%;
  height: auto;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15);
  background-color: #33354d;
  margin-bottom: 33px;
  color: #ffffff;
}
.seasons .season-detail li .detail-content {
  width: 60%;
  display: inline-block;
  padding: 10px 0;
}
.seasons .season-detail li h4 {
  font-family: volte_medium;
  font-size: 24px;
  margin-bottom: 2px;
  color: #ffffff;
  line-height: 1.17;
  width: fit-content;
}
.seasons .season-detail li p.duration {
  font-family: volte_medium;
  font-size: 20px;
  color: #a3a6c2;
  line-height: 1.4;
  margin-bottom: 10px;
}
.seasons .season-detail li p.description {
  font-size: 18px;
  line-height: 1.33;
  margin-bottom: 6px;
  overflow: hidden;
  word-break: break-word;
}
.seasons .season-detail li p.description span.readMoreText {
  display: block;
  margin-top: 15px;
  color: #db62ab !important;
  line-height: 1.45;
}
.seasons .season-detail li p.description a.more-less {
  display: block;
  margin-top: 8px;
}
.seasons .season-detail li p.more {
  color: #4a90e2;
  font-family: volte_medium;
  font-size: 18px;
  line-height: 1.45;
  cursor: pointer;
}
.seasons .season-detail li .season-image {
  position: relative;
  width: 40%;
  display: inline-block;
  text-align: right;
  height: fit-content;
}
.seasons .season-detail li .season-image .icon-replay,
.seasons .season-detail li .season-image .icon-play-icon {
  position: absolute;
  top: 55px;
  right: 30%;
  z-index: 1;
}
.seasons .season-detail li .season-image .icon-replay .path1,
.seasons .season-detail li .season-image .icon-play-icon .path1 {
  font-size: 88px;
}
.seasons .season-detail li .season-image .icon-replay .path2,
.seasons .season-detail li .season-image .icon-play-icon .path2 {
  font-size: 88px;
}
.seasons .season-detail li .season-image img {
  width: 352px;
  max-height: 203px;
  height: 203px;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
}
.seasons .season-detail li .season-image img.original-image {
  position: absolute;
  right: 0;
}

@media only screen and (max-width: 768px) {
  .view-all-episode-container {
    margin-top: 10px;
  }
  .sports-rail-item .sports-duration-detail {
    font-size: 12px;
  }
  .sports-rail-item .sport-rail-detail .play-video-icon {
    width: 13px;
    height: 13px;
    margin-top: 3px;
  }
  .infinite-scroll-container .season-container {
    width: 171px;
    height: 89px;
    margin-right: 7px;
    margin-bottom: 30px;
  }
  .seasons {
    width: 100%;
    margin-left: 0;
    padding: 0 4.9% 0 2.8%;
  }
  .seasons .seasons-number {
    margin-bottom: 20px;
    overflow-x: scroll;
  }
  .seasons .seasons-number li {
    font-size: 16px;
    margin-right: 40px;
    width: auto;
  }
  .seasons .seasons-number li.active {
    width: auto;
    max-width: 75px;
  }
  .seasons .seasons-number .left-icon {
    left: 10px;
  }
  .seasons .seasons-number .right-icon {
    right: 10px;
  }
  .seasons .season-detail {
    width: 352px;
    margin: auto;
  }
  .seasons .season-detail li {
    flex-direction: column-reverse;
    padding: 16px 16px 8px 16px;
  }
  .seasons .season-detail li .detail-content {
    width: 100%;
    display: inline-block;
    padding: 12px 0 0 0;
  }
  .seasons .season-detail li .detail-content h4 {
    font-size: 20px;
  }
  .seasons .season-detail li .detail-content p.duration {
    font-size: 18px;
    margin-bottom: 5px;
  }
  .seasons .season-detail li .detail-content p.description {
    font-size: 16px;
    margin-bottom: 4px;
  }
  .seasons .season-detail li .detail-content p.description span .readMoreText {
    margin-top: 8px;
  }
  .seasons .season-detail li .season-image {
    width: 100%;
    display: inline-block;
    margin-left: 0 !important;
  }
  .seasons .season-detail li .season-image img {
    width: 100%;
  }
  .seasons .season-detail li .season-image .icon-replay,
  .seasons .season-detail li .season-image .icon-play-icon {
    right: 36%;
  }
}
@media only screen and (max-width: 1120px) {
  .seasons .season-detail li .season-image {
    margin-left: 10px;
  }
  .seasons .season-detail li .season-image img {
    width: 100%;
  }
}
@media only screen and (max-width: 1185px) {
  .seasons .season-detail li .season-image img {
    width: 100%;
  }
}
@media only screen and (max-width: 480px) {
  .seasons .seasons-number {
    margin-bottom: 0px;
  }
  .seasons .seasons-number li.active {
    padding-bottom: 6px;
  }
  .seasons-listing .listing-vertical {
    margin-bottom: 0 !important;
  }
  .view-all-episode-container {
    margin-top: 22px;
  }
  .mobile-border-bottom {
    margin-top: 15px;
    margin-bottom: 15px;
  }
}
@media only screen and (min-width: 1500px) {
  .seasons .season-detail li .season-image .icon-replay,
  .seasons .season-detail li .season-image .icon-play-icon {
    right: 126px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.seasons-number {
  overflow-x: scroll;
  margin-bottom: 29px;
  white-space: nowrap;
  scrollbar-width: none;
}
.seasons-number li {
  color: #a3a6c2;
  display: inline-block;
  font-size: 20px;
  font-family: volte_semiBold;
  margin-right: 42px;
  cursor: pointer;
  width: 120px;
  text-align: center;
}
.seasons-number li.active {
  color: #ffffff;
  border-bottom: 3px solid #e10092;
  padding-bottom: 10px;
}
.seasons-number li:hover {
  color: #ffffff;
  opacity: 1;
  font-weight: 500;
}
.seasons-number i {
  position: absolute;
  margin-top: -7px;
  width: 34px;
  height: 34px;
  background-color: #e10092;
  border-radius: 100%;
  cursor: pointer;
  z-index: 20;
}
.seasons-number i:after {
  color: #ffffff;
  top: 7px;
  display: inline-block;
  position: relative;
  left: 11px;
}
.seasons-number .left-icon {
  left: 5%;
}
.seasons-number .left-icon:after {
  content: "<";
}
.seasons-number .right-icon {
  right: 5%;
}
.seasons-number .right-icon:after {
  content: ">";
}

.seasons-block.left-arrow {
  padding-left: 5%;
}

.seasons-margin {
  margin-top: 45px;
}

.episode-list {
  padding: 0 !important;
}
.episode-list .infinite-scroll-container {
  padding: 0;
}

.seeall-content .set-hover-search.popover {
  margin-top: 0px;
  width: 225px;
}

.infinite-scroll-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.infinite-scroll-container .season-container {
  width: 200px;
  height: 111px;
  margin-right: 20px;
  margin-bottom: 20px;
  border-radius: 10px;
}
.infinite-scroll-container .season-container:hover {
  transform: scale(1.1, 1.2);
}
.infinite-scroll-container .season-container:hover .bottom-desc-padding {
  padding-top: 0;
  background: #1d1e30;
  box-shadow: 0px -6px 6px #1d1e30;
}
.infinite-scroll-container .season-container .time-line {
  top: -6px;
  margin: 0;
}
.infinite-scroll-container .season-image {
  width: 100%;
  height: 111px;
  border-radius: 5px;
  opacity: 1;
}

.place-top::before,
.place-top::after {
  left: 80% !important;
}

.image-season-container {
  position: relative;
  cursor: pointer;
}
.image-season-container .three-dots {
  display: none;
  padding: 0 10px;
}
.image-season-container .three-dots-icon {
  width: 3px;
  height: 13px;
}
.image-season-container:hover .three-dots {
  cursor: pointer;
  display: block;
}
.image-season-container:hover .three-dots .three-dots-icon {
  width: 3px;
  height: 13px;
}

.sports-rail-item .sports-duration-detail {
  font-family: "sky_reg";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 15px;
  letter-spacing: 0px;
  color: #ffffff;
  position: absolute;
  right: 0px;
  margin: 8px 8px;
  top: 0;
}
.sports-rail-item .sport-rail-detail {
  display: flex;
  position: absolute;
  bottom: 1px;
  left: 0;
  align-items: center;
  padding: 4px 8px;
  width: 100%;
}
.sports-rail-item .sport-rail-detail .play-video-icon {
  width: 20px;
  height: 20px;
}
.sports-rail-item .sport-rail-detail .sports-video-title {
  width: 85%;
  margin-left: 4px;
  color: #ffffff;
  font-family: "sky_reg";
  z-index: 999;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  line-height: 14.4px;
  letter-spacing: 1px;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  position: relative;
  bottom: 2px;
}
.sports-rail-item .bottom-desc-padding {
  padding: 4px 5px;
}

.episode-details {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 5.2%;
}
.episode-details .back-arrow {
  width: 24px;
  height: 24px;
  cursor: pointer;
}
.episode-details .text-input-block {
  position: relative;
  margin: auto;
  width: 55%;
  max-width: 83%;
  border: 1px solid #564372;
  border-radius: 10px;
}
.episode-details .text-input-block .input-container {
  height: 45px;
  background-color: #020005;
  width: 95%;
  padding-left: 15px;
  color: white;
  border-radius: 10px;
  font-size: 14px;
  padding-bottom: 0;
  padding-top: 0;
  border-bottom-width: 0;
  border-top-width: 0;
  border-right-width: 0;
  border-left-width: 0;
}
.episode-details .search-text-action {
  width: 24px;
  height: 24px;
  position: absolute;
  right: 10px;
  top: 10px;
  cursor: pointer;
}
.episode-details .cross-text-action {
  width: 15px;
  height: 15px;
  position: absolute;
  right: 10px;
  top: 15px;
  cursor: pointer;
}

.section {
  padding: 0;
  margin-bottom: 30px;
}

.search-section {
  padding: 0 2.8% 0 2.8%;
  margin-top: 45px;
  position: relative;
}
.search-section .total-season-list {
  font-size: 22px;
  color: #eeeeff;
  font-weight: 400;
  margin-bottom: 32px;
}
.search-section .search-no-result {
  font-size: 22px;
  color: #ffffff;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
  padding: 0;
  display: block;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 20px;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content .listing-block .listing-item {
  padding-bottom: 55%;
  margin-bottom: 0;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content .listing-block .listing-item .overBottomContent {
  bottom: 4px;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content .listing-block .listing-item .overBottomContent .three-dots {
  padding-bottom: 0;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content .listing-block .listing-item .overBottomContent .three-dots img {
  bottom: 2px;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content .listing-block .listing-item :nth-child(1) .card-image {
  height: 100%;
}
.search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content .listing-block .listing-item .time-line {
  margin-top: 0;
  position: absolute;
  bottom: 0;
}

@media only screen and (max-width: 480px) {
  .page-cls-episode .main-container {
    margin-top: 30px !important;
  }
  .infinite-scroll-container .season-container {
    width: 42vw;
    height: 89px;
    margin-right: 7px;
    margin-bottom: 30px;
  }
  .infinite-scroll-container .season-container:hover {
    transform: none;
  }
  .infinite-scroll-container .season-container:hover .bottom-desc-padding {
    padding-top: 0;
    background: transparent;
    box-shadow: none;
  }
  .infinite-scroll-container .season-container .sports-video-title {
    bottom: 0px;
  }
  .sports-rail-item .sports-duration-detail {
    font-size: 10px;
  }
  .sports-rail-item .sport-rail-detail .play {
    width: 10%;
  }
  .sports-rail-item .sport-rail-detail .play-video-icon {
    width: 15px;
    height: 15px;
    margin-top: 3px;
  }
  .sports-rail-item .sport-rail-detail .three-dots {
    width: 5%;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
  }
  .sports-rail-item .sport-rail-detail .sports-video-title {
    font-size: 10px;
    position: relative;
  }
  .episode-details .mic-action {
    width: 12px;
    height: 18px;
    position: absolute;
    top: 6px;
    right: 15px;
  }
  .episode-details .cross-text-action {
    width: 11px;
    height: 11px;
    left: auto;
    right: 16px;
    top: 9.5px;
  }
  .episode-details .search-text-action {
    width: 14px;
    height: 14px;
    left: 12px;
    right: 0;
    top: 8px;
  }
  .episode-details .back-arrow {
    width: 16px;
    height: 16px;
    margin-top: 9px;
    margin-left: 0px !important;
  }
  .episode-details .text-input-block {
    width: 100%;
    margin-left: 20px;
    overflow: hidden;
  }
  .episode-details .text-input-block .input-container {
    width: 77%;
    height: 30px;
    font-size: 14px;
    padding-left: 35px;
    padding-right: 30px;
    border-radius: 6px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
  .episode-details .text-input-block .input-container::placeholder {
    font-size: 14px;
    color: #8A8BA7;
  }
  .search-section {
    padding-top: 15px;
    position: relative;
    margin-top: 45px;
  }
  .search-section .search-no-result {
    font-size: 14px;
  }
  .search-section .overBottomContent .three-dots {
    display: inline-block;
  }
  .search-section .time-line {
    margin-top: 84.5px;
  }
  .seasons-margin {
    margin-top: 0;
  }
  .seasons-number {
    margin-bottom: 20px;
  }
  .seasons-number li {
    width: auto;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1920px) {
  .search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
    grid-template-columns: repeat(7, 1fr);
  }
}
@media only screen and (min-width: 1171px) and (max-width: 1340px) {
  .search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media only screen and (min-width: 941px) and (max-width: 1170px) {
  .search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 940px) {
  .search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
  .search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .search-section .episode-list .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .seeall-content {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.tracks {
  display: none;
  width: 406px;
  min-height: 277px;
  max-height: 277px;
  box-shadow: 0 3px 17px 7px rgba(0, 0, 0, 0.2);
  background-color: #33354d;
  position: absolute;
  bottom: 48px;
  right: 0;
  z-index: 999;
  border-radius: 10px;
  padding: 28px 0;
}
.tracks .audio-tracks, .tracks .subtitles-tracks {
  display: inline-block;
  width: 50%;
  text-align: center;
  float: left;
  height: 220px;
  border-right: 1px solid rgba(233, 233, 233, 0.1);
  overflow: auto;
  text-transform: capitalize;
}
.tracks .audio-tracks ul, .tracks .subtitles-tracks ul {
  text-align: left;
  width: 36.5%;
  margin: auto;
}
.tracks .audio-tracks h4, .tracks .subtitles-tracks h4 {
  font-size: 28px;
  font-family: sky_med;
  color: #ffffff;
  text-align: left;
  padding-left: 39px;
  margin-bottom: 10px;
}
.tracks .audio-tracks li, .tracks .subtitles-tracks li {
  position: relative;
  color: #a3a6c2;
  font-size: 24px;
  font-family: sky_med;
  margin-bottom: 15px;
}
.tracks .audio-tracks li:hover, .tracks .subtitles-tracks li:hover {
  color: #ffffff;
}

.tracks .subtitles-tracks {
  border-right: none;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.video-quality {
  display: none;
  width: 299px;
  height: auto;
  box-shadow: 0 3px 17px 7px rgba(0, 0, 0, 0.2);
  background-color: #33354d;
  position: absolute;
  bottom: 48px;
  right: 0;
  border-radius: 10px;
  padding: 31px 0;
  z-index: 999;
  overflow: auto;
}
.video-quality ul {
  width: 55%;
  margin: auto;
}
.video-quality h4 {
  font-size: 28px;
  font-family: sky_med;
  color: #ffffff;
  text-align: left;
  padding-left: 39px;
  margin-bottom: 10px;
}
.video-quality li {
  position: relative;
  color: #a3a6c2;
  font-size: 24px;
  font-family: sky_med;
  margin-bottom: 15px;
  text-align: left;
}
.video-quality li:hover {
  color: #ffffff;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/**
* Rangeslider
*/
.rangeslider {
  margin: 20px 0;
  position: relative;
  background: #e6e6e6;
  -ms-touch-action: none;
  touch-action: none;
}

.rangeslider,
.rangeslider .rangeslider__fill {
  display: block;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4);
}

.rangeslider .rangeslider__handle {
  background: #fff;
  border: 1px solid #ccc;
  cursor: pointer;
  display: inline-block;
  position: absolute;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4), 0 -1px 3px rgba(0, 0, 0, 0.4);
}

.rangeslider .rangeslider__handle .rangeslider__active {
  opacity: 1;
}

.rangeslider .rangeslider__handle-tooltip {
  width: 40px;
  height: 40px;
  text-align: center;
  position: absolute;
  background-color: rgba(0, 0, 0, 0.8);
  font-weight: normal;
  font-size: 14px;
  transition: all 100ms ease-in;
  border-radius: 4px;
  display: inline-block;
  color: white;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
}

.rangeslider .rangeslider__handle-tooltip span {
  margin-top: 12px;
  display: inline-block;
  line-height: 100%;
}

.rangeslider .rangeslider__handle-tooltip:after {
  content: " ";
  position: absolute;
  width: 0;
  height: 0;
}

/**
* Rangeslider - Horizontal slider
*/
.rangeslider-horizontal {
  height: 12px;
  border-radius: 10px;
}

.rangeslider-horizontal .rangeslider__fill {
  height: 100%;
  background-color: #7cb342;
  border-radius: 10px;
  top: 0;
}

.rangeslider-horizontal .rangeslider__handle {
  width: 30px;
  height: 30px;
  border-radius: 30px;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}

.rangeslider-horizontal .rangeslider__handle:after {
  content: " ";
  position: absolute;
  width: 16px;
  height: 16px;
  top: 6px;
  left: 6px;
  border-radius: 50%;
  background-color: #dadada;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4) inset, 0 -1px 3px rgba(0, 0, 0, 0.4) inset;
}

.rangeslider-horizontal .rangeslider__handle-tooltip {
  top: -55px;
}

.rangeslider-horizontal .rangeslider__handle-tooltip:after {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 8px solid rgba(0, 0, 0, 0.8);
  left: 50%;
  bottom: -8px;
  transform: translate3d(-50%, 0, 0);
}

/**
* Rangeslider - Vertical slider
*/
.rangeslider-vertical {
  margin: 20px auto;
  height: 150px;
  max-width: 10px;
  background-color: transparent;
}

.rangeslider-vertical .rangeslider__fill,
.rangeslider-vertical .rangeslider__handle {
  position: absolute;
}

.rangeslider-vertical .rangeslider__fill {
  width: 100%;
  background-color: #7cb342;
  box-shadow: none;
  bottom: 0;
}

.rangeslider-vertical .rangeslider__handle {
  width: 30px;
  height: 10px;
  left: -10px;
  box-shadow: none;
}

.rangeslider-vertical .rangeslider__handle-tooltip {
  left: -100%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}

.rangeslider-vertical .rangeslider__handle-tooltip:after {
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid rgba(0, 0, 0, 0.8);
  left: 100%;
  top: 12px;
}

/**
* Rangeslider - Reverse
*/
.rangeslider-reverse.rangeslider-horizontal .rangeslider__fill {
  right: 0;
}

.rangeslider-reverse.rangeslider-vertical .rangeslider__fill {
  top: 0;
  bottom: inherit;
}

/**
* Rangeslider - Labels
*/
.rangeslider__labels {
  position: relative;
}

.rangeslider-vertical .rangeslider__labels {
  position: relative;
  list-style-type: none;
  margin: 0 0 0 24px;
  padding: 0;
  text-align: left;
  width: 250px;
  height: 100%;
  left: 10px;
}

.rangeslider-vertical .rangeslider__labels .rangeslider__label-item {
  position: absolute;
  transform: translate3d(0, -50%, 0);
}

.rangeslider-vertical .rangeslider__labels .rangeslider__label-item::before {
  content: "";
  width: 10px;
  height: 2px;
  background: black;
  position: absolute;
  left: -14px;
  top: 50%;
  transform: translateY(-50%);
  z-index: -1;
}

.rangeslider__labels .rangeslider__label-item {
  position: absolute;
  font-size: 14px;
  cursor: pointer;
  display: inline-block;
  top: 10px;
  transform: translate3d(-50%, 0, 0);
}
@charset "UTF-8";
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.player-container footer {
  position: absolute;
  top: unset !important;
  bottom: 6%;
  width: 100%;
}
.player-container footer .hide {
  display: none;
}
.player-container footer .seekbar {
  top: 0;
  position: relative;
  width: 93%;
  margin: auto;
  cursor: pointer;
}
.player-container footer .seekbar .hr-case-seekbar {
  width: 89%;
}
.player-container footer .seekbar .min-case-seekbar {
  width: 93%;
}
.player-container footer .seekbar .endTime {
  font-family: sky_med;
  font-size: 30px;
  color: #ffffff;
  line-height: 1.35;
  display: inline-block;
  font-weight: 600;
  vertical-align: sub;
  width: 11%;
  float: left;
  text-align: right;
}
.player-container footer .seekbar .endTime.hr-case {
  width: 11%;
}
.player-container footer .seekbar .endTime.min-case {
  width: 7%;
  user-select: none;
}
.player-container footer .seekbar .live-click {
  text-align: left;
  padding-left: 13px;
  position: relative;
  z-index: 5;
  font-weight: 400;
}
@media only screen and (max-width: 480px) {
  .player-container footer .seekbar .live-click {
    padding-left: 6px;
  }
}
.player-container footer .seekbar .live {
  cursor: initial;
}
.player-container footer .seekbar .live span {
  background: #cc0000;
  padding: 0 8px;
}
.player-container footer .live-seekbar .hr-case-seekbar {
  width: 85%;
}
.player-container footer .live-seekbar .endTime.hr-case {
  width: 15%;
}
.player-container footer .volume-change {
  display: inline-block;
}
.player-container footer .no-volume-change {
  display: none;
}

.player-toast {
  bottom: -60%;
  width: 90%;
  height: 48px;
}

.controls {
  top: 23px;
  position: relative;
  width: 93%;
  margin: auto;
}
.controls i:hover:before {
  opacity: 1;
}
.controls .controls-right {
  text-align: right;
}
.controls .controls-right i.icon-select-prev:hover .next-episode-detail {
  display: inline-block;
}
.controls .controls-right i.icon-select-prev:hover .next-episode-detail:hover {
  display: none;
}
.controls .controls-left,
.controls .controls-right {
  width: 50%;
  display: inline-block;
}
.controls .controls-left i.icon-select-prev,
.controls .controls-right i.icon-select-prev {
  font-size: 30px;
  position: relative;
  z-index: 2;
}
.controls .controls-right i.icon-select-prev {
  display: inline-block;
  transform: rotate(180deg);
}
.controls .controls-left i.icon-select-prev:hover .prev-episode-detail {
  display: inline-block;
}
.controls .controls-left i.icon-select-prev:hover .prev-episode-detail:hover {
  display: none;
}
.controls .controls-right i {
  margin-right: 40px;
}
.controls .controls-right i.icon-volume, .controls .controls-right i.icon-percent, .controls .controls-right i.icon-mute, .controls .controls-right i.icon-percent1, .controls .controls-right i.icon-percent2 {
  font-size: 30px;
  position: relative;
}
.controls .controls-right i.icon-volume:hover .volume, .controls .controls-right i.icon-percent:hover .volume, .controls .controls-right i.icon-mute:hover .volume, .controls .controls-right i.icon-percent1:hover .volume, .controls .controls-right i.icon-percent2:hover .volume {
  display: inline-block;
}
.controls .controls-right i.icon-volume:hover:before, .controls .controls-right i.icon-percent:hover:before, .controls .controls-right i.icon-mute:hover:before, .controls .controls-right i.icon-percent1:hover:before, .controls .controls-right i.icon-percent2:hover:before {
  opacity: 1;
}
.controls .controls-right i.icon-mute .rangeslider__fill:after {
  content: none !important;
}
.controls .controls-right i.icon-star-empty, .controls .controls-right i.icon-fav {
  font-size: 30px;
}
.controls .controls-right i.icon-fav:before {
  opacity: 1;
}
.controls .controls-right i.icon-audio-and-subtitles {
  font-size: 30px;
  position: relative;
}
.controls .controls-right i.icon-audio-and-subtitles:hover .tracks {
  display: inline-block;
}
.controls .controls-right i.icon-audio-and-subtitles .volume-parent {
  width: 42px;
  left: -23px;
}
.controls .controls-right i.icon-settings, .controls .controls-right i.icon-minimise {
  font-size: 30px;
  position: relative;
}
.controls .controls-right i.icon-settings .volume-parent, .controls .controls-right i.icon-minimise .volume-parent {
  width: 42px;
  left: -23px;
}
.controls .controls-right i.icon-settings:hover .video-quality, .controls .controls-right i.icon-minimise:hover .video-quality {
  display: inline-block;
}
.controls .controls-right i.icon-enlarge, .controls .controls-right i.icon-minimise {
  margin-right: 0 !important;
}
.controls .controls-right i.icon-enlarge {
  font-size: 28px;
}

.playerProgressBar,
.rangeslider-horizontal {
  width: 100%;
  height: 10px;
  margin: 0;
  margin-top: 17px;
  display: inline-block;
  float: left;
  overflow: inherit;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.7);
  position: relative;
  z-index: 1;
  outline: none;
  box-shadow: none;
}
.playerProgressBar .videoProgress,
.playerProgressBar .rangeslider__fill,
.rangeslider-horizontal .videoProgress,
.rangeslider-horizontal .rangeslider__fill {
  background-color: #e5007d;
  height: 100%;
  box-shadow: none;
  position: absolute;
  outline: none;
  border-radius: 10px;
}

@media only screen and (max-width: 401px) {
  .playerProgressBar,
  .rangeslider-horizontal {
    width: 96%;
    margin-right: 4px;
  }
  .controls .controls-left,
  .controls .controls-right {
    margin-bottom: 10px;
  }
}
@media only screen and (orientation: landscape) {
  .player-toast .Toastify__toast-body {
    font-size: 14px !important;
  }
}
.next-episode-detail,
.prev-episode-detail {
  border-radius: 5px;
  display: none;
  position: absolute;
  top: 42px;
  width: 600px;
  box-shadow: 0 3px 17px 7px rgba(0, 0, 0, 0.2);
  background-color: #33354d;
  left: -219px;
  z-index: 2;
  padding: 19px 26px;
}
.next-episode-detail h5,
.prev-episode-detail h5 {
  font-size: 28px;
  font-family: sky_med;
  color: #ffffff;
  text-align: left;
  margin-bottom: 21px;
}
.next-episode-detail .next-image,
.next-episode-detail .next-detail-content,
.prev-episode-detail .next-image,
.prev-episode-detail .next-detail-content {
  width: 33%;
  float: left;
  text-align: left;
}
.next-episode-detail .next-image img,
.next-episode-detail .next-detail-content img,
.prev-episode-detail .next-image img,
.prev-episode-detail .next-detail-content img {
  width: 100%;
}
.next-episode-detail .next-image .description,
.next-episode-detail .next-detail-content .description,
.prev-episode-detail .next-image .description,
.prev-episode-detail .next-detail-content .description {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.next-episode-detail .next-image h4,
.next-episode-detail .next-detail-content h4,
.prev-episode-detail .next-image h4,
.prev-episode-detail .next-detail-content h4 {
  font-size: 20px;
  font-family: sky_med;
  line-height: 1.2;
}
.next-episode-detail .next-image .duration,
.next-episode-detail .next-detail-content .duration,
.prev-episode-detail .next-image .duration,
.prev-episode-detail .next-detail-content .duration {
  font-size: 20px;
  font-family: sky_med;
  line-height: 1.4;
  color: #a3a6c2;
}
.next-episode-detail .next-image .description,
.next-episode-detail .next-detail-content .description,
.prev-episode-detail .next-image .description,
.prev-episode-detail .next-detail-content .description {
  font-size: 16px;
  font-family: sky_reg;
  line-height: 1.5;
}
.next-episode-detail .next-detail-content,
.prev-episode-detail .next-detail-content {
  width: 67%;
  padding-left: 10px;
}

.next-episode-detail {
  transform: rotate(180deg);
}

.prev-episode-detail {
  top: -252px;
  left: 0;
}

.volume-parent {
  height: 100%;
  display: inline-block;
  width: 63px;
  position: absolute;
  left: -8px;
  top: -25px;
}

.player-container footer .volume {
  position: absolute;
  top: -215px !important;
  left: -15px;
  border-radius: 10px;
  z-index: 2;
  width: 65px;
  height: 195px;
  box-shadow: 0 3px 17px 7px rgba(0, 0, 0, 0.2);
  background-color: #33354d;
}
.player-container footer .volume .rangeslider-vertical {
  background-color: #ffffff;
  border-radius: 10px;
}
.player-container footer .volume .rangeslider-vertical .rangeslider__fill {
  background-color: #e5007d;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.player-container footer .volume .rangeslider-vertical .rangeslider__fill:after {
  content: "";
  width: 10px;
  height: 1px;
  display: inline-block;
  background-color: #e5007d;
  position: absolute;
  left: 0;
  top: -1px;
}
.player-container footer .volume .rangeslider-vertical .rangeslider__handle {
  outline: none;
  left: -8px;
  border: none;
}
.player-container footer .volume .circular-span,
.player-container footer .volume .rangeslider__handle {
  left: -8px;
  top: -13px;
  width: 26px !important;
  height: 26px !important;
}
.player-container footer .volume .playerProgressBar {
  width: 77%;
  margin-top: 27px;
  margin-right: 29px;
}

.range-slider {
  width: 300px;
  height: 20px;
  margin: 0 auto 1em;
  position: relative;
  cursor: e-resize;
}

.range-slider:before {
  content: "";
  display: block;
  position: absolute;
  top: 9px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: black;
}

.range-slider span {
  display: block;
  height: inherit;
  position: relative;
  z-index: 2;
  background-color: red;
  cursor: inherit;
}

/* Test result */
.test-result {
  position: absolute;
  top: 10px;
  right: 10px;
  line-height: 1;
}

.circular-span,
.rangeslider__handle {
  content: "●";
  position: absolute;
  z-index: 1;
  right: -38px;
  top: -14px;
  color: transparent;
  background-color: #e5007d !important;
  border-radius: 100%;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.2);
  width: 38px !important;
  height: 38px !important;
}
.circular-span:hover .current-time,
.rangeslider__handle:hover .current-time {
  display: inline-block;
}
.circular-span .current-time,
.rangeslider__handle .current-time {
  display: none;
  padding: 10px 17px;
  border-radius: 12px;
  background-color: #33354d;
  position: absolute;
  bottom: 50px;
  font-size: 34px;
  font-family: sky_med;
  color: #ffffff;
  text-align: center;
}
.circular-span .centre-hr,
.rangeslider__handle .centre-hr {
  right: -60px;
}
.circular-span .centre-min,
.rangeslider__handle .centre-min {
  right: -45px;
  user-select: none;
}

.rangeslider-horizontal .rangeslider__handle {
  border: none;
  outline: none;
}
.rangeslider-horizontal .rangeslider__handle:after {
  content: none;
}

.rangeslider__handle-tooltip,
.rangeslider__labels {
  display: none !important;
}

@media only screen and (min-width: 900px) and (max-width: 1000px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 85%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 89%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 15%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 11%;
  }
}
@media only screen and (min-width: 1000px) and (max-width: 1200px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 87%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 91%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 13%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 9%;
  }
  .player-container footer .live-seekbar .hr-case-seekbar {
    width: 80%;
  }
  .player-container footer .live-seekbar .endTime.hr-case {
    width: 20%;
  }
}
@media only screen and (min-width: 1200px) and (max-width: 1300px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 88%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 92%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 12%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 8%;
  }
  .player-container footer .live-seekbar .hr-case-seekbar {
    width: 84%;
  }
  .player-container footer .live-seekbar .endTime.hr-case {
    width: 16%;
  }
}
@media only screen and (min-width: 1500px) and (max-width: 1700px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 87.5%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 93%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 12.5%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 7%;
  }
}
@media only screen and (min-width: 1700px) and (max-width: 2000px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 90%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 94%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 10%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 6%;
  }
  .player-container footer .live-seekbar .hr-case-seekbar {
    width: 88%;
  }
  .player-container footer .live-seekbar .endTime.hr-case {
    width: 12%;
  }
}
@media only screen and (min-width: 2000px) and (max-width: 2500px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 92%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 95%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 8%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 5%;
  }
}
@media only screen and (min-width: 2500px) and (max-width: 3000px) {
  .player-container footer .seekbar .hr-case-seekbar {
    width: 94%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 96%;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 6%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 4%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.play-controls {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
}
.play-controls .hide {
  display: none;
}
.play-controls .hidden {
  visibility: hidden;
}
.play-controls .shown {
  visibility: visible;
}
.play-controls #loading {
  left: -50px;
}
.play-controls i {
  font-size: 84px;
  margin-right: 110px;
}
.play-controls i:last-child {
  margin-right: 0 !important;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.playNext-popup {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000000;
  z-index: 999;
}
.playNext-popup .icon-back-2 {
  font-size: 33px;
  position: relative;
  top: 7.5%;
  left: 4%;
}
.playNext-popup .next-detail {
  display: flex;
  justify-content: center;
  width: 100%;
  flex-direction: column;
  height: 100%;
  padding-left: 11%;
}
.playNext-popup .next-detail .next-detail-block {
  width: 50%;
}
.playNext-popup .next-detail .next-detail-block > p {
  font-family: sky_med;
  font-size: 20px;
  line-height: 1.25;
  color: #ffffff;
  letter-spacing: 0.5px;
  margin-bottom: 20px;
}
.playNext-popup .next-detail .next-detail-block h5 {
  font-size: 40px;
  font-family: sky_med;
  line-height: 0.9;
  letter-spacing: normal;
}
.playNext-popup .next-detail .next-detail-block h6 {
  font-size: 20px;
  line-height: 1.2;
  font-family: sky_med;
  width: 100%;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  overflow: hidden;
  -webkit-box-orient: vertical;
  letter-spacing: normal;
  margin: 12px 0;
}
.playNext-popup .next-detail .next-detail-block span {
  color: #a3a6c2;
  font-size: 24px;
  font-family: sky_med;
  margin-bottom: 19px;
}
.playNext-popup .next-detail .next-detail-block button {
  display: block;
  padding: 12px 50px;
  margin-top: 20px;
}
.playNext-popup .next-detail .next-detail-block button span {
  display: inline-block;
  font-size: 20px;
  font-family: sky_med;
  text-align: center;
  color: #ffffff;
  margin-bottom: 0;
}
.playNext-popup .next-detail .next-detail-block button span:before {
  content: "";
  background: url(/6ca05bdf64bd91c43817087438f4c192.svg);
  display: inline-block;
  width: 12px;
  height: 13px;
  margin-right: 9px;
}

.back-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-position: top right;
  background-repeat: no-repeat;
  background-size: 100% 100%;
}
.back-image:before {
  width: 100%;
  height: 100%;
  content: "";
  display: inline-block;
  float: right;
  background-image: radial-gradient(circle at 64% 16%, rgba(29, 30, 48, 0.1), #1d1e30 60%, #1d1e30 60%);
}

@media only screen and (max-width: 768px) {
  .playNext-popup .icon-back-2 {
    font-size: 24px;
  }
  .playNext-popup .next-detail .next-detail-block {
    width: 80%;
  }
  .playNext-popup .next-detail .next-detail-block > p {
    font-size: 18px;
  }
  .playNext-popup .next-detail .next-detail-block h5 {
    font-size: 38px;
  }
  .playNext-popup .next-detail .next-detail-block h6 {
    font-size: 18px;
  }
  .playNext-popup .next-detail .next-detail-block span {
    font-size: 22px;
  }
  .playNext-popup .next-detail .next-detail-block button span {
    font-size: 18px;
  }
  .playNext-popup .back-image:before {
    background-image: radial-gradient(circle at 64% 50%, rgba(29, 30, 48, 0.1), #1d1e30 60%, #1d1e30 60%);
  }
}
@media only screen and (min-width: 600px) {
  .next-detail .next-detail-block {
    margin-bottom: 10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

#player .bmpui-controls-hidden {
  all: unset !important;
}

#player .bmpui-ui-controlbar.bmpui-hidden {
  visibility: unset !important;
  opacity: unset !important;
}

#player .bmpui-ui-titlebar.bmpui-hidden {
  visibility: unset !important;
  opacity: unset !important;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.player-container {
  max-height: 100vh;
  position: fixed;
  width: 100%;
  height: 100%;
}
.player-container .player-wrapper #spnPlayerIframe {
  pointer-events: none;
}
.player-container .sony-wrapper {
  height: 100%;
}
.player-container .reel-wrapper {
  height: 100%;
}
.player-container #erose-none {
  display: none;
}
.player-container .scroll-loader {
  height: 200px;
  max-width: 200px;
  position: absolute;
  display: block;
  top: 40%;
  left: 44%;
}
.player-container .user-selection {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  line-height: normal;
}
.player-container i {
  cursor: pointer;
}
.player-container i:hover:before {
  opacity: 1;
}
.player-container i:before {
  opacity: 0.7;
}
.player-container #player, .player-container #player-container {
  overflow: hidden;
  width: 100%;
  top: 0;
  /*
      background-color: #1d1e30;*/
  opacity: 0.5;
  height: 100%;
  position: absolute;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.player-container #playerContainer {
  overflow: hidden;
  width: 100%;
  top: 0;
  /*
      background-color: #1d1e30;*/
  opacity: 0.5;
  height: 100%;
  position: absolute;
  background-size: 100% 100%;
  background-repeat: no-repeat;
}
.player-container .watchlist-parent, .player-container .replay {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 85.7%;
}
.player-container .watchlist-parent p, .player-container .replay p {
  opacity: 0.7;
  box-shadow: 0 3px 17px 7px rgba(0, 0, 0, 0.2);
  background-color: #33354d;
  font-family: volte_medium;
  font-size: 30px;
  color: #ffffff;
  padding: 11px 18px;
  border-radius: 9px;
  margin-top: -3%;
}
.player-container .replay p {
  background: transparent;
  box-shadow: unset;
  cursor: pointer;
  opacity: 1;
}
.player-container .replay p:before {
  background: url(/1125a5c3d496c8f8bf525d2af533fa12.png);
  content: "";
  display: block;
  width: 51px;
  height: 51px;
  margin: auto auto 8px;
}
.player-container header {
  position: relative;
  top: 50px;
  /* left: 0; */
  width: 93.5%;
  z-index: 2;
  margin: auto;
}
.player-container header h3 {
  text-align: center;
  font-family: volte_medium;
  font-size: 33px;
  line-height: 1.05;
  color: #ffffff;
  display: inline-block;
  width: 100%;
  display: -webkit-box;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.85);
  margin: 0;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  padding: 6px 47px;
  float: left;
  overflow: hidden;
  width: 100%;
  text-align: center;
}

.select:before {
  content: "";
  display: inline-block;
  position: absolute;
  left: -28px;
  top: 3px;
  width: 20px;
  height: 20px;
  margin: 0 16px 0 0;
  border-radius: 2px;
  background: url(/2e48e19466a74fbcf3455baf57ee0dc7.svg) no-repeat top/100%;
}

.player-container li.select {
  color: #ffffff;
}

.play-error {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  width: 100%;
  height: 100%;
  color: #ffffff;
  font-family: volte_medium;
  font-size: 30px;
}

.subtitleText {
  width: 100%;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.85);
  font-family: volte_medium;
  font-size: 35px;
  line-height: 1.14;
  letter-spacing: normal;
  text-align: center;
  color: #ffffff;
  position: absolute;
}
.subtitleText.subtitleText-no-footer {
  bottom: 70px;
}
.subtitleText.subtitleText-footer {
  bottom: 150px;
}

.player-container .replay {
  height: 100%;
}

.network-error main, .partner-error main {
  position: fixed;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.network-error main .icon-no-internet, .partner-error main .icon-no-internet {
  font-size: 82px;
  margin-bottom: 32px;
}
.network-error main h6, .partner-error main h6 {
  font-size: 35px;
  font-family: volte_medium;
  margin-bottom: 8px;
}
.network-error main p, .partner-error main p {
  font-size: 26px;
  color: #b6b7d4;
  font-family: volte_medium;
  margin-bottom: 35px;
  text-align: center;
  padding: 0 60px;
}
.network-error i.icon-back-2, .partner-error i.icon-back-2 {
  cursor: pointer;
  left: 49px;
  top: 50px;
}
.network-error i.icon-back-2:before, .partner-error i.icon-back-2:before {
  color: rgba(255, 255, 255, 0.7);
}
.network-error .btn, .partner-error .btn {
  padding: 8px 75px;
  cursor: pointer;
}
.network-error .button-text, .partner-error .button-text {
  font-size: 26px;
  font-family: volte_semiBold;
}

.partner-error main .icon-alert-upd {
  font-size: 82px;
  margin-bottom: 32px;
}
.partner-error main .error-number {
  text-align: center;
  color: #b6b7d4;
  font-size: 16px;
  line-height: 1.38;
  margin-top: 25px;
  font-family: volte_medium;
}

i.icon-back-2 {
  font-size: 2em;
  position: absolute;
  /* left: 48px; */
  display: inline-block;
  width: 4%;
  float: left;
  z-index: 2;
  left: 0;
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .player-container header {
    top: 19px;
  }
  .player-container header h3 {
    font-size: 16px !important;
  }
  .player-container .play-controls i {
    font-size: 30px;
    margin-right: 50px;
  }
  .player-container .playerProgressBar, .player-container .rangeslider-horizontal {
    height: 5px;
  }
  .player-container .circular-span, .player-container .rangeslider__handle {
    width: 15px !important;
    height: 15px !important;
  }
  .player-container .controls .controls-left i.icon-select-prev, .player-container .controls .controls-right i {
    font-size: 12px;
    margin-top: 12px;
  }
  .player-container footer .seekbar .hr-case-seekbar {
    width: 88%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 91%;
  }
  .player-container footer .seekbar .endTime {
    font-size: 14px;
    margin-top: 12px;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 12%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 9%;
  }
  .player-container footer .live-seekbar .hr-case-seekbar {
    width: 84%;
  }
  .player-container footer .live-seekbar .endTime.hr-case {
    width: 16%;
  }
  .player-container .controls {
    top: 8px;
  }
  .player-container .controls .controls-right i {
    margin: 0px 0px 0px 0px;
    padding: 0px 9px 0px 9px;
    margin-top: 12px;
  }
  .player-container .controls .controls-right i .volume-parent {
    top: -13px;
  }
  .player-container .controls-left i.icon-select-prev:hover .prev-episode-detail {
    display: none;
  }
  .player-container .controls-right i.icon-percent .seekbar, .player-container .controls-right i.icon-mute .seekbar {
    display: none;
  }
  .player-container .controls-right i.icon-percent:hover .volume, .player-container .controls-right i.icon-mute:hover .volume {
    display: none;
  }
  .player-container .controls-right i.icon-select-prev:hover .next-episode-detail {
    display: none;
  }
  .player-container .subtitleText.subtitleText-no-footer {
    bottom: 55px;
  }
  .player-container .subtitleText.subtitleText-footer {
    bottom: 95px;
  }
  .player-container .play-controls #loading {
    left: -25px;
    top: -24px;
  }
  .player-container .circular-span .current-time, .player-container .rangeslider__handle .current-time {
    font-size: 17px;
    bottom: 20px;
  }
  .player-container .watchlist-parent p, .player-container .replay p {
    font-size: 16px;
  }
  .player-container .tracks {
    width: 270px;
    min-height: 190px;
    max-height: 180px;
    padding: 14px 0;
    bottom: 20px;
  }
  .player-container .tracks .audio-tracks, .player-container .tracks .subtitles-tracks {
    height: 165px;
    overflow: auto;
  }
  .player-container .tracks .audio-tracks ul, .player-container .tracks .subtitles-tracks ul {
    max-height: 165px;
  }
  .player-container .tracks .audio-tracks h4, .player-container .tracks .subtitles-tracks h4 {
    font-size: 20px;
    padding-left: 20px;
  }
  .player-container .tracks .audio-tracks li, .player-container .tracks .subtitles-tracks li {
    font-size: 18px;
  }
  .player-container .select:before {
    width: 17px;
    height: 17px;
  }
  .player-container .video-quality {
    width: 190px;
    padding: 12px 0;
    bottom: 20px;
  }
  .player-container .video-quality h4 {
    font-size: 20px;
  }
  .player-container .video-quality li {
    font-size: 18px;
  }
  .player-container i.icon-back-2 {
    font-size: 16px;
    margin-top: 7px;
  }
  .network-error main p, .partner-error main p {
    padding: 0 50px;
    font-size: 20px;
  }
  .network-error main h6, .partner-error main h6 {
    font-size: 30px;
  }
  .network-error main .icon-alert-upd, .partner-error main .icon-alert-upd {
    font-size: 72px;
  }
  .network-error main .icon-no-internet, .partner-error main .icon-no-internet {
    font-size: 64px;
  }
  .network-error main .error-number, .partner-error main .error-number {
    font-size: 14px;
  }
  .network-error .button-text, .partner-error .button-text {
    font-size: 20px;
  }
  .network-error i.icon-back-2, .partner-error i.icon-back-2 {
    font-size: 20px;
  }
}
/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) and (max-width: 768px) {
  .player-container header {
    top: 20px;
  }
  .player-container header h3 {
    font-size: 16px !important;
  }
  .player-container .play-controls i {
    font-size: 32px;
    margin-right: 80px;
  }
  .player-container .playerProgressBar, .player-container .rangeslider-horizontal {
    height: 7px;
  }
  .player-container .circular-span, .player-container .rangeslider__handle {
    width: 20px !important;
    height: 20px !important;
  }
  .player-container .controls .controls-left i.icon-select-prev, .player-container .controls .controls-right i {
    font-size: 12px;
    margin-top: 10px;
  }
  .player-container footer .seekbar .hr-case-seekbar {
    width: 89%;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 92%;
  }
  .player-container footer .seekbar .endTime {
    font-size: 12px;
    margin-top: 10px;
  }
  .player-container footer .seekbar .endTime.hr-case {
    width: 11%;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 8%;
  }
  .player-container footer .live-seekbar .hr-case-seekbar {
    width: 86%;
  }
  .player-container footer .live-seekbar .endTime.hr-case {
    width: 14%;
  }
  .player-container .controls {
    top: 8px;
  }
  .player-container .controls .controls-right i {
    margin-right: 25px;
  }
  .player-container .controls .controls-right i .volume-parent {
    top: -13px;
  }
  .player-container .controls-left i.icon-select-prev:hover .prev-episode-detail {
    display: none;
  }
  .player-container .controls-right i.icon-percent .seekbar, .player-container .controls-right i.icon-mute .seekbar {
    display: none;
  }
  .player-container .controls-right i.icon-percent:hover .volume, .player-container .controls-right i.icon-mute:hover .volume {
    display: none;
  }
  .player-container .controls-right i.icon-select-prev:hover .next-episode-detail {
    display: none;
  }
  .player-container .subtitleText.subtitleText-no-footer {
    bottom: 55px;
  }
  .player-container .subtitleText.subtitleText-footer {
    bottom: 95px;
  }
  .player-container .play-controls #loading {
    left: -25px;
    top: -24px;
  }
  .player-container .circular-span .current-time, .player-container .rangeslider__handle .current-time {
    font-size: 20px;
    bottom: 25px;
  }
  .player-container .watchlist-parent p, .player-container .replay p {
    font-size: 18px;
  }
  .player-container .tracks {
    width: 330px;
    min-height: 210px;
    max-height: 220px;
    padding: 20px 0;
    bottom: 20px;
  }
  .player-container .tracks .audio-tracks, .player-container .tracks .subtitles-tracks {
    height: 185px;
    overflow: auto;
  }
  .player-container .tracks .audio-tracks ul, .player-container .tracks .subtitles-tracks ul {
    max-height: 165px;
  }
  .player-container .tracks .audio-tracks h4, .player-container .tracks .subtitles-tracks h4 {
    font-size: 22px;
    padding-left: 20px;
  }
  .player-container .tracks .audio-tracks li, .player-container .tracks .subtitles-tracks li {
    font-size: 20px;
  }
  .player-container .select:before {
    width: 19px;
    height: 19px;
  }
  .player-container .video-quality {
    width: 210px;
    padding: 20px 0;
    bottom: 20px;
  }
  .player-container .video-quality h4 {
    font-size: 22px;
  }
  .player-container .video-quality li {
    font-size: 20px;
  }
  .player-container i.icon-back-2 {
    font-size: 16px;
    margin-top: 7px;
  }
  .network-error main p, .partner-error main p {
    padding: 0 60px;
    font-size: 22px;
  }
  .network-error main h6, .partner-error main h6 {
    font-size: 32px;
  }
  .network-error main .icon-alert-upd, .partner-error main .icon-alert-upd {
    font-size: 76px;
  }
  .network-error main .icon-no-internet, .partner-error main .icon-no-internet {
    font-size: 70px;
  }
  .network-error main .error-number, .partner-error main .error-number {
    font-size: 14px;
  }
  .network-error .button-text, .partner-error .button-text {
    font-size: 22px;
  }
  .network-error i.icon-back-2, .partner-error i.icon-back-2 {
    font-size: 24px;
  }
}
/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) and (max-width: 1024px), (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  /*and (pointer:coarse) (hover:hover)*/
  .player-container header {
    top: 30px;
  }
  .player-container header h3 {
    font-size: 18px;
  }
  .player-container .play-controls i {
    font-size: 35px;
    margin-right: 90px;
  }
  .player-container .playerProgressBar, .player-container .rangeslider-horizontal {
    height: 5px;
  }
  .player-container .circular-span, .player-container .rangeslider__handle {
    width: 25px !important;
    height: 25px !important;
  }
  .player-container .controls .controls-left i.icon-select-prev, .player-container .controls .controls-right i {
    font-size: 15px;
  }
  .player-container footer .seekbar .min-case-seekbar {
    width: 93%;
  }
  .player-container footer .seekbar .endTime {
    font-size: 17px;
    margin-top: 1px;
  }
  .player-container footer .seekbar .endTime.min-case {
    width: 7%;
  }
  .player-container .controls {
    top: 10px;
  }
  .player-container .controls .controls-right i {
    margin-right: 30px;
  }
  .player-container .controls .controls-right i .volume-parent {
    top: -15px;
  }
  .player-container .controls-left i.icon-select-prev:hover .prev-episode-detail {
    display: none;
  }
  .player-container .controls-right i.icon-percent .seekbar, .player-container .controls-right i.icon-mute .seekbar {
    display: none;
  }
  .player-container .controls-right i.icon-percent:hover .volume, .player-container .controls-right i.icon-mute:hover .volume {
    display: none;
  }
  .player-container .controls-right i.icon-select-prev:hover .next-episode-detail {
    display: none;
  }
  .player-container .subtitleText.subtitleText-no-footer {
    bottom: 75px;
  }
  .player-container .subtitleText.subtitleText-footer {
    bottom: 105px;
  }
  .player-container .play-controls #loading {
    left: -25px;
    top: -24px;
  }
  .player-container .circular-span .current-time, .player-container .rangeslider__handle .current-time {
    font-size: 24px;
    bottom: 30px;
  }
  .player-container .watchlist-parent p, .player-container .replay p {
    font-size: 22px;
  }
  .player-container .tracks {
    width: 380px;
    min-height: 250px;
    max-height: 260px;
    padding: 24px 0;
    bottom: 32px;
  }
  .player-container .tracks .audio-tracks, .player-container .tracks .subtitles-tracks {
    height: 220px;
    overflow: auto;
  }
  .player-container .tracks .audio-tracks ul, .player-container .tracks .subtitles-tracks ul {
    max-height: 180px;
  }
  .player-container .tracks .audio-tracks h4, .player-container .tracks .subtitles-tracks h4 {
    font-size: 24px;
    padding-left: 26px;
  }
  .player-container .tracks .audio-tracks li, .player-container .tracks .subtitles-tracks li {
    font-size: 22px;
  }
  .player-container .select:before {
    width: 22px;
    height: 22px;
  }
  .player-container .video-quality {
    width: 230px;
    padding: 24px 0;
    bottom: 32px;
  }
  .player-container .video-quality h4 {
    font-size: 24px;
  }
  .player-container .video-quality li {
    font-size: 22px;
  }
  .player-container i.icon-back-2 {
    font-size: 18px;
    margin-top: 7px;
  }
  .network-error main p, .partner-error main p {
    padding: 0 60px;
  }
  .network-error i.icon-back-2, .partner-error i.icon-back-2 {
    font-size: 26px;
  }
}
/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) and (max-width: 1200px) {
  .player-container header {
    top: 40px;
  }
  .player-container .play-controls i {
    font-size: 84px;
    margin-right: 100px;
  }
  .player-container .playerProgressBar, .player-container .rangeslider-horizontal {
    height: 9px;
  }
  .player-container .circular-span, .player-container .rangeslider__handle {
    width: 30px !important;
    height: 30px !important;
  }
  .player-container .controls .controls-left i.icon-select-prev, .player-container .controls .controls-right i {
    font-size: 30px;
    /*margin-top: 4px;*/
  }
  .player-container footer .seekbar .endTime {
    font-size: 30px;
  }
  .player-container .controls {
    top: 16px;
  }
  .player-container .controls .controls-right i {
    margin-right: 35px;
  }
  .player-container .subtitleText.subtitleText-no-footer {
    bottom: 85px;
  }
  .player-container .subtitleText.subtitleText-footer {
    bottom: 135px;
  }
  .player-container .watchlist-parent p, .player-container .replay p {
    font-size: 24px;
  }
  .player-container i.icon-back-2 {
    font-size: 30px;
    margin-top: 8px;
  }
  .network-error i.icon-back-2, .partner-error i.icon-back-2 {
    font-size: 28px;
  }
}
/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
  .player-container header {
    top: 50px;
  }
  .player-container .play-controls i {
    font-size: 84px;
    margin-right: 110px;
  }
  .player-container .playerProgressBar, .player-container .rangeslider-horizontal {
    height: 10px;
  }
  .player-container .circular-span, .player-container .rangeslider__handle {
    width: 38px !important;
    height: 38px !important;
  }
  .player-container .controls .controls-left i.icon-select-prev, .player-container .controls .controls-right i {
    font-size: 30px;
    margin-top: 1px;
  }
  .player-container footer .seekbar .endTime {
    font-size: 30px;
    margin-top: 1px;
  }
  .player-container .controls {
    top: 23px;
  }
  .player-container .controls .controls-right i {
    margin-right: 40px;
  }
  .player-container .watchlist-parent p, .player-container .replay p {
    font-size: 26px;
  }
  .player-container i.icon-back-2 {
    margin-top: 8px;
  }
  .network-error i.icon-back-2, .partner-error i.icon-back-2 {
    font-size: 33px;
  }
}
@media only screen and (max-width: 768px) {
  .player-container header h3 {
    font-size: 22px;
  }
  .player-container .subtitleText.subtitleText-no-footer {
    font-size: 22px;
    padding: 0 10px;
  }
  .player-container .subtitleText.subtitleText-footer {
    font-size: 22px;
    padding: 0 10px;
  }
}
hungama-player-view#player-view {
  background: none;
}

@media only screen and (min-width: 2500px) and (max-width: 3000px) {
  .subtitleText.subtitleText-footer {
    bottom: 200px;
  }
}
@media only screen and (max-width: 480px) {
  .player-container .scroll-loader {
    left: 24%;
    top: 35%;
  }
  .player-container i.icon-back-2 {
    font-size: 14px;
    margin-top: 7px;
  }
  .player-container .play-controls i {
    font-size: 24px !important;
  }
  .player-container header h3 {
    font-size: 14px !important;
  }
  .controls .controls-left i.icon-select-prev, .controls .controls-right i {
    font-size: 10px !important;
    /*margin-top: 4px;*/
  }
  .network-error .icon-alert-upd, .partner-error .icon-alert-upd {
    font-size: 50px !important;
  }
  .network-error h6, .partner-error h6 {
    font-size: 24px !important;
  }
  .network-error .btn, .partner-error .btn {
    margin-right: 0px !important;
  }
  footer .seekbar .endTime {
    font-size: 11px !important;
  }
}
@media only screen and (max-width: 430px) {
  footer .seekbar .endTime {
    font-size: 10px !important;
  }
}
@media only screen and (max-width: 390px) {
  .controls .controls-left i.icon-select-prev, .controls .controls-right i {
    font-size: 9px !important;
    /*margin-top: 4px;*/
  }
  footer .seekbar .endTime {
    font-size: 9px !important;
    margin-top: 13px !important;
  }
}
@media only screen and (max-width: 371px) {
  .controls .controls-left i.icon-select-prev, .controls .controls-right i {
    font-size: 10px !important;
    /*margin-top: 4px;*/
  }
  .player-container .controls .controls-right i {
    margin: 0px 0px 0px 0px;
    padding: 0px 6px 0px 6px;
  }
  footer .seekbar .endTime {
    font-size: 8px !important;
    margin-top: 14px !important;
  }
}
@media only screen and (max-width: 300px) {
  .controls .controls-left i.icon-select-prev, .controls .controls-right i {
    font-size: 8px !important;
    /*margin-top: 4px;*/
  }
  .player-container .controls .controls-right i {
    margin: 0px 0px 0px 0px;
    padding: 0px 3px 0px 3px;
  }
  .network-error h6, .partner-error h6 {
    font-size: 22px !important;
  }
  footer .seekbar .endTime {
    font-size: 7px !important;
    margin-top: 15px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.logituit_close {
  display: none;
  visibility: hidden;
}

.logituit_miniPlayerTooltip {
  display: none;
  visibility: hidden;
}

.logituit_vjs-title-bar {
  display: none;
  visibility: hidden;
}

.logituit_miniPlayer {
  display: none;
  visibility: hidden;
}

.video-js .vjs-play-progress:before {
  color: #e5007d !important;
}

.video-js .vjs-play-progress {
  background-image: linear-gradient(to right, #e5007d, #e5007d);
}

.vjs-volume-bar.vjs-slider-horizontal .vjs-volume-level {
  background-image: linear-gradient(to right, #e5007d, #e5007d);
}

@media screen and (max-width: 480px) {
  #eros-player .video-js .vjs-tech {
    min-height: 100vh !important;
    margin-top: -4em;
  }
  #eros-player .video-js .vjs-control {
    min-height: 100vh;
    margin-top: -3em;
  }
  #eros-player .video-js .vjs-time-control {
    margin-top: -0.4em;
  }
  #eros-player .video-js .logituit_play {
    top: 48% !important;
  }
  #eros-player .video-js .logituit_forward {
    top: 45% !important;
  }
  #eros-player .video-js .logituit_rewind {
    top: 45% !important;
  }
  #eros-player .video-js .logituit_pause {
    top: 48% !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.change-email-form .form-group {
  margin: 20px auto;
}
.change-email-form .form-group .form-data p.current-email {
  color: #ffffff;
  font-size: 16px;
  font-family: sky_med;
}
.change-email-form .form-group .primary-btn {
  margin-top: 22px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

#timer {
  color: #ffffff;
  font-size: 14px;
  margin-top: 6px;
  margin-left: 8px;
  font-family: sky_reg;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .timer {
    left: auto;
    right: 6%;
    top: 32px;
  }
}
#time, #attempts {
  display: none;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.resend-otp-container {
  vertical-align: baseline;
}
.resend-otp-container.disabled {
  vertical-align: bottom;
}
.resend-otp-container.disabled span.blue-text {
  color: #52547a;
}
.resend-otp-container p {
  color: #4a90e2;
  font-weight: bold;
}
.resend-otp-container p i {
  color: #4a90e2;
  position: relative;
  vertical-align: bottom;
  right: 2px;
}
.resend-otp-container span {
  font-family: sky_med;
  font-size: 14px;
  color: #ffffff;
  line-height: 1.2;
}
.resend-otp-container #resend-button.disabled {
  color: #52547a;
  pointer-events: none;
}
.resend-otp-container #resend-button.disabled i {
  color: #52547a;
}

.password-case {
  display: none;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.link-accounts-container input {
  display: inline-block;
}
.link-accounts-container .link-acc-instruction {
  font-size: 15px;
  font-family: sky_reg;
  color: #a3a6c2;
  line-height: 18px;
}
.link-accounts-container .resend-otp-container {
  display: inline-block;
}
.link-accounts-container .resend-otp-container p {
  margin-left: 20px;
}

.link-account-modal .popupSec {
  width: 554px;
  height: 519px;
}
.link-account-modal .popupSec .modal-body {
  padding: 100px 50px 125px 50px;
}
.link-account-modal .popupSec .get-icon-success-tick {
  font-size: 62px;
  padding: 7.5px 18.5px;
}
.link-account-modal .popupSec .get-icon-success-tick i {
  font-size: 45px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.transaction-history-container {
  height: 500px;
  overflow: auto;
  width: 70%;
  font-family: sky_med;
}
.transaction-history-container h3, .transaction-history-container h6 {
  color: #ffffff;
}
.transaction-history-container .transaction-history-list {
  display: flex;
  border-bottom: 1px solid #979797;
  padding: 10px 0;
  margin-right: 26px;
}
.transaction-history-container .transaction-history-list div:first-child {
  flex: 0 0 85%;
}
.transaction-history-container .transaction-history-list div.right-child {
  flex: 0 0 15%;
  text-align: right;
  color: #ffffff;
  font-size: 20px;
}
.transaction-history-container .transaction-history-list div.right-child i.icon-inr {
  vertical-align: bottom;
  position: relative;
  right: 8px;
  font-size: 18px;
}
.transaction-history-container .transaction-history-list div.right-child p.down-icon {
  position: relative;
  top: 5px;
  font-size: 24px;
  float: right;
  width: fit-content;
  cursor: pointer;
}
.transaction-history-container .transaction-history-list div.transaction-history-list-item p {
  color: #a3a6c2;
  padding: 2px 0;
  line-height: 1.1;
  font-size: 14px;
}
.transaction-history-container .transaction-history-list div.transaction-history-list-item p a.more-less {
  display: block;
  line-height: 1.45;
  margin-bottom: -8px;
  padding: 2px 0;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/* Copyright 2014 Mozilla Foundation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
:root {
  --react-pdf-annotation-layer: 1;
  --annotation-unfocused-field-background: url("data:image/svg+xml;charset=UTF-8,<svg width='1px' height='1px' xmlns='http://www.w3.org/2000/svg'><rect width='100%' height='100%' style='fill:rgba(0, 54, 255, 0.13);'/></svg>");
  --input-focus-border-color: Highlight;
  --input-focus-outline: 1px solid Canvas;
  --input-unfocused-border-color: transparent;
  --input-disabled-border-color: transparent;
  --input-hover-border-color: black;
}

@media (forced-colors: active) {
  :root {
    --input-focus-border-color: CanvasText;
    --input-unfocused-border-color: ActiveText;
    --input-disabled-border-color: GrayText;
    --input-hover-border-color: Highlight;
  }
  .annotationLayer .textWidgetAnnotation input:required,
  .annotationLayer .textWidgetAnnotation textarea:required,
  .annotationLayer .choiceWidgetAnnotation select:required,
  .annotationLayer .buttonWidgetAnnotation.checkBox input:required,
  .annotationLayer .buttonWidgetAnnotation.radioButton input:required {
    outline: 1.5px solid selectedItem;
  }
}
.annotationLayer {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  transform-origin: 0 0;
  --scale-factor: 1;
}

.annotationLayer section {
  position: absolute;
  text-align: initial;
  pointer-events: auto;
  box-sizing: border-box;
  transform-origin: 0 0;
}

.annotationLayer .linkAnnotation > a,
.annotationLayer .buttonWidgetAnnotation.pushButton > a {
  position: absolute;
  font-size: 1em;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.annotationLayer .buttonWidgetAnnotation.pushButton > canvas {
  width: 100%;
  height: 100%;
}

.annotationLayer .linkAnnotation > a:hover,
.annotationLayer .buttonWidgetAnnotation.pushButton > a:hover {
  opacity: 0.2;
  background: rgb(255, 255, 0);
  box-shadow: 0 2px 10px rgb(255, 255, 0);
}

.annotationLayer .textAnnotation img {
  position: absolute;
  cursor: pointer;
  width: 100%;
  height: 100%;
}

.annotationLayer .textWidgetAnnotation input,
.annotationLayer .textWidgetAnnotation textarea,
.annotationLayer .choiceWidgetAnnotation select,
.annotationLayer .buttonWidgetAnnotation.checkBox input,
.annotationLayer .buttonWidgetAnnotation.radioButton input {
  background-image: var(--annotation-unfocused-field-background);
  border: 2px solid var(--input-unfocused-border-color);
  box-sizing: border-box;
  font: calc(9px * var(--scale-factor)) sans-serif;
  height: 100%;
  margin: 0;
  vertical-align: top;
  width: 100%;
}

.annotationLayer .textWidgetAnnotation input:required,
.annotationLayer .textWidgetAnnotation textarea:required,
.annotationLayer .choiceWidgetAnnotation select:required,
.annotationLayer .buttonWidgetAnnotation.checkBox input:required,
.annotationLayer .buttonWidgetAnnotation.radioButton input:required {
  outline: 1.5px solid red;
}

.annotationLayer .choiceWidgetAnnotation select option {
  padding: 0;
}

.annotationLayer .buttonWidgetAnnotation.radioButton input {
  border-radius: 50%;
}

.annotationLayer .textWidgetAnnotation textarea {
  resize: none;
}

.annotationLayer .textWidgetAnnotation input[disabled],
.annotationLayer .textWidgetAnnotation textarea[disabled],
.annotationLayer .choiceWidgetAnnotation select[disabled],
.annotationLayer .buttonWidgetAnnotation.checkBox input[disabled],
.annotationLayer .buttonWidgetAnnotation.radioButton input[disabled] {
  background: none;
  border: 2px solid var(--input-disabled-border-color);
  cursor: not-allowed;
}

.annotationLayer .textWidgetAnnotation input:hover,
.annotationLayer .textWidgetAnnotation textarea:hover,
.annotationLayer .choiceWidgetAnnotation select:hover,
.annotationLayer .buttonWidgetAnnotation.checkBox input:hover,
.annotationLayer .buttonWidgetAnnotation.radioButton input:hover {
  border: 2px solid var(--input-hover-border-color);
}

.annotationLayer .textWidgetAnnotation input:hover,
.annotationLayer .textWidgetAnnotation textarea:hover,
.annotationLayer .choiceWidgetAnnotation select:hover,
.annotationLayer .buttonWidgetAnnotation.checkBox input:hover {
  border-radius: 2px;
}

.annotationLayer .textWidgetAnnotation input:focus,
.annotationLayer .textWidgetAnnotation textarea:focus,
.annotationLayer .choiceWidgetAnnotation select:focus {
  background: none;
  border: 2px solid var(--input-focus-border-color);
  border-radius: 2px;
  outline: var(--input-focus-outline);
}

.annotationLayer .buttonWidgetAnnotation.checkBox :focus,
.annotationLayer .buttonWidgetAnnotation.radioButton :focus {
  background-image: none;
  background-color: transparent;
}

.annotationLayer .buttonWidgetAnnotation.checkBox :focus {
  border: 2px solid var(--input-focus-border-color);
  border-radius: 2px;
  outline: var(--input-focus-outline);
}

.annotationLayer .buttonWidgetAnnotation.radioButton :focus {
  border: 2px solid var(--input-focus-border-color);
  outline: var(--input-focus-outline);
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after,
.annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
  background-color: CanvasText;
  content: "";
  display: block;
  position: absolute;
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before,
.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {
  height: 80%;
  left: 45%;
  width: 1px;
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:before {
  transform: rotate(45deg);
}

.annotationLayer .buttonWidgetAnnotation.checkBox input:checked:after {
  transform: rotate(-45deg);
}

.annotationLayer .buttonWidgetAnnotation.radioButton input:checked:before {
  border-radius: 50%;
  height: 50%;
  left: 30%;
  top: 20%;
  width: 50%;
}

.annotationLayer .textWidgetAnnotation input.comb {
  font-family: monospace;
  padding-left: 2px;
  padding-right: 0;
}

.annotationLayer .textWidgetAnnotation input.comb:focus {
  /*
   * Letter spacing is placed on the right side of each character. Hence, the
   * letter spacing of the last character may be placed outside the visible
   * area, causing horizontal scrolling. We avoid this by extending the width
   * when the element has focus and revert this when it loses focus.
   */
  width: 103%;
}

.annotationLayer .buttonWidgetAnnotation.checkBox input,
.annotationLayer .buttonWidgetAnnotation.radioButton input {
  appearance: none;
}

.annotationLayer .popupTriggerArea {
  height: 100%;
  width: 100%;
}

.annotationLayer .popupWrapper {
  position: absolute;
  font-size: calc(9px * var(--scale-factor));
  width: 100%;
  min-width: calc(180px * var(--scale-factor));
  pointer-events: none;
}

.annotationLayer .popup {
  position: absolute;
  max-width: calc(180px * var(--scale-factor));
  background-color: rgb(255, 255, 153);
  box-shadow: 0 calc(2px * var(--scale-factor)) calc(5px * var(--scale-factor)) rgb(136, 136, 136);
  border-radius: calc(2px * var(--scale-factor));
  padding: calc(6px * var(--scale-factor));
  margin-left: calc(5px * var(--scale-factor));
  cursor: pointer;
  font: message-box;
  white-space: normal;
  word-wrap: break-word;
  pointer-events: auto;
}

.annotationLayer .popup > * {
  font-size: calc(9px * var(--scale-factor));
}

.annotationLayer .popup h1 {
  display: inline-block;
}

.annotationLayer .popupDate {
  display: inline-block;
  margin-left: calc(5px * var(--scale-factor));
}

.annotationLayer .popupContent {
  border-top: 1px solid rgb(51, 51, 51);
  margin-top: calc(2px * var(--scale-factor));
  padding-top: calc(2px * var(--scale-factor));
}

.annotationLayer .richText > * {
  white-space: pre-wrap;
  font-size: calc(9px * var(--scale-factor));
}

.annotationLayer .highlightAnnotation,
.annotationLayer .underlineAnnotation,
.annotationLayer .squigglyAnnotation,
.annotationLayer .strikeoutAnnotation,
.annotationLayer .freeTextAnnotation,
.annotationLayer .lineAnnotation svg line,
.annotationLayer .squareAnnotation svg rect,
.annotationLayer .circleAnnotation svg ellipse,
.annotationLayer .polylineAnnotation svg polyline,
.annotationLayer .polygonAnnotation svg polygon,
.annotationLayer .caretAnnotation,
.annotationLayer .inkAnnotation svg polyline,
.annotationLayer .stampAnnotation,
.annotationLayer .fileAttachmentAnnotation {
  cursor: pointer;
}

.annotationLayer section svg {
  position: absolute;
  width: 100%;
  height: 100%;
}

.annotationLayer .annotationTextContent {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  color: transparent;
  user-select: none;
  pointer-events: none;
}

.annotationLayer .annotationTextContent span {
  width: 100%;
  display: inline-block;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.contact-us-container.form-container {
  height: 100vh;
  margin-top: 0;
}
.contact-us-container .page-heading {
  margin-bottom: 45px;
}
.contact-us-container .contact-us-block {
  display: flex;
  height: 100%;
}
.contact-us-container .contact-us-block .contact-us-items {
  width: 324px;
  color: white;
}
.contact-us-container .contact-us-block .contact-us-items div.message {
  cursor: initial;
  margin-top: 16px;
  font-family: volte_medium !important;
}
.contact-us-container .contact-us-block .contact-us-items .active {
  background: none;
  border: 1px solid #564372;
}
.contact-us-container .contact-us-block .contact-us-items a {
  text-decoration: none;
}
.contact-us-container .contact-us-block .contact-us-items li {
  list-style: none;
  width: 324px;
  height: 40px;
  display: block;
  background-color: none;
  border: 1px solid #564372;
  margin-bottom: 6px;
}
.contact-us-container .contact-us-block .contact-us-items li span {
  position: relative;
  top: 12px;
  left: 14px;
  font-size: 16px;
  color: #ffffff;
  font-family: volte_medium;
}
.contact-us-container .contact-us-block .contact-us-items li span i {
  position: relative;
  margin-right: 16px;
  vertical-align: middle;
}
.contact-us-container .contact-us-block .contact-us-items li span i.icon-email {
  font-size: 12px;
}
.contact-us-container .contact-us-block .contact-us-items li span i.icon-chat {
  margin-right: 13px;
}
.contact-us-container .contact-us-block .contact-us-items li:hover {
  background-color: #e10092;
  border: 1px solid #ffffff;
}

@media only screen and (max-width: 860px) {
  .contact-us-container.form-container {
    height: 100%;
  }
  .contact-us-container .contact-us-block {
    display: block;
  }
  .contact-us-container .contact-us-block .contact-us-items {
    width: 100%;
    display: block;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.faq-container {
  color: #ffffff;
  padding-left: 50px;
  width: 71.31%; /* equivalent to 855px i.e. panel width*/
  height: 100%;
}
.faq-container .heading {
  line-height: 16px;
  font-size: 20px;
  font-family: volte_medium;
  padding-top: 10px;
}
.faq-container .accordion {
  scrollbar-width: thin;
  overflow: auto;
  margin-top: 25px;
  padding-right: 26px;
  cursor: pointer;
  height: 82%;
}
.faq-container .accordion .panel {
  width: 100%;
  min-height: 55px;
  max-height: fit-content;
  background-color: none;
  border: 1px solid #564372;
  padding: 18.5px 37px 18.5px 20px;
  margin-bottom: 6px;
  cursor: pointer;
}
.faq-container .accordion .panel.panel-active {
  height: auto;
}
.faq-container .accordion .panel.panel-active .acc-body {
  display: block;
}
.faq-container .accordion .panel.panel-active .acc-header .icon-down {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
  margin-top: 8px;
}
.faq-container .accordion .panel .acc-header {
  font-size: 16px;
  font-family: volte_medium;
}
.faq-container .accordion .panel .acc-header span:first-child {
  width: 93%;
  display: inline-block;
  line-height: normal;
  margin-right: 1%;
}
.faq-container .accordion .panel .acc-header span:nth-child(2) {
  width: 6%;
}
.faq-container .accordion .panel .acc-header .icon-down {
  width: 16px;
  height: 9px;
  float: right;
}
.faq-container .accordion .panel .acc-header .icon-down:before {
  color: #a3a6c2;
}
.faq-container .accordion .panel .acc-body {
  font-family: volte_medium;
  line-height: 1.54;
  letter-spacing: 0.34px;
  color: #f3cbe3;
  display: none;
  margin-top: 20px;
}
.faq-container .accordion .panel .acc-body.active {
  display: block;
}
@media only screen and (max-width: 860px) {
  .faq-container {
    width: 100%;
    display: block;
    padding-left: 0;
    margin-top: 40px;
  }
  .faq-container .accordion {
    height: 549px;
  }
}
@font-face {
    font-family: 'sky_reg';
    src: url(/af80c018da3e3742f6bcf4ecfc329346.woff) format('truetype')
}

@font-face {
    font-family: 'sky_med';
    src: url(/615404d8063680e0cb68beb55c15c96a.woff) format('truetype')
}

@font-face {
    font-family: 'sky_bold';
    src: url(/4ca661b7a15d4a0ee744615d9f9ccf84.ttf) format('truetype')
}

@font-face {
    font-family: 'sky_italic';
    src: url(/31d6cfe0d16ae931b73c59d7e0c089c0.ttf) format('truetype');
}

@font-face {
    font-family: 'icomoon';
    src: url(/4525a954cbe5c383de67ff089ad00ee0.eot);
    src: url(/4525a954cbe5c383de67ff089ad00ee0.eot#iefix) format('embedded-opentype'),
    url(/8b4e5eb3579e711e238fb488b30abeee.ttf) format('truetype'),
    url(/9f791e831b25893236ce68e4ea963879.woff) format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
@font-face {
    font-family: 'volte_medium';
    src: url(/40996ab8467a7691541ec7f325f410a2.woff) format('truetype')
}
@font-face {
    font-family: 'volte_reg';
    src: url(/571797379b832bca58eec4781df136b9.woff) format('truetype')
}
@font-face {
    font-family: 'volte_semiBold';
    src: url(/a62132926fc1ebc477281f42ed22c55f.ttf) format('truetype')
}
@font-face {
    font-family: 'volte_bold';
    src: url(/f7ec6201e9df24efcd0e3288cf196f14.woff) format('truetype')
}

html {
    scrollbar-color: #6b00dd #33345d;
    scrollbar-width: thin;
    cursor: pointer;
}

body {
    margin: 0;
}

a {
    color: #e10092;
}

.privacy-policy.main-container {
    margin-top: 0;
    padding: 0;
    min-height: 100vh;
    background-color: #020005;
    cursor: default;
}

.privacy-policy-container p {
    background-repeat: no-repeat;
    background-size: 20px;
    padding-left: 30px;
}

.privacy-policy-container li {
    margin: 10px;
}

.privacy-policy-container {
    color: #fff;
    padding: 10px 10px 50px 10px;
}

.privacy-policy-container.form-container .page-heading {
    margin-top: 25px;
}

.privacy-policy-container p.privacy-sub-head {
    font-size: 16px;
    font-family: volte_medium;
    margin-bottom: 12px;
}

.privacy-policy-container .privacy-policy-text {
    font-family: volte_reg;
    font-size: 14px;
    font-weight: normal;
    overflow-y: auto;
    padding-right: 20px;
    box-sizing: border-box;
}

.privacy-policy-container .privacy-policy-text p {
    font-family: volte_reg;
    line-height: 1.1;
}

.page-main-heading {
    font-family: volte_medium;
    font-size: 35px;
    font-weight: normal;
    line-height: 1.3;
    font-style: normal;
    font-stretch: normal;
    color: #fff;
}

.sub-heading {
    margin-left: 10px;
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-thumb {
    background: #220046;
    border-radius: 50px;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px  #8856df;
    border-radius: 5px;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px),
(min-device-width: 320px) and (max-device-width: 812px) and (orientation: landscape),
(max-device-width: 892px) and (orientation: landscape) {

    .privacy-policy.main-container{

    }
    .form-container {
        padding: 1px 10px 50px 40px;
    }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.privacy-policy-container {
  color: #ffffff;
  height: 100vh;
}
.privacy-policy-container.form-container {
  padding: 0;
  margin-top: 0;
}
.privacy-policy-container.form-container .page-heading {
  margin-top: 25px;
}
.privacy-policy-container iframe {
  width: 74%;
  margin-left: 10%;
  height: 85%;
  margin-top: 1em;
}
.privacy-policy-container p.privacy-sub-head {
  font-size: 16px;
  font-family: volte_medium;
  margin-bottom: 12px;
}
.privacy-policy-container .privacy-policy-text {
  width: 933px;
  height: 543px;
  font-family: volte_reg;
  font-size: 14px;
  font-weight: normal;
  overflow-y: auto;
  padding-right: 20px;
  box-sizing: border-box;
}
.privacy-policy-container .privacy-policy-text p {
  line-height: 1.1;
}
@media only screen and (min-width: 446px) and (max-width: 768px) {
  .privacy-policy-container iframe {
    width: 85%;
    height: 80%;
  }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px), (min-device-width: 320px) and (max-device-width: 812px) and (orientation: landscape), (max-device-width: 892px) and (orientation: landscape) {
  .privacy-policy-container iframe {
    width: 100%;
    height: 100%;
    margin-left: 0px;
  }
  .privacy-policy-container .privacy-policy-text {
    width: auto;
    height: auto;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.page-not-found {
  background-color: #1d1e30;
  height: 100vh;
}
.page-not-found .page-not-found-bg {
  height: 98vh;
  background-repeat: no-repeat;
  background-size: cover;
}
.page-not-found .page-not-found-bg.show-bg-img {
  background-image: url(/3072d21731f45739b16a14e5630bbe17.jpg);
}
.page-not-found .page-not-found-bg .pageNotFound-content {
  padding: 80px 0;
  height: 100%;
  text-align: center;
}
.page-not-found .page-not-found-bg .pageNotFound-content.show-bg-color {
  background-color: rgba(0, 0, 0, 0.79);
  padding: 0;
}
.page-not-found .page-not-found-bg .pageNotFound-content img {
  height: 61px;
  position: relative;
  top: 58px;
  margin-bottom: 133px;
}
.page-not-found .page-not-found-bg .pageNotFound-content img.for-app-install {
  margin-bottom: 100px;
}
.page-not-found .page-not-found-bg .pageNotFound-content .download-section .app-install-block img:hover {
  transform: scale(1.06);
}
.page-not-found .page-not-found-bg .pageNotFound-content h1 {
  font-weight: 700;
  margin-bottom: 15px;
  font-size: 62px;
}
.page-not-found .page-not-found-bg .pageNotFound-content p {
  color: #ffffff;
  font-size: 35px;
}
.page-not-found .pnf-border-top,
.page-not-found .pnf-border-bottom {
  height: 5px;
  background-image: linear-gradient(to left, #f07e24, #e52a2d 23%, #b12886 34%, #0c58a2);
}
.page-not-found .download-section {
  text-align: center;
  padding-top: 50px;
}
.page-not-found .download-section a {
  display: inline-block;
  -webkit-tap-highlight-color: transparent;
  -moz-tap-highlight-color: transparent;
  -o-tap-highlight-color: transparent;
}
.page-not-found .download-section a:first-child {
  margin-right: 12px;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .page-not-found .page-not-found-bg {
    height: 98.9vh;
  }
  .page-not-found .page-not-found-bg .pageNotFound-content {
    padding: 50px 0;
  }
  .page-not-found .page-not-found-bg .pageNotFound-content img {
    height: 51px;
  }
  .page-not-found .page-not-found-bg .pageNotFound-content img.logo {
    width: auto;
    height: auto;
    padding: 0 20px;
  }
  .page-not-found .page-not-found-bg .pageNotFound-content h1 {
    font-size: 52px;
  }
  .page-not-found .page-not-found-bg .pageNotFound-content p {
    font-size: 25px;
    padding: 0 20px;
  }
  .page-not-found .page-not-found-bg .download-section.for-app-install {
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-top: 58px;
  }
  .page-not-found .page-not-found-bg .download-section.for-app-install a {
    display: block;
    width: fit-content;
  }
  .page-not-found .page-not-found-bg .download-section.for-app-install a:first-child {
    margin-right: 0;
  }
  .page-not-found .page-not-found-bg .download-section.for-app-install a img {
    margin-bottom: 10px;
    width: 153px;
    top: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.myplan-bgimage-container {
  padding-bottom: 30px;
}
.myplan-bgimage-container .flex-sb {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.myplan-bgimage-container .device-details {
  padding-top: 24px;
  margin-top: 22px;
}
.myplan-bgimage-container .device-details .mobile-wrapper {
  padding-left: 4px;
}
.myplan-bgimage-container .device-details .mobile-wrapper div {
  max-width: 23px;
  height: 19px;
}
.myplan-bgimage-container .device-details .mobile-wrapper img {
  width: 100%;
  height: 100%;
  background: #220046;
}
.myplan-bgimage-container .device-details .mobile-wrapper p {
  padding-left: 20px;
}
.myplan-bgimage-container .device-details p {
  font-family: volte_medium;
  font-size: 16px;
}
@media only screen and (max-width: 480px) {
  .myplan-bgimage-container .device-details {
    padding: 0 20px;
    margin-top: 12px;
  }
  .myplan-bgimage-container .device-details p {
    font-size: 14px;
  }
  .myplan-bgimage-container .device-details .mobile-wrapper p {
    padding-left: 12px;
  }
}
.myplan-bgimage-container .more-options-container .popupSec {
  width: 640px;
  max-height: 351px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border-radius: 20px;
  padding: 58px 110px 30px;
  border: 1px solid #564372;
}
.myplan-bgimage-container .more-options-container .popupSec .modal-body {
  padding: 0;
}
.myplan-bgimage-container .more-options-container .popupSec .modal-header {
  padding: 0;
}
.myplan-bgimage-container .more-options-container .popupSec .modal-header h3 {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  /* or 31px */
  font-family: volte_medium;
  text-align: center;
  /* White */
}
.myplan-bgimage-container .more-options-container .popupSec .not-now {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  cursor: pointer;
  color: #f3cbe3;
}
.myplan-bgimage-container .expired-plan-wrapper .my-plans-container {
  border: 2px solid #E56C6C !important;
}
.myplan-bgimage-container .expired-plan-wrapper .my-plans-container .content-wrapper {
  margin-right: 15px;
}
.myplan-bgimage-container .my-plans-wrapper {
  margin: 15px auto 0px auto;
  text-align: center;
  width: 642px;
  position: relative;
}
.myplan-bgimage-container .my-plans-wrapper h3:nth-child(1) {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: center;
  opacity: 0.8;
}
.myplan-bgimage-container .my-plans-wrapper .cancel-button {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  font-family: volte_semiBold;
  text-align: center;
  color: #f3cbe3;
  margin-top: 60px;
}
.myplan-bgimage-container .my-plans-wrapper .cancel-button span {
  cursor: pointer;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-container {
  background: #EFE8FB;
  margin-top: 22.5px;
  border-radius: 20px;
  padding-bottom: 30px;
  border: 1px solid #564372;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-container .footer-msg {
  font-family: volte_medium;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  color: #220046;
  margin: 10px 0px;
  padding: 0 20px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-container .regional-app-btn {
  background: transparent;
  color: #5087c7;
  border: 2px solid #F3CBE3;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  width: 50%;
  padding: 0px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-container .error-msg {
  font-family: volte_medium;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  color: #e56c6c;
  padding: 0 20px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-container .auto-renew {
  color: rgba(255, 255, 255, 0.75);
}
.myplan-bgimage-container .my-plans-wrapper .border-line {
  border: 1px solid #564372;
  opacity: 0.5;
  margin: 0 25px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14.5px 20px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .active {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading {
  display: flex;
  align-items: center;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper {
  width: 40px;
  height: 40px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper img {
  width: 100%;
  background: #220046;
  border-radius: 23.9063px;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading p:nth-child(2) {
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  padding-left: 19px;
  font-family: volte_medium;
  color: #564372;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .right-heading {
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  line-height: 120%;
  color: #220046;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .right-heading span:nth-child(1) {
  font-family: volte_bold;
}
.myplan-bgimage-container .my-plans-wrapper .my-plans-heading .right-heading span:nth-child(2) {
  font-family: volte_reg;
  font-size: 20px;
}
.myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper {
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .apps-count {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  font-family: volte_semiBold;
  color: #220046;
}
.myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .apps-count span {
  font-size: 22px;
}
.myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .pack-description {
  color: #220046;
}
.myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .expire-msg {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: right;
  flex: 2;
  color: #564372;
}
.myplan-bgimage-container .my-plans-wrapper .content-wrapper {
  width: 60px;
  height: 60px;
  margin-right: 16px;
  text-align: center;
  margin-top: 10px;
}
.myplan-bgimage-container .my-plans-wrapper .content-wrapper img {
  width: 100%;
  height: 100%;
  mix-blend-mode: normal;
  border-radius: 4.31023px;
}
.myplan-bgimage-container .my-plans-wrapper .partner-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0 12px 0 20px;
  margin-top: 10px;
  margin-bottom: 20px;
}
.myplan-bgimage-container .my-plans-wrapper .button-wrapper {
  background: #EFE8FB;
}
.myplan-bgimage-container .my-plans-wrapper .button-wrapper div:nth-child(1) p {
  color: #220046;
}
.myplan-bgimage-container .my-plans-wrapper .btn-wrapper {
  padding: 9px 52px;
  width: 420px;
  height: 45px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 20px auto;
}
.myplan-bgimage-container .my-plans-wrapper .btn-wrapper .button-text {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
}
.myplan-bgimage-container .my-plans-wrapper .other-option {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  cursor: pointer;
  font-family: volte_medium;
  color: #e10092;
  margin-top: 30px;
}
.myplan-bgimage-container .my-plans-wrapper .color-background {
  background: #1d1e30;
}
.myplan-bgimage-container .tik_my_plan_bottom_verbiage {
  font-size: 16px;
  font-weight: 500;
  color: #220046;
  line-height: 16.8px;
  font-family: volte_medium;
  text-align: start;
  padding: 0px 20px;
}
.myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container {
  display: flex;
  background: #d6c6f4;
  border-radius: 6px;
  height: 44px;
  align-items: center;
  font-size: 14px;
  color: #220046;
  margin-bottom: 8px;
}
.myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container img {
  width: 36px;
  height: 36px;
  margin-left: 5px;
  margin-right: 10px;
}
.myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .replace_verbiage {
  margin: 0;
}
.myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .tik_request_date {
  font-size: 14px;
  font-family: "volte_semiBold";
  color: #6b00dd;
  padding-left: 5px;
}
.myplan-bgimage-container .tik_my_plan_bottom_verbiage p {
  margin-bottom: 8px;
}
@media only screen and (max-device-width: 480px) {
  .myplan-bgimage-container .tik_my_plan_bottom_verbiage {
    font-size: 12px;
    font-weight: 500;
    color: #564372;
    line-height: 14.4px;
    padding: 0px 15px 0px 15px;
  }
  .myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container {
    height: 42px;
    font-size: 12px;
  }
  .myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .replace_verbiage {
    margin: 0;
  }
  .myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container img {
    width: 30px;
    height: 30px;
    margin-left: 5px;
    margin-right: 10px;
  }
  .myplan-bgimage-container .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .tik_request_date {
    font-size: 12px;
  }
}
@media only screen and (max-width: 640px) {
  .myplan-bgimage-container .cancel-addon-container .popupSec {
    width: 90%;
    padding: 20px;
  }
  .myplan-bgimage-container .more-options-container .popupSec {
    width: 90%;
    max-height: 178px;
    background-color: #33354d;
    border-radius: 20px 20px;
    padding: 20px;
  }
  .myplan-bgimage-container .expired-plan-wrapper .my-plans-container .content-wrapper {
    margin-right: 10px;
  }
  .myplan-bgimage-container .my-plans-wrapper {
    margin: 0 auto;
    width: 90%;
  }
  .myplan-bgimage-container .my-plans-wrapper h3:nth-child(1) {
    font-size: 22px;
    opacity: 1;
  }
  .myplan-bgimage-container .my-plans-wrapper .cancel-button {
    font-size: 16px;
    margin-top: 20px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-container {
    margin-bottom: 20px;
    padding-bottom: 10px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-container .footer-msg {
    margin-top: 12px;
    font-size: 14px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-container .regional-app-btn {
    width: 179px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-container .error-msg {
    font-size: 16px;
  }
  .myplan-bgimage-container .my-plans-wrapper .border-line {
    border: 1px solid #564372;
    opacity: 0.5;
    margin: 0 20px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18.5px 20px 0px 20px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading {
    display: flex;
    align-items: center;
    margin-top: -4px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper {
    width: 20px;
    height: 20px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper img {
    width: 100%;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .left-heading p:nth-child(2) {
    font-size: 12px;
    padding-left: 4px;
    font-weight: 500;
    color: #220046;
    margin-top: 4px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .right-heading {
    font-size: 24px;
    font-weight: 600;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .right-heading span:nth-child(1) {
    font-size: 22px;
  }
  .myplan-bgimage-container .my-plans-wrapper .my-plans-heading .right-heading span:nth-child(2) {
    font-size: 12px;
  }
  .myplan-bgimage-container .my-plans-wrapper .sub-heading {
    padding-top: 10px;
    padding-bottom: 12px;
  }
  .myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper {
    padding: 0 20px;
    margin-top: 7px;
    color: #220046;
    font-weight: 500;
  }
  .myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .apps-count span:nth-child(1) {
    font-size: 20px;
  }
  .myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .apps-count span:nth-child(2) {
    font-size: 12px;
  }
  .myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .expire-msg {
    font-size: 12px;
  }
  .myplan-bgimage-container .my-plans-wrapper .sub-heading-wrapper .pack-description {
    font-size: 12px;
    font-weight: 600;
  }
  .myplan-bgimage-container .my-plans-wrapper .content-wrapper {
    width: 46px;
    height: 46px;
    margin-right: 10px;
    margin-top: 10px;
  }
  .myplan-bgimage-container .my-plans-wrapper .content-wrapper img {
    width: 100%;
    height: 100%;
    border-radius: 4.31023px;
  }
  .myplan-bgimage-container .my-plans-wrapper .partner-container {
    margin-top: 13px;
    margin-bottom: 18px;
  }
  .myplan-bgimage-container .my-plans-wrapper .btn-wrapper {
    padding: 9px 52px;
    width: 90%;
    height: 44px;
    margin: 15px auto;
  }
  .myplan-bgimage-container .my-plans-wrapper .btn-wrapper .button-text {
    font-size: 16px;
    font-family: volte_semiBold;
  }
  .myplan-bgimage-container .my-plans-wrapper .other-option {
    font-size: 16px;
    font-family: volte_medium;
    color: #e10092;
    margin-top: 15px;
  }
}

.fiber-verbiage {
  padding-bottom: 30px;
}
.fiber-verbiage p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 130%;
  text-align: center;
  letter-spacing: 0.1px;
  color: #D6C6F4;
}
.fiber-verbiage p a {
  color: #D6C6F4;
}

@media only screen and (max-width: 640px) {
  .myplan-bgimage-container {
    padding-bottom: 20px;
  }
  .more-options-container .popupSec {
    width: 90%;
    height: 257px;
    border-radius: 20px 20px;
    padding: 20px;
  }
  .more-options-container .popupSec .modal-header h3 {
    font-size: 22px;
  }
  .more-options-container .popupSec .not-now {
    font-size: 18px;
  }
  .fiber-verbiage {
    padding: 0px 11px 20px 11px;
  }
  .fiber-verbiage p {
    font-size: 12px;
  }
}
.cancel-addon-container .popupSec {
  width: 640px;
  background-color: #33354d;
  border-radius: 20px;
  padding: 23px 108px 24px;
}
.cancel-addon-container .popupSec .modal-body {
  padding: 0;
}
.cancel-addon-container .popupSec .modal-header {
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  padding: 0;
}
.cancel-addon-container .popupSec .modal-header h3 {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  /* or 31px */
  text-align: center;
  /* White */
}

@media only screen and (max-width: 640px) {
  .cancel-addon-container .popupSec {
    width: 90%;
    padding: 20px;
  }
  .more-options-container .popupSec {
    width: 90%;
    max-height: 178px;
    background-color: #33354d;
    border-radius: 20px 20px;
    padding: 20px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.color-background {
  background: #1d1e30;
}

.button-wrapper {
  display: flex;
  justify-content: space-between;
  height: 71px;
  align-items: center;
  background-color: #020005;
  mix-blend-mode: normal;
  border: 1px solid #564372;
  box-sizing: border-box;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  padding: 16px 15px 17px;
  margin: 20px 0;
  cursor: pointer;
}
.button-wrapper div:nth-child(1) {
  display: flex;
  align-items: center;
  padding-left: 3px;
}
.button-wrapper div:nth-child(1) img {
  border-radius: 20px;
  width: 40px;
  height: auto;
}
.button-wrapper div:nth-child(1) p {
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  padding-left: 24px;
  font-family: volte_medium;
  color: #ffffff;
  /* identical to box height, or 24px */
}

@media only screen and (max-width: 480px) {
  .button-wrapper {
    height: 56px;
    padding: 16px 15px 17px;
    margin: 15px 0;
  }
  .button-wrapper div:nth-child(1) {
    padding-left: 3px;
  }
  .button-wrapper div:nth-child(1) img {
    width: 20px;
    height: 20px;
    margin-bottom: 2px;
  }
  .button-wrapper div:nth-child(1) p {
    font-size: 16px;
    padding-left: 8px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.my-account-mobile-container .top-section {
  display: flex;
  width: 100%;
  min-height: 167px;
  max-height: 167px;
  align-items: center;
  border-bottom-left-radius: 30px;
  border-bottom-right-radius: 30px;
  box-shadow: 0 8px 21px 0 rgba(0, 0, 0, 0.28);
  background-color: #33354d;
  padding: 18px;
}
.my-account-mobile-container .top-section .img-section {
  width: 24%;
  margin-right: 20px;
}
.my-account-mobile-container .top-section .img-section .avatar-block {
  width: 70px;
  height: 70px;
  background: linear-gradient(to right, #f08300, #e3000f 43%, #a72879 101%);
  display: flex;
  align-items: center;
  border-radius: 50%;
  text-align: center;
  color: #ffffff;
}
.my-account-mobile-container .top-section .img-section .avatar-block p {
  width: inherit;
  position: relative;
  text-align: center;
  margin: auto;
  font-size: 60px;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .profile-img.add-border {
  max-width: 78px;
  max-height: 78px;
  display: block;
  border: 2px solid transparent;
  border-radius: 50%;
  background-image: linear-gradient(#33354d, #33354d), linear-gradient(121deg, #f08300 8%, #e3000f 31%, #a72879 73%, #064497 99%);
  background-origin: border-box;
  background-clip: content-box, border-box;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .profile-img img {
  max-width: 68px;
  max-height: 68px;
  margin: 3px;
  background: white;
  border-radius: 50%;
  width: 100px;
  height: 100px;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .profile-img-icon {
  position: relative;
  right: 21px;
  bottom: 4px;
  font-size: 40px;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .profile-img-icon.with-avatar {
  bottom: 0;
  top: 40px;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .avatar-image.sb-avatar__text {
  width: 72px;
  height: 72px;
  margin: 25px 0 35px 0;
  display: inline-block;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .avatar-image.sb-avatar.sb-avatar--text {
  position: relative;
  top: -15px;
  display: inline-block;
}
.my-account-mobile-container .top-section .img-section .profile-img-section .avatar-image.sb-avatar.sb-avatar--text div {
  font-size: 60px;
  position: relative;
  top: 6px;
}
.my-account-mobile-container .top-section .detail-section {
  width: 76%;
}
.my-account-mobile-container .top-section .detail-section p {
  display: block;
  font-family: sky_med;
  font-size: 14px;
  line-height: 1.43;
  color: #a3a6c2;
  text-overflow: ellipsis;
  overflow: hidden;
}
.my-account-mobile-container .top-section .detail-section p .binge-asset {
  margin-right: 10px;
  position: relative;
  top: 3px;
}
.my-account-mobile-container .top-section .detail-section p:first-child {
  font-size: 24px;
  color: #ffffff;
  line-height: normal;
}
.my-account-mobile-container .top-section .detail-section p.current-pack-details {
  margin-top: 18px;
}
.my-account-mobile-container .top-section .detail-section p.current-pack-details .pack-name {
  width: 80px;
}
.my-account-mobile-container .top-section .detail-section p span.date {
  font-family: sky_reg;
  margin-left: 10px;
}
.my-account-mobile-container .top-section .detail-section p span.date.expired {
  color: #e56c6c;
}
.my-account-mobile-container .top-section .detail-section p i.icon-device {
  margin-right: 10px;
}
.my-account-mobile-container .top-section .flex-active {
  display: flex;
  align-items: center;
}
.my-account-mobile-container .balance-block {
  text-align: center;
  height: 150px;
  box-shadow: 0 8px 21px 0 rgba(0, 0, 0, 0.28);
  background-color: #33354d;
  margin: 12px 18px;
  padding: 18px;
}
.my-account-mobile-container .balance-block p {
  display: block;
  font-family: sky_med;
  font-size: 14px;
  line-height: 1.43;
  color: #a3a6c2;
}
.my-account-mobile-container .balance-block p:nth-child(2) {
  font-family: sky_reg;
  font-size: 22px;
  color: #ffffff;
}
.my-account-mobile-container .balance-block p:nth-child(2) i.icon-inr {
  font-size: 18px;
  margin-right: 5px;
}
.my-account-mobile-container .balance-block p:nth-child(2) i.icon-refresh {
  font-size: 15px;
  margin-left: 10px;
}
.my-account-mobile-container .balance-block p:nth-child(2) i.icon-refresh:before {
  color: #a3a6c2;
}
.my-account-mobile-container .balance-block p:nth-child(3) {
  font-family: sky_reg;
  font-size: 12px;
  color: #ffffff;
  line-height: normal;
}
.my-account-mobile-container .balance-block button.btn.primary-btn {
  width: 100%;
  margin-top: 6px;
  font-size: 16px;
}
.my-account-mobile-container .subscription-block, .my-account-mobile-container .switch-account-block {
  display: flex;
  padding: 14px;
  margin: 18px;
  align-items: center;
  box-shadow: 0 8px 21px 0 rgba(0, 0, 0, 0.28);
  background-color: #33354d;
  color: #ffffff;
  font-size: 16px;
  line-height: normal;
  letter-spacing: normal;
}
.my-account-mobile-container .subscription-block span, .my-account-mobile-container .switch-account-block span {
  width: 83%;
  margin-left: 14px;
}
.my-account-mobile-container .switch-account-block {
  margin-top: -14px;
}
.my-account-mobile-container .button-block {
  width: 100%;
  padding: 18px;
  position: absolute;
  bottom: 0;
}
.my-account-mobile-container .button-block .btn {
  font-size: 16px;
  color: #ffffff;
  box-shadow: 0 8px 21px 0 rgba(0, 0, 0, 0.28);
  background-color: #33354d;
  border: none;
  width: 100%;
  padding: 14px 0;
  margin: 0;
}
.my-account-mobile-container .button-block .blue-text {
  font-family: sky_med;
  font-size: 16px;
  line-height: 1.5;
  text-align: center;
  color: #5087c7;
  margin-top: 20px;
  text-decoration: underline;
}
@media only screen and (min-device-width: 320px) and (max-device-height: 650px) {
  .my-account-mobile-container .button-block {
    position: relative;
    margin-top: 15%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position: relative;
}

.odometer.odometer-auto-theme .odometer-digit, .odometer.odometer-theme-default .odometer-digit {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  position: relative;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-digit-spacer, .odometer.odometer-theme-default .odometer-digit .odometer-digit-spacer {
  display: inline-block;
  vertical-align: middle;
  *vertical-align: auto;
  *zoom: 1;
  *display: inline;
  visibility: hidden;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-digit-inner, .odometer.odometer-theme-default .odometer-digit .odometer-digit-inner {
  text-align: left;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon {
  display: block;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-ribbon-inner, .odometer.odometer-theme-default .odometer-digit .odometer-ribbon-inner {
  display: block;
  -webkit-backface-visibility: hidden;
}

.odometer.odometer-auto-theme .odometer-digit .odometer-value, .odometer.odometer-theme-default .odometer-digit .odometer-value {
  display: block;
  -webkit-transform: translateZ(0);
}

.odometer.odometer-auto-theme .odometer-digit .odometer-value.odometer-last-value, .odometer.odometer-theme-default .odometer-digit .odometer-value.odometer-last-value {
  position: absolute;
}

.odometer.odometer-auto-theme.odometer-animating-up .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up .odometer-ribbon-inner {
  -webkit-transition: -webkit-transform 2s;
  -moz-transition: -moz-transform 2s;
  -ms-transition: -ms-transform 2s;
  -o-transition: -o-transform 2s;
  transition: transform 2s;
}

.odometer.odometer-auto-theme.odometer-animating-up.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-up.odometer-animating .odometer-ribbon-inner {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}

.odometer.odometer-auto-theme.odometer-animating-down .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down .odometer-ribbon-inner {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
}

.odometer.odometer-auto-theme.odometer-animating-down.odometer-animating .odometer-ribbon-inner, .odometer.odometer-theme-default.odometer-animating-down.odometer-animating .odometer-ribbon-inner {
  -webkit-transition: -webkit-transform 2s;
  -moz-transition: -moz-transform 2s;
  -ms-transition: -ms-transform 2s;
  -o-transition: -o-transform 2s;
  transition: transform 2s;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}

.odometer.odometer-auto-theme, .odometer.odometer-theme-default {
  font-family: "Helvetica Neue", sans-serif;
  line-height: 1.1em;
}

.odometer.odometer-auto-theme .odometer-value, .odometer.odometer-theme-default .odometer-value {
  text-align: center;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.balanceContainer .refreshBal i {
  color: #ffffff;
  line-height: normal;
  font-size: 30px;
  padding: 6px 0 0 8px;
  margin-left: 0 !important;
}
.balanceContainer .refreshBal i.refAnimate {
  animation: spin 1500ms cubic-bezier(0.075, 0.82, 0.165, 1) infinite;
  -webkit-animation: spin 1500ms cubic-bezier(0.075, 0.82, 0.165, 1) infinite;
  -moz-animation: spin 1500ms cubic-bezier(0.075, 0.82, 0.165, 1) infinite;
  -o-animation: spin 1500ms cubic-bezier(0.075, 0.82, 0.165, 1) infinite;
}
@-moz-keyframes spin {
  from {
    -moz-transform: rotate(0deg);
  }
  to {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  from {
    -webkit-transform: rotate(0deg);
  }
  to {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.balanceContainer .odometer {
  vertical-align: unset;
  line-height: inherit;
}
.balanceContainer .odometer-value {
  font-family: "sky_reg";
}
.balanceContainer .odometer-digit, .balanceContainer .odometer-digit-spacer {
  vertical-align: unset !important;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.payment-block {
  margin: auto;
  position: absolute;
  top: -4em;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(2, 0, 5, 0.75);
}
.payment-block .payment-description-block {
  width: 100%;
  height: 288px;
  align-items: center;
  display: flex;
  flex-direction: column;
  top: calc(45% - 144px);
  position: absolute;
  padding: 30px 20px;
}
.payment-block .payment-description-block .icon-block {
  margin: auto;
  /** i.icon-alert-upd {
     font-size: 82px;
   }**/
}
.payment-block .payment-description-block .icon-block .icon-success-upd:before {
  font-size: 40px;
}
.payment-block .payment-description-block .icon-block.fail {
  margin-bottom: 20px;
}
.payment-block .payment-description-block .icon-block.fail .icon-alert-upd:before {
  font-size: 50px;
}
.payment-block .payment-description-block .icon-block .get-icon-success-tick {
  background-color: #ffffff;
  padding: 31px 20px;
  border-radius: 50%;
}
.payment-block .payment-description-block .icon-block .get-icon-success-tick i:before {
  color: #7ed321;
  position: relative;
  top: 12px;
  font-size: 42px;
}
.payment-block .payment-description-block h1 {
  margin: 4px 0;
  font-family: volte_medium;
  font-size: 26px;
  letter-spacing: normal;
  text-align: center;
  color: #ffffff;
}
.payment-block .payment-description-block p {
  margin: 0 0 24px;
  font-family: volte_medium;
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: normal;
  text-align: center;
  color: #b6b7d4;
}
.payment-block .payment-description-block .primary-btn {
  width: 280px;
  background: #e10092;
  font-size: 16px;
  font-family: volte_medium;
  margin-left: 20px;
}
@media only screen and (min-width: 320px) and (max-width: 520px) {
  .payment-block .payment-description-block .icon-block {
    width: 49px;
    height: 49px;
  }
  .payment-block .payment-description-block .icon-block.fail {
    margin-bottom: 20px;
  }
  .payment-block .payment-description-block .icon-block i.icon-alert-upd {
    font-size: 49px;
  }
  .payment-block .payment-description-block .icon-block .get-icon-success-tick {
    padding: 16px 11px;
  }
  .payment-block .payment-description-block .icon-block .get-icon-success-tick i:before {
    top: 6px;
    font-size: 26px;
  }
  .payment-block .payment-description-block h1 {
    font-size: 20px;
    margin: 10px 0;
  }
  .payment-block .payment-description-block p {
    margin: 0 0 30px;
  }
  .payment-block .payment-description-block .primary-btn {
    padding: 0;
    width: 209px;
    height: 44px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.subscription-payment-background {
  position: absolute;
  width: 100%;
  min-height: 400px;
  right: 0;
  top: -4em;
  background-size: cover;
  background-repeat: no-repeat;
}
.subscription-payment-background img {
  width: 100%;
  max-height: 488px;
  position: absolute;
}

p.in-progress {
  width: 100%;
  color: white;
  position: relative;
  padding-top: 100px;
  text-align: center;
  font-size: 25px;
  font-family: volte_medium !important;
}

@media only screen and (max-width: 480px) {
  .subscription-payment-background {
    width: 300%;
  }
  .subscription-payment-background img {
    top: 5%;
  }
  p.in-progress {
    padding-top: 80px;
  }
}
@charset "UTF-8";
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow, .react-datepicker__navigation-icon::before {
  border-color: #ccc;
  border-style: solid;
  border-width: 3px 3px 0 0;
  content: "";
  display: block;
  height: 9px;
  position: absolute;
  top: 6px;
  width: 9px;
}

.react-datepicker-wrapper {
  display: inline-block;
  padding: 0;
  border: 0;
}

.react-datepicker {
  font-family: "Helvetica Neue", helvetica, arial, sans-serif;
  font-size: 0.8rem;
  background-color: #fff;
  color: #000;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  display: inline-block;
  position: relative;
  line-height: initial;
}

.react-datepicker--time-only .react-datepicker__time-container {
  border-left: 0;
}

.react-datepicker--time-only .react-datepicker__time,
.react-datepicker--time-only .react-datepicker__time-box {
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker-popper {
  z-index: 1;
  line-height: 0;
}

.react-datepicker-popper .react-datepicker__triangle {
  stroke: #aeaeae;
}

.react-datepicker-popper[data-placement^=bottom] .react-datepicker__triangle {
  fill: #f0f0f0;
  color: #f0f0f0;
}

.react-datepicker-popper[data-placement^=top] .react-datepicker__triangle {
  fill: #fff;
  color: #fff;
}

.react-datepicker__header {
  text-align: center;
  background-color: #f0f0f0;
  border-bottom: 1px solid #aeaeae;
  border-top-left-radius: 0.3rem;
  padding: 8px 0;
  position: relative;
}

.react-datepicker__header--time {
  padding-bottom: 8px;
  padding-left: 5px;
  padding-right: 5px;
}

.react-datepicker__header--time:not(.react-datepicker__header--time--only) {
  border-top-left-radius: 0;
}

.react-datepicker__header:not(.react-datepicker__header--has-time-select) {
  border-top-right-radius: 0.3rem;
}

.react-datepicker__year-dropdown-container--select,
.react-datepicker__month-dropdown-container--select,
.react-datepicker__month-year-dropdown-container--select,
.react-datepicker__year-dropdown-container--scroll,
.react-datepicker__month-dropdown-container--scroll,
.react-datepicker__month-year-dropdown-container--scroll {
  display: inline-block;
  margin: 0 15px;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
  margin-top: 0;
  color: #000;
  font-weight: bold;
  font-size: 0.944rem;
}

.react-datepicker-time__header {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.react-datepicker__navigation {
  align-items: center;
  background: none;
  display: flex;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  position: absolute;
  top: 2px;
  padding: 0;
  border: none;
  z-index: 1;
  height: 32px;
  width: 32px;
  text-indent: -999em;
  overflow: hidden;
}

.react-datepicker__navigation--previous {
  left: 2px;
}

.react-datepicker__navigation--next {
  right: 2px;
}

.react-datepicker__navigation--next--with-time:not(.react-datepicker__navigation--next--with-today-button) {
  right: 85px;
}

.react-datepicker__navigation--years {
  position: relative;
  top: 0;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.react-datepicker__navigation--years-previous {
  top: 4px;
}

.react-datepicker__navigation--years-upcoming {
  top: -4px;
}

.react-datepicker__navigation:hover *::before {
  border-color: #a6a6a6;
}

.react-datepicker__navigation-icon {
  position: relative;
  top: -1px;
  font-size: 20px;
  width: 0;
}

.react-datepicker__navigation-icon--next {
  left: -2px;
}

.react-datepicker__navigation-icon--next::before {
  transform: rotate(45deg);
  left: -7px;
}

.react-datepicker__navigation-icon--previous {
  right: -2px;
}

.react-datepicker__navigation-icon--previous::before {
  transform: rotate(225deg);
  right: -7px;
}

.react-datepicker__month-container {
  float: left;
}

.react-datepicker__year {
  margin: 0.4rem;
  text-align: center;
}

.react-datepicker__year-wrapper {
  display: flex;
  flex-wrap: wrap;
  max-width: 180px;
}

.react-datepicker__year .react-datepicker__year-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__month {
  margin: 0.4rem;
  text-align: center;
}

.react-datepicker__month .react-datepicker__month-text,
.react-datepicker__month .react-datepicker__quarter-text {
  display: inline-block;
  width: 4rem;
  margin: 2px;
}

.react-datepicker__input-time-container {
  clear: both;
  width: 100%;
  float: left;
  margin: 5px 0 10px 15px;
  text-align: left;
}

.react-datepicker__input-time-container .react-datepicker-time__caption {
  display: inline-block;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container {
  display: inline-block;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input {
  display: inline-block;
  margin-left: 10px;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input {
  width: auto;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-inner-spin-button,
.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__input input[type=time] {
  -moz-appearance: textfield;
}

.react-datepicker__input-time-container .react-datepicker-time__input-container .react-datepicker-time__delimiter {
  margin-left: 5px;
  display: inline-block;
}

.react-datepicker__time-container {
  float: right;
  border-left: 1px solid #aeaeae;
  width: 85px;
}

.react-datepicker__time-container--with-today-button {
  display: inline;
  border: 1px solid #aeaeae;
  border-radius: 0.3rem;
  position: absolute;
  right: -87px;
  top: 0;
}

.react-datepicker__time-container .react-datepicker__time {
  position: relative;
  background: white;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box {
  width: 85px;
  overflow-x: hidden;
  margin: 0 auto;
  text-align: center;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list {
  list-style: none;
  margin: 0;
  height: calc(195px + 0.85rem);
  overflow-y: scroll;
  padding-right: 0;
  padding-left: 0;
  width: 100%;
  box-sizing: content-box;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item {
  height: 30px;
  padding: 5px 10px;
  white-space: nowrap;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item:hover {
  cursor: pointer;
  background-color: #f0f0f0;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected {
  background-color: #216ba5;
  color: white;
  font-weight: bold;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--selected:hover {
  background-color: #216ba5;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled {
  color: #ccc;
}

.react-datepicker__time-container .react-datepicker__time .react-datepicker__time-box ul.react-datepicker__time-list li.react-datepicker__time-list-item--disabled:hover {
  cursor: default;
  background-color: transparent;
}

.react-datepicker__week-number {
  color: #ccc;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}

.react-datepicker__week-number.react-datepicker__week-number--clickable {
  cursor: pointer;
}

.react-datepicker__week-number.react-datepicker__week-number--clickable:not(.react-datepicker__week-number--selected,
.react-datepicker__week-number--keyboard-selected):hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}

.react-datepicker__week-number--selected {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}

.react-datepicker__week-number--selected:hover {
  background-color: #1d5d90;
}

.react-datepicker__week-number--keyboard-selected {
  border-radius: 0.3rem;
  background-color: #2a87d0;
  color: #fff;
}

.react-datepicker__week-number--keyboard-selected:hover {
  background-color: #1d5d90;
}

.react-datepicker__day-names {
  white-space: nowrap;
  margin-bottom: -8px;
}

.react-datepicker__week {
  white-space: nowrap;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
  color: #000;
  display: inline-block;
  width: 1.7rem;
  line-height: 1.7rem;
  text-align: center;
  margin: 0.166rem;
}

.react-datepicker__day,
.react-datepicker__month-text,
.react-datepicker__quarter-text,
.react-datepicker__year-text {
  cursor: pointer;
}

.react-datepicker__day:hover,
.react-datepicker__month-text:hover,
.react-datepicker__quarter-text:hover,
.react-datepicker__year-text:hover {
  border-radius: 0.3rem;
  background-color: #f0f0f0;
}

.react-datepicker__day--today,
.react-datepicker__month-text--today,
.react-datepicker__quarter-text--today,
.react-datepicker__year-text--today {
  font-weight: bold;
}

.react-datepicker__day--highlighted,
.react-datepicker__month-text--highlighted,
.react-datepicker__quarter-text--highlighted,
.react-datepicker__year-text--highlighted {
  border-radius: 0.3rem;
  background-color: #3dcc4a;
  color: #fff;
}

.react-datepicker__day--highlighted:hover,
.react-datepicker__month-text--highlighted:hover,
.react-datepicker__quarter-text--highlighted:hover,
.react-datepicker__year-text--highlighted:hover {
  background-color: #32be3f;
}

.react-datepicker__day--highlighted-custom-1,
.react-datepicker__month-text--highlighted-custom-1,
.react-datepicker__quarter-text--highlighted-custom-1,
.react-datepicker__year-text--highlighted-custom-1 {
  color: magenta;
}

.react-datepicker__day--highlighted-custom-2,
.react-datepicker__month-text--highlighted-custom-2,
.react-datepicker__quarter-text--highlighted-custom-2,
.react-datepicker__year-text--highlighted-custom-2 {
  color: green;
}

.react-datepicker__day--holidays,
.react-datepicker__month-text--holidays,
.react-datepicker__quarter-text--holidays,
.react-datepicker__year-text--holidays {
  position: relative;
  border-radius: 0.3rem;
  background-color: #ff6803;
  color: #fff;
}

.react-datepicker__day--holidays .overlay,
.react-datepicker__month-text--holidays .overlay,
.react-datepicker__quarter-text--holidays .overlay,
.react-datepicker__year-text--holidays .overlay {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s ease-in-out;
}

.react-datepicker__day--holidays:hover,
.react-datepicker__month-text--holidays:hover,
.react-datepicker__quarter-text--holidays:hover,
.react-datepicker__year-text--holidays:hover {
  background-color: #cf5300;
}

.react-datepicker__day--holidays:hover .overlay,
.react-datepicker__month-text--holidays:hover .overlay,
.react-datepicker__quarter-text--holidays:hover .overlay,
.react-datepicker__year-text--holidays:hover .overlay {
  visibility: visible;
  opacity: 1;
}

.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--selected,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--selected,
.react-datepicker__year-text--in-selecting-range,
.react-datepicker__year-text--in-range {
  border-radius: 0.3rem;
  background-color: #216ba5;
  color: #fff;
}

.react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover,
.react-datepicker__month-text--selected:hover,
.react-datepicker__month-text--in-selecting-range:hover,
.react-datepicker__month-text--in-range:hover,
.react-datepicker__quarter-text--selected:hover,
.react-datepicker__quarter-text--in-selecting-range:hover,
.react-datepicker__quarter-text--in-range:hover,
.react-datepicker__year-text--selected:hover,
.react-datepicker__year-text--in-selecting-range:hover,
.react-datepicker__year-text--in-range:hover {
  background-color: #1d5d90;
}

.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
  border-radius: 0.3rem;
  background-color: #bad9f1;
  color: rgb(0, 0, 0);
}

.react-datepicker__day--keyboard-selected:hover,
.react-datepicker__month-text--keyboard-selected:hover,
.react-datepicker__quarter-text--keyboard-selected:hover,
.react-datepicker__year-text--keyboard-selected:hover {
  background-color: #1d5d90;
}

.react-datepicker__day--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__month-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__quarter-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range),
.react-datepicker__year-text--in-selecting-range:not(.react-datepicker__day--in-range,
.react-datepicker__month-text--in-range,
.react-datepicker__quarter-text--in-range,
.react-datepicker__year-text--in-range) {
  background-color: rgba(33, 107, 165, 0.5);
}

.react-datepicker__month--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__day--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__month-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__quarter-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__month--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range),
.react-datepicker__year--selecting-range .react-datepicker__year-text--in-range:not(.react-datepicker__day--in-selecting-range,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__quarter-text--in-selecting-range,
.react-datepicker__year-text--in-selecting-range) {
  background-color: #f0f0f0;
  color: #000;
}

.react-datepicker__day--disabled,
.react-datepicker__month-text--disabled,
.react-datepicker__quarter-text--disabled,
.react-datepicker__year-text--disabled {
  cursor: default;
  color: #ccc;
}

.react-datepicker__day--disabled:hover,
.react-datepicker__month-text--disabled:hover,
.react-datepicker__quarter-text--disabled:hover,
.react-datepicker__year-text--disabled:hover {
  background-color: transparent;
}

.react-datepicker__day--disabled .overlay,
.react-datepicker__month-text--disabled .overlay,
.react-datepicker__quarter-text--disabled .overlay,
.react-datepicker__year-text--disabled .overlay {
  position: absolute;
  bottom: 70%;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333;
  color: #fff;
  padding: 4px;
  border-radius: 4px;
  white-space: nowrap;
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s, opacity 0.3s ease-in-out;
}

.react-datepicker__input-container {
  position: relative;
  display: inline-block;
  width: 100%;
}

.react-datepicker__input-container .react-datepicker__calendar-icon {
  position: absolute;
  padding: 0.5rem;
  box-sizing: content-box;
}

.react-datepicker__view-calendar-icon input {
  padding: 6px 10px 5px 25px;
}

.react-datepicker__year-read-view,
.react-datepicker__month-read-view,
.react-datepicker__month-year-read-view {
  border: 1px solid transparent;
  border-radius: 0.3rem;
  position: relative;
}

.react-datepicker__year-read-view:hover,
.react-datepicker__month-read-view:hover,
.react-datepicker__month-year-read-view:hover {
  cursor: pointer;
}

.react-datepicker__year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__year-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view:hover .react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-year-read-view:hover .react-datepicker__month-read-view--down-arrow {
  border-top-color: #b3b3b3;
}

.react-datepicker__year-read-view--down-arrow,
.react-datepicker__month-read-view--down-arrow,
.react-datepicker__month-year-read-view--down-arrow {
  transform: rotate(135deg);
  right: -16px;
  top: 0;
}

.react-datepicker__year-dropdown,
.react-datepicker__month-dropdown,
.react-datepicker__month-year-dropdown {
  background-color: #f0f0f0;
  position: absolute;
  width: 50%;
  left: 25%;
  top: 30px;
  z-index: 1;
  text-align: center;
  border-radius: 0.3rem;
  border: 1px solid #aeaeae;
}

.react-datepicker__year-dropdown:hover,
.react-datepicker__month-dropdown:hover,
.react-datepicker__month-year-dropdown:hover {
  cursor: pointer;
}

.react-datepicker__year-dropdown--scrollable,
.react-datepicker__month-dropdown--scrollable,
.react-datepicker__month-year-dropdown--scrollable {
  height: 150px;
  overflow-y: scroll;
}

.react-datepicker__year-option,
.react-datepicker__month-option,
.react-datepicker__month-year-option {
  line-height: 20px;
  width: 100%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.react-datepicker__year-option:first-of-type,
.react-datepicker__month-option:first-of-type,
.react-datepicker__month-year-option:first-of-type {
  border-top-left-radius: 0.3rem;
  border-top-right-radius: 0.3rem;
}

.react-datepicker__year-option:last-of-type,
.react-datepicker__month-option:last-of-type,
.react-datepicker__month-year-option:last-of-type {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border-bottom-left-radius: 0.3rem;
  border-bottom-right-radius: 0.3rem;
}

.react-datepicker__year-option:hover,
.react-datepicker__month-option:hover,
.react-datepicker__month-year-option:hover {
  background-color: #ccc;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-upcoming,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-upcoming {
  border-bottom-color: #b3b3b3;
}

.react-datepicker__year-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-option:hover .react-datepicker__navigation--years-previous,
.react-datepicker__month-year-option:hover .react-datepicker__navigation--years-previous {
  border-top-color: #b3b3b3;
}

.react-datepicker__year-option--selected,
.react-datepicker__month-option--selected,
.react-datepicker__month-year-option--selected {
  position: absolute;
  left: 15px;
}

.react-datepicker__close-icon {
  cursor: pointer;
  background-color: transparent;
  border: 0;
  outline: 0;
  padding: 0 6px 0 0;
  position: absolute;
  top: 0;
  right: 0;
  height: 100%;
  display: table-cell;
  vertical-align: middle;
}

.react-datepicker__close-icon::after {
  cursor: pointer;
  background-color: #216ba5;
  color: #fff;
  border-radius: 50%;
  height: 16px;
  width: 16px;
  padding: 2px;
  font-size: 12px;
  line-height: 1;
  text-align: center;
  display: table-cell;
  vertical-align: middle;
  content: "×";
}

.react-datepicker__close-icon--disabled {
  cursor: default;
}

.react-datepicker__close-icon--disabled::after {
  cursor: default;
  background-color: #ccc;
}

.react-datepicker__today-button {
  background: #f0f0f0;
  border-top: 1px solid #aeaeae;
  cursor: pointer;
  text-align: center;
  font-weight: bold;
  padding: 5px 0;
  clear: left;
}

.react-datepicker__portal {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.8);
  left: 0;
  top: 0;
  justify-content: center;
  align-items: center;
  display: flex;
  z-index: 2147483647;
}

.react-datepicker__portal .react-datepicker__day-name,
.react-datepicker__portal .react-datepicker__day,
.react-datepicker__portal .react-datepicker__time-name {
  width: 3rem;
  line-height: 3rem;
}

@media (max-width: 400px), (max-height: 550px) {
  .react-datepicker__portal .react-datepicker__day-name,
  .react-datepicker__portal .react-datepicker__day,
  .react-datepicker__portal .react-datepicker__time-name {
    width: 2rem;
    line-height: 2rem;
  }
}
.react-datepicker__portal .react-datepicker__current-month,
.react-datepicker__portal .react-datepicker-time__header {
  font-size: 1.44rem;
}

.react-datepicker__children-container {
  width: 13.8rem;
  margin: 0.4rem;
  padding-right: 0.2rem;
  padding-left: 0.2rem;
  height: auto;
}

.react-datepicker__aria-live {
  position: absolute;
  clip-path: circle(0);
  border: 0;
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  width: 1px;
  white-space: nowrap;
}

.react-datepicker__calendar-icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.125em;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.calender-container {
  position: relative;
}
.calender-container input[type=text] {
  width: 396px;
  box-sizing: border-box;
  height: 59px;
  background-color: #020005;
  border: 1px solid #564372;
  font-size: 16px;
  color: #a3a6c2;
  font-family: volte_medium;
  padding: 0 21px;
  letter-spacing: 3px;
  border-radius: 10px;
}
.calender-container input[type=text]::placeholder {
  letter-spacing: 0;
}
.calender-container .calender-label {
  text-align: left;
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 12px;
}
.calender-container .icon-block {
  z-index: 1;
  width: fit-content;
  display: inline-block;
  margin-top: 14px;
  position: absolute;
  right: 20px;
}
.calender-container .icon-block .icon-calender {
  cursor: pointer;
  font-size: 30px;
}
.calender-container .react-datepicker__portal {
  background: rgba(43, 45, 65, 0.9);
}
.calender-container .react-datepicker-popper {
  position: absolute;
  will-change: unset !important;
  top: 120px !important;
  left: 40% !important;
  transform: none !important;
}
.calender-container .react-datepicker-popper[data-placement^=bottom] {
  margin-top: 0;
}
.calender-container .react-datepicker {
  border: none;
  min-width: 252px;
  background-color: #020005;
  border-bottom: 1px solid #564372;
}
.calender-container .calender-top-block {
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  padding: 15px;
  margin-bottom: 14px;
  color: white;
  text-align: left;
  border-bottom: 1px solid #564372;
}
.calender-container .calender-top-block p:first-child {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  font-family: volte_medium;
  opacity: 0.7;
}
.calender-container .calender-top-block p:last-child {
  font-size: 31px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.03;
  letter-spacing: normal;
  color: #ffffff;
  font-family: volte_medium;
  margin-top: 8px;
}
.calender-container .react-datepicker__header {
  border-bottom: none;
  background-color: #020005;
}
.calender-container .react-datepicker__current-month, .calender-container .react-datepicker-time__header, .calender-container .react-datepicker-year-header {
  font-size: 14px !important;
  font-family: volte_reg;
  margin-bottom: 16px;
  color: #ffffff;
}
.calender-container .react-datepicker__month-container {
  width: 252px;
  min-height: 250px;
}
.calender-container .calender-custom-container {
  width: 252px;
  min-height: 432px;
  background-color: #020005;
}
.calender-container .calender-custom-container .button-block {
  top: 44px;
  position: relative;
  float: right;
  margin-right: 26px;
}
.calender-container .calender-custom-container .button-block span {
  font-family: volte_medium;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: 0.5px;
  text-align: center;
  color: #f3cbe3;
  cursor: pointer;
}
.calender-container .calender-custom-container .button-block span:first-child {
  margin-right: 34px;
}
.calender-container .react-datepicker__day-name {
  color: #ffffff;
}
.calender-container .react-datepicker__day:focus, .calender-container .react-datepicker__day:active, .calender-container .react-datepicker__time-name:focus, .calender-container .react-datepicker__time-name:active {
  outline: none;
}
.calender-container .react-datepicker__day--disabled, .calender-container .react-datepicker__month-text--disabled, .calender-container .react-datepicker__quarter-text--disabled, .calender-container .react-datepicker__year-text--disabled {
  color: #52547a;
}
.calender-container .react-datepicker__day--keyboard-selected {
  background-color: #e10092;
  color: white;
  border-radius: 50%;
}
.calender-container .react-datepicker__portal .react-datepicker__day-name, .calender-container .react-datepicker__portal .react-datepicker__day, .calender-container .react-datepicker__portal .react-datepicker__time-name {
  width: 32px;
  margin: 0;
  line-height: 32px;
  font-family: volte_reg;
  color: #ffffff;
}
.calender-container button.react-datepicker__navigation.react-datepicker__navigation--previous {
  border: solid black;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
  left: 28px;
}
.calender-container button.react-datepicker__navigation.react-datepicker__navigation--previous:focus, .calender-container button.react-datepicker__navigation.react-datepicker__navigation--previous:active {
  outline: none;
}
.calender-container button.react-datepicker__navigation.react-datepicker__navigation--previous:hover {
  border-right-color: #000000;
}
.calender-container button.react-datepicker__navigation.react-datepicker__navigation--next {
  border: solid #000000;
  border-width: 0 2px 2px 0;
  display: inline-block;
  padding: 3px;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  right: 28px;
}
.calender-container button.react-datepicker__navigation.react-datepicker__navigation--next:focus, .calender-container button.react-datepicker__navigation.react-datepicker__navigation--next:active {
  outline: none;
}
.calender-container .react-datepicker__month {
  margin: 0;
  text-align: center;
}
.calender-container .react-datepicker__day--selected {
  background-color: #52547a;
  color: #ffffff;
  border-radius: 50%;
}
.calender-container .react-datepicker__day--selected:hover {
  border: 1px solid #ffffff;
}
.calender-container .react-datepicker__day:hover {
  border-radius: 50%;
  background-color: #e10092;
}
.calender-container .react-datepicker__day {
  color: #ffffff;
}
.calender-container .previous-item {
  display: inline-block;
  width: 32px;
  margin: 0;
  line-height: 32px;
  font-family: volte_reg;
  color: #ffffff;
}

@media only screen and (max-width: 600px) {
  .calender-container {
    position: relative;
  }
  .calender-container input[type=text] {
    width: 324px;
  }
}
@font-face {
    font-family: 'sky_reg';
    src: url(/af80c018da3e3742f6bcf4ecfc329346.woff) format('truetype')
}

@font-face {
    font-family: 'sky_med';
    src: url(/615404d8063680e0cb68beb55c15c96a.woff) format('truetype')
}

@font-face {
    font-family: 'sky_bold';
    src: url(/4ca661b7a15d4a0ee744615d9f9ccf84.ttf) format('truetype')
}

@font-face {
    font-family: 'sky_italic';
    src: url(/31d6cfe0d16ae931b73c59d7e0c089c0.ttf) format('truetype');
}

@font-face {
    font-family: 'icomoon';
    src: url(/4525a954cbe5c383de67ff089ad00ee0.eot);
    src: url(/4525a954cbe5c383de67ff089ad00ee0.eot#iefix) format('embedded-opentype'),
    url(/8b4e5eb3579e711e238fb488b30abeee.ttf) format('truetype'),
    url(/9f791e831b25893236ce68e4ea963879.woff) format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}
@font-face {
    font-family: 'volte_medium';
    src: url(/40996ab8467a7691541ec7f325f410a2.woff) format('truetype')
}
@font-face {
    font-family: 'volte_reg';
    src: url(/571797379b832bca58eec4781df136b9.woff) format('truetype')
}
@font-face {
    font-family: 'volte_semiBold';
    src: url(/a62132926fc1ebc477281f42ed22c55f.ttf) format('truetype')
}
@font-face {
    font-family: 'volte_bold';
    src: url(/f7ec6201e9df24efcd0e3288cf196f14.woff) format('truetype')
}

html {
    scrollbar-color: #6b00dd #33345d;
    scrollbar-width: thin;
    cursor: pointer;
    height: 100%;
}

body {
    margin: 0;
}

.eula-base-container.main-container {
    margin-top: 0;
    padding: 0;
    min-height: 100vh;
    /* background-color: #1d1e30; */
    cursor: default;
    background-color: #020005;
    /* margin-bottom: 5em; */
}

.eula-container {
    color: #fff;
    padding: 15px 10px 50px 10px;
}

.eula-container.form-container .page-heading {
    margin-top: 25px;
}

.eula-container p.privacy-main-head {
    font-size: 16px;
    font-family: volte_medium;
    margin-bottom: 12px;
    text-align: center;
    text-decoration: underline;
}

.eula-container p.privacy-sub-head {
    font-size: 16px;
    font-family: volte_medium;
    margin-bottom: 12px;
}

.eula-container .eula-text {
    font-family: volte_reg;
    font-size: 14px;
    font-weight: normal;
    overflow-y: auto;
    padding-right: 20px;
    box-sizing: border-box;
    overflow-x: hidden;
    list-style-type: none;
}

.eula-container .eula-text p {
    line-height: 1.1;
}

.page-main-heading {
    font-family: volte_medium;
    font-size: 35px;
    font-weight: normal;
    line-height: 1.3;
    font-style: normal;
    font-stretch: normal;
    color: #fff;
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-thumb {
    background: #220046;
    border-radius: 50px;
}

::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px #220046;
    border-radius: 5px;
}

.eula-text .first_list li {
    margin: 12px 0 12px 0;
}

ol {
    padding-inline-start: 15px;
}

ol.first_list {
    padding-inline-start: 45px;
}

a {
    color: #e10092;
}

li.marker-size::marker {
    font-size: 16px;
}

ol {
    list-style-type: none;
    counter-reset: item;
    margin: 0;
    padding: 0;
}

ol > li {
    counter-increment: item;
    margin-bottom: 0.6em;
}
ol > li:before {
    display: table-cell;
    padding-right: 0.6em;
}
li ol > li {
    margin: 0;
}

.imp-tc {
    text-align: center;
}

.eula-list > li:before {
    content: '';
}

.eula-block {
    margin: 12px 0 12px 0;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px),
(min-device-width: 320px) and (max-device-width: 812px) and (orientation: landscape) {

    .form-container {
        padding: 1px 10px 50px 40px;
    }

    @-moz-document url-prefix() {
        .form-container {
            padding: 1px 10px 50px 25px;
        }
        ol.first_list {
            padding-inline-start: 17px;
        }
        ol {
            padding-inline-start: 0;
        }
    }
}

@media only screen and (max-width: 768px) {
    h2.page-main-heading {
        font-size: 30px;
    }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.eula-container {
  color: #ffffff;
  height: 100vh;
}
.eula-container iframe {
  width: 74%;
  height: 85%;
  margin-top: 2em;
  margin-left: 12%;
}
.eula-container.form-container {
  padding: 0;
  margin-top: 0;
}
@media only screen and (min-width: 446px) and (max-width: 768px) {
  .eula-container iframe {
    width: 85%;
    height: 80%;
  }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px), (min-device-width: 320px) and (max-device-width: 812px) and (orientation: landscape), (max-device-width: 892px) and (orientation: landscape) {
  .eula-container iframe {
    width: 100%;
    height: 100%;
    margin-left: 0px;
  }
  .eula-container .eula-text {
    width: auto;
    height: auto;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.my-subscription {
  margin-top: 4em;
}
.my-subscription.form-container {
  padding: 48px 6.9% 50px 6.9%;
}
.my-subscription.form-container .page-heading {
  margin-bottom: 40px;
}
.my-subscription.form-container .page-heading .page-main-heading {
  line-height: 1;
}
.my-subscription .back-block {
  background: #1d1e30;
  height: 20px;
}
.my-subscription .back-block i.icon-back-2 {
  position: relative;
  top: 20px;
  left: 16px;
  height: fit-content;
  margin-bottom: 10px;
  font-size: 16px;
}
.my-subscription .free-trial-info {
  margin-bottom: 45px;
}
.my-subscription.combo-subscription .combo-pack-header {
  margin: 20px 18px 10px 18px;
}
.my-subscription.combo-subscription .combo-pack-header .my-subscription-header-left h5 {
  font-size: 18px;
  line-height: 22px;
  margin-bottom: 10px;
  width: 70%;
}

.my-subscription-top,
.my-subscription-bottom {
  width: 475px;
  background-color: #2b2d41;
  margin-bottom: 6px !important;
  padding: 20px 20px;
  position: relative;
}
@media only screen and (min-width: 320px) and (max-width: 550px) {
  .my-subscription-top,
  .my-subscription-bottom {
    width: 100%;
  }
}
.my-subscription-top .app-count,
.my-subscription-bottom .app-count {
  font-size: 18px;
  line-height: 22px;
  color: #ffffff;
  margin-bottom: 10px;
}
.my-subscription-top .cancelled,
.my-subscription-bottom .cancelled {
  position: absolute;
  display: block;
  width: 100%;
  left: 0;
  top: -8px;
  text-align: center;
}
.my-subscription-top .cancelled span,
.my-subscription-bottom .cancelled span {
  background-color: #e5007d;
  font-family: sky_med;
  font-size: 16px;
  padding: 3px 26px;
  border-radius: 3px;
  color: #ffffff;
}
.my-subscription-top .subscription-app-list,
.my-subscription-bottom .subscription-app-list {
  margin-bottom: 9px;
}
.my-subscription-top img,
.my-subscription-bottom img {
  width: 82px;
  height: 52px;
  margin-right: 5px;
}
.my-subscription-top .subscription-availed,
.my-subscription-bottom .subscription-availed {
  color: #bec1d9;
  font-size: 15px;
  font-family: sky_med;
  line-height: 1.33;
}
.my-subscription-top .partner-desc,
.my-subscription-bottom .partner-desc {
  color: #ffffff;
  font-size: 13px;
  font-family: sky_reg;
  line-height: 1.14;
  margin-bottom: 10px;
}
.my-subscription-top button.btn,
.my-subscription-bottom button.btn {
  padding: 13px 18px;
  margin-top: 10px;
  margin-bottom: 0;
}
.my-subscription-top button.btn.modify-resume-link,
.my-subscription-bottom button.btn.modify-resume-link {
  padding: 0;
  margin-top: 8px;
  font-size: 16px;
  color: #5087c7;
  background: none;
  border: none;
  text-align: left;
  text-decoration: underline;
}

.my-subscription-header {
  display: flex;
  flex-direction: row;
  font-family: sky_med;
  color: #ffffff;
  margin-bottom: 30px;
}

.my-subscription-bottom {
  /*width: 475px;*/
  background-color: #2b2d41;
  padding: 20px 20px;
  margin-bottom: 30px;
}

.my-subscription-bottom-cancelled {
  margin-top: 20px;
}
.my-subscription-bottom-cancelled .cancelled {
  top: -6px;
}

.my-subscription-header-left {
  flex: 1;
}

.my-subscription-header-right {
  font-size: 20px;
  align-items: flex-end;
  color: #ffffff;
  display: inline-block;
  font-family: sky_med;
  padding-left: 5px;
}
.my-subscription-header-right .pack-price span {
  display: inline;
}
.my-subscription-header-right span.proRataAmount {
  display: block;
  font-family: sky_reg;
  font-size: 14px;
  margin-top: 5px;
}
.my-subscription-header-right i {
  margin-left: 12px;
  position: relative;
  top: 2px;
  font-size: 16px;
}

.subscription-info {
  color: #ffffff;
  font-size: 15px;
  font-family: sky_reg;
}

.my-subscription h5, .no-subscription h5 {
  font-size: 20px;
  margin-bottom: 5px;
  font-family: sky_med;
  line-height: 1;
}
.my-subscription .subscription-info, .no-subscription .subscription-info {
  color: #ffffff;
  font-size: 15px;
  font-family: sky_reg;
}
.my-subscription p, .no-subscription p {
  color: #a3a6c2;
  font-size: 15px;
  line-height: 1.33;
  font-family: sky_med;
  /*&.subscription-availed {
    font-family: sky_med;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #B6B9D2;
    padding: 17px 40px 0 40px;
  }*/
}
.my-subscription p.expired, .no-subscription p.expired {
  color: #e56c6c;
}
.my-subscription a, .no-subscription a {
  margin: 20px 0;
  display: block;
  color: #5087c7;
  font-family: sky_med;
}
.my-subscription .btn, .no-subscription .btn {
  padding: 13px 32px;
}
.my-subscription .btn span, .no-subscription .btn span {
  font-family: sky_med;
}
.my-subscription .cancel-block, .no-subscription .cancel-block {
  margin-top: 30px;
}
.my-subscription .cancel-block span.cancel-subscription-link, .no-subscription .cancel-block span.cancel-subscription-link {
  color: #5087c7;
  font-size: 16px;
  font-family: sky_med, serif;
  margin-bottom: 20px;
  text-decoration: underline;
  cursor: pointer;
}
.my-subscription .cancel-block span.cancel-subscription-link.for-web, .no-subscription .cancel-block span.cancel-subscription-link.for-web {
  width: fit-content;
}
.my-subscription .cancel-block span.cancel-subscription-link:focus, .my-subscription .cancel-block span.cancel-subscription-link:active, .no-subscription .cancel-block span.cancel-subscription-link:focus, .no-subscription .cancel-block span.cancel-subscription-link:active {
  -webkit-tap-highlight-color: transparent;
  -moz-tap-highlight-color: transparent;
  -o-tap-highlight-color: transparent;
}

.for-web {
  display: block;
}

.for-mobile {
  display: none;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px), (min-device-width: 320px) and (max-device-width: 812px) and (orientation: landscape), (max-device-width: 892px) and (orientation: landscape) {
  /* .my-subscription-top{
     width: 100% !important;
   }*/
  .de-active-subscription {
    text-align: center;
  }
  .cancel-success .get-icon-success-tick {
    width: 49px;
    border-radius: 100%;
    height: 49px;
    margin: auto;
    display: block;
  }
  .cancel-success .get-icon-success-tick i:before {
    top: -5px !important;
    font-size: 31px !important;
  }
  .cancel-success .icon-check {
    font-size: 22px !important;
  }
  .cancel-success .icon-check:before {
    top: 1px;
    left: 1px;
  }
  .cancel-alert .popupOuter .popupSec {
    height: 322px;
  }
  .cancel-alert .popupOuter .popupSec .modal-body h1 {
    margin-bottom: 20px;
  }
  .cancel-alert .popupOuter .popupSec .modal-body .btn-group {
    margin: 0 !important;
  }
  .cancel-alert .popupOuter .popupSec .modal-body .btn-group .btn {
    margin: 0 auto 15px;
  }
  .cancel-alert .popupOuter .popupSec .modal-body .instructions-text {
    margin: -9px 0 18px 0 !important;
  }
  .for-web {
    display: none;
  }
  .for-mobile {
    display: block;
  }
  .my-subscription, .no-subscription {
    width: 100%;
    display: block;
    overflow: auto;
  }
  .my-subscription.combo-subscription .page-heading, .no-subscription.combo-subscription .page-heading {
    margin-bottom: 12px;
  }
  .my-subscription.combo-subscription .page-heading .page-main-heading, .no-subscription.combo-subscription .page-heading .page-main-heading {
    font-size: 28px;
    text-align: center;
    margin-top: 18px;
    font-style: normal;
    font-weight: normal;
    line-height: 32px;
  }
  .my-subscription.combo-subscription .sub-header, .no-subscription.combo-subscription .sub-header {
    font-size: 17px;
    line-height: 20px;
    text-align: center;
    color: #B6B9D2;
    padding: 0 18px;
  }
  .my-subscription.combo-subscription .combo-pack-header .my-subscription-header-right, .no-subscription.combo-subscription .combo-pack-header .my-subscription-header-right {
    font-size: 18px;
    line-height: 21px;
  }
  .my-subscription.combo-subscription .combo-pack-header .my-subscription-header-right .pack-price .price, .no-subscription.combo-subscription .combo-pack-header .my-subscription-header-right .pack-price .price {
    padding-left: 5px;
  }
  .my-subscription.combo-subscription .combo-pack-header .my-subscription-header-left p, .no-subscription.combo-subscription .combo-pack-header .my-subscription-header-left p {
    font-size: 14px;
    line-height: 16px;
    color: #B6B9D2;
  }
  .my-subscription.combo-subscription .combo-pack-header .my-subscription-header-left p.expired, .no-subscription.combo-subscription .combo-pack-header .my-subscription-header-left p.expired {
    color: #e56c6c;
  }
  .my-subscription.combo-subscription .combo-desc-block, .no-subscription.combo-subscription .combo-desc-block {
    text-align: center;
    padding: 14px 10px 10px 14px;
  }
  .my-subscription.combo-subscription .combo-separator, .no-subscription.combo-subscription .combo-separator {
    color: #ffffff;
    text-align: center;
    margin: 10px 0 11px 0;
    font-size: 32px;
  }
  .my-subscription.combo-subscription .combo-block, .no-subscription.combo-subscription .combo-block {
    background: #2B2D41;
    border-radius: 4px;
    flex: none;
    order: 4;
    flex-grow: 0;
    margin: 0 18px 0 18px;
    padding: 15px;
  }
  .my-subscription.combo-subscription .combo-block .combo-channel-block, .no-subscription.combo-subscription .combo-block .combo-channel-block {
    display: flex;
    flex-direction: row;
  }
  .my-subscription.combo-subscription .combo-block .combo-channel-block .combo-ott-channels, .no-subscription.combo-subscription .combo-block .combo-channel-block .combo-ott-channels {
    display: flex;
    align-items: center;
    text-align: right;
    color: #FFFFFF;
    margin-right: 50px;
  }
  .my-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info:first-child, .no-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info:first-child {
    margin-right: 13px;
  }
  .my-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info .type, .no-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info .type {
    margin-right: 6px;
    border-radius: 2px;
    font-size: 14px;
    line-height: 16px;
    color: #A3A6C2;
    border: 1px solid #A3A6C2;
    padding: 3px 7px;
  }
  .my-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info .type.hd-channel, .no-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info .type.hd-channel {
    color: red;
    border: 1px solid red;
  }
  .my-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info .count, .no-subscription.combo-subscription .combo-block .combo-channel-block .combo-channels .channel-info .count {
    font-size: 14px;
    line-height: 16px;
    color: #FFFFFF;
  }
  .my-subscription.combo-subscription .combo-block .combo-text, .no-subscription.combo-subscription .combo-block .combo-text {
    font-size: 12px;
    line-height: 16px;
    display: flex;
    align-items: center;
    color: #B6B9D2;
    margin-top: 8px;
  }
  .my-subscription .no-subscription-para, .no-subscription .no-subscription-para {
    text-align: center;
    margin: 0 46px;
  }
  .my-subscription .proceed-block, .no-subscription .proceed-block {
    width: 100%;
    position: absolute;
    bottom: 0;
  }
  .my-subscription .proceed-block button, .no-subscription .proceed-block button {
    width: 90%;
    margin-left: 20px;
  }
  .my-subscription .proceed-block a, .no-subscription .proceed-block a {
    text-decoration: underline;
  }
  .my-subscription .cancel-block, .no-subscription .cancel-block {
    margin-top: 0;
  }
  .my-subscription .cancel-block div, .no-subscription .cancel-block div {
    margin-top: 15px;
    text-align: center;
  }
  .my-subscription .cancel-block.combo-cancel-block, .no-subscription .cancel-block.combo-cancel-block {
    background: #33354D;
    margin-top: 30px;
    mix-blend-mode: normal;
    box-shadow: 0px -5px 10px rgba(0, 0, 0, 0.25);
  }
  .my-subscription .cancel-block.combo-cancel-block button, .no-subscription .cancel-block.combo-cancel-block button {
    margin: 20px 18px;
  }
  .my-subscription .web-small-logo, .no-subscription .web-small-logo {
    display: block;
    text-align: center;
  }
  .my-subscription .web-small-logo img, .no-subscription .web-small-logo img {
    margin-top: 20px;
  }
  .my-subscription.form-container, .no-subscription.form-container {
    margin-top: 0;
    padding: 0;
  }
  .my-subscription .my-subscription-top, .my-subscription .my-subscription-bottom, .no-subscription .my-subscription-top, .no-subscription .my-subscription-bottom {
    width: auto;
    height: 100%;
    padding: 18px 22px 18px 22px;
    margin: 0 18px 0 18px;
  }
  .my-subscription .my-subscription-top.paid-pack, .my-subscription .my-subscription-bottom.paid-pack, .no-subscription .my-subscription-top.paid-pack, .no-subscription .my-subscription-bottom.paid-pack {
    padding: 14px 10px 10px 14px;
  }
  .my-subscription .my-subscription-top.paid-pack .subscription-app-list, .my-subscription .my-subscription-bottom.paid-pack .subscription-app-list, .no-subscription .my-subscription-top.paid-pack .subscription-app-list, .no-subscription .my-subscription-bottom.paid-pack .subscription-app-list {
    margin-bottom: 5px;
  }
  .my-subscription .my-subscription-top.paid-pack img, .my-subscription .my-subscription-bottom.paid-pack img, .no-subscription .my-subscription-top.paid-pack img, .no-subscription .my-subscription-bottom.paid-pack img {
    width: 70px;
    height: 44px;
  }
  .my-subscription .my-subscription-top.paid-pack .partner-desc, .my-subscription .my-subscription-bottom.paid-pack .partner-desc, .no-subscription .my-subscription-top.paid-pack .partner-desc, .no-subscription .my-subscription-bottom.paid-pack .partner-desc {
    font-size: 12px;
    line-height: 16px;
    display: flex;
    align-items: center;
    color: #B6B9D2;
    font-family: sky_reg;
    margin-bottom: 0;
  }
  .my-subscription .my-subscription-top.lower-pack, .my-subscription .my-subscription-bottom.lower-pack, .no-subscription .my-subscription-top.lower-pack, .no-subscription .my-subscription-bottom.lower-pack {
    padding: 14px 10px 10px 11px;
  }
  .my-subscription .my-subscription-top.lower-pack img, .my-subscription .my-subscription-bottom.lower-pack img, .no-subscription .my-subscription-top.lower-pack img, .no-subscription .my-subscription-bottom.lower-pack img {
    width: 96px;
    height: 60px;
  }
  .my-subscription .my-subscription-top .my-subscription-header, .my-subscription .my-subscription-bottom .my-subscription-header, .no-subscription .my-subscription-top .my-subscription-header, .no-subscription .my-subscription-bottom .my-subscription-header {
    margin-bottom: 15px;
  }
  .my-subscription .my-subscription-top .my-subscription-header .my-subscription-header-left h5, .my-subscription .my-subscription-bottom .my-subscription-header .my-subscription-header-left h5, .no-subscription .my-subscription-top .my-subscription-header .my-subscription-header-left h5, .no-subscription .my-subscription-bottom .my-subscription-header .my-subscription-header-left h5 {
    font-size: 18px;
    margin-top: -2px;
  }
  .my-subscription .my-subscription-top .my-subscription-header .my-subscription-header-left p, .my-subscription .my-subscription-bottom .my-subscription-header .my-subscription-header-left p, .no-subscription .my-subscription-top .my-subscription-header .my-subscription-header-left p, .no-subscription .my-subscription-bottom .my-subscription-header .my-subscription-header-left p {
    font-size: 14px;
  }
  .my-subscription .my-subscription-top .my-subscription-header .my-subscription-header-right, .my-subscription .my-subscription-bottom .my-subscription-header .my-subscription-header-right, .no-subscription .my-subscription-top .my-subscription-header .my-subscription-header-right, .no-subscription .my-subscription-bottom .my-subscription-header .my-subscription-header-right {
    font-size: 16px;
  }
  .my-subscription .my-subscription-top .subscription-app-list, .my-subscription .my-subscription-bottom .subscription-app-list, .no-subscription .my-subscription-top .subscription-app-list, .no-subscription .my-subscription-bottom .subscription-app-list {
    margin-bottom: 11px;
  }
  .my-subscription .my-subscription-top img, .my-subscription .my-subscription-bottom img, .no-subscription .my-subscription-top img, .no-subscription .my-subscription-bottom img {
    width: 65px;
    height: 41px;
  }
  .my-subscription .my-subscription-top .subscription-availed, .my-subscription .my-subscription-bottom .subscription-availed, .no-subscription .my-subscription-top .subscription-availed, .no-subscription .my-subscription-bottom .subscription-availed {
    font-size: 14px;
  }
  .my-subscription .my-subscription-top button.btn, .my-subscription .my-subscription-bottom button.btn, .no-subscription .my-subscription-top button.btn, .no-subscription .my-subscription-bottom button.btn {
    padding: 0;
    margin-top: 8px;
    font-size: 16px;
    color: #5087c7;
    background: none;
    border: none;
    text-align: left;
    text-decoration: underline;
  }
  .my-subscription .page-heading, .no-subscription .page-heading {
    margin-bottom: 20px;
  }
  .my-subscription .page-heading .page-main-heading, .no-subscription .page-heading .page-main-heading {
    font-size: 28px;
    text-align: center;
    margin-top: 5px;
  }
  .my-subscription .subscription-info, .no-subscription .subscription-info {
    color: #dddfef;
    font-size: 14px;
    line-height: 1.14;
    font-family: sky_reg;
    padding: 27px 40px 0 40px;
    text-align: center;
  }
  .my-subscription a, .no-subscription a {
    text-align: center;
  }
  .my-subscription .cancel-block, .no-subscription .cancel-block {
    display: flex;
    flex-direction: column-reverse;
  }
  .my-subscription .cancel-block .btn, .no-subscription .cancel-block .btn {
    width: 88%;
    margin: 30px 0px 10px 20px;
  }
  .my-subscription .my-subscription-bottom img {
    margin-bottom: 6px;
  }
}
@media only screen and (min-device-width: 320px) and (max-device-width: 812px) and (orientation: landscape), (max-device-width: 892px) and (orientation: landscape) {
  .de-active-subscription {
    margin: 0 90px;
  }
  .my-subscription .my-subscription-top, .my-subscription .my-subscription-bottom {
    margin: 0 90px;
  }
  .my-subscription .cancel-block {
    margin-top: 0;
  }
  .my-subscription .cancel-block .btn {
    width: 70%;
    margin: 20px auto 10px auto;
  }
  .my-subscription .cancel-block div {
    margin-top: 15px;
    text-align: center;
  }
  .cancel-success .get-icon-success-tick {
    width: 42px;
    border-radius: 100%;
    height: 42px;
    margin: auto;
    display: block;
  }
  .cancel-success .icon-check {
    font-size: 22px !important;
  }
  .cancel-success .icon-check:before {
    top: 8px;
    left: 1px;
  }
  .cancel-alert .popupOuter .popupSec {
    height: 322px;
  }
}
@media only screen and (min-device-width: 360px) and (max-device-width: 370px) {
  .my-subscription .my-subscription-top {
    padding: 18px 4px 18px 10px;
  }
  .my-subscription .my-subscription-top.paid-pack {
    padding: 14px 10px 10px 14px;
  }
  .my-subscription .my-subscription-top.lower-pack {
    padding: 14px 10px 10px 11px;
  }
  .my-subscription .my-subscription-top .my-subscription-header .my-subscription-header-right {
    padding-right: 10px;
  }
}
@media only screen and (min-device-width: 370px) and (max-device-width: 380px) {
  .my-subscription .my-subscription-top {
    padding: 18px 4px 18px 18px;
  }
  .my-subscription .my-subscription-top.paid-pack {
    padding: 14px 10px 10px 14px;
  }
  .my-subscription .my-subscription-top.lower-pack {
    padding: 14px 10px 10px 11px;
  }
  .my-subscription .my-subscription-top .my-subscription-header .my-subscription-header-right {
    padding-right: 16px;
  }
}
@media only screen and (min-device-width: 410px) and (max-device-width: 420px) {
  .my-subscription .my-subscription-top {
    padding: 18px 22px 18px 22px;
  }
  .my-subscription .my-subscription-top.paid-pack {
    padding: 14px 10px 10px 14px;
  }
  .my-subscription .my-subscription-top.lower-pack {
    padding: 14px 10px 10px 11px;
  }
}
@media only screen and (min-device-width: 375px) and (min-device-height: 670px) {
  .my-subscription {
    position: relative;
    min-height: 100vh;
  }
  .my-subscription .cancel-block {
    position: absolute;
    width: 100%;
  }
}
.cancel-alert .icon-remove-phon, .cancel-alert .icon-my-subscription-1, .resume-alert .icon-remove-phon, .resume-alert .icon-my-subscription-1 {
  font-size: 82px;
}
.cancel-alert h1, .resume-alert h1 {
  font-family: sky_med;
  font-size: 35px;
}
.cancel-alert .secondary-btn, .resume-alert .secondary-btn {
  background-color: transparent;
  background-image: none;
  color: #f3cbe3;
  border: transparent;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.binge-subscriber-screen.for-web {
  padding: 0 7%;
  margin-top: 5em;
}
.binge-subscriber-screen.for-web .binge-account-listing-container {
  width: 60%;
  margin: auto;
}
.binge-subscriber-screen.for-web .without-blue-text {
  text-align: center;
}
.binge-subscriber-screen.for-web .btn.primary-btn {
  width: 50%;
  margin-top: 40px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.my-subscription.form-container.upgrade-free-trial-container .page-main-heading {
  font-size: 22px;
  margin-top: 5%;
}
.my-subscription.form-container.upgrade-free-trial-container .provider-container {
  padding: 0 20px;
}
.my-subscription.form-container.upgrade-free-trial-container .provider-container .plus {
  text-align: center;
  color: #ffffff;
  font-size: 36px;
  margin: 10px 0;
}
.my-subscription.form-container.upgrade-free-trial-container .provider-container ul {
  padding: 5% 5%;
  background: #2B2E41;
  border-radius: 5px;
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  row-gap: 8px;
}
.my-subscription.form-container.upgrade-free-trial-container .provider-container ul.app-listing.upgraded-provider img:nth-child(3n+2) {
  margin: 0 14px;
}
.my-subscription.form-container.upgrade-free-trial-container .provider-container ul.app-listing.upgraded-provider img:nth-child(2) {
  margin-right: 0;
}
.my-subscription.form-container.upgrade-free-trial-container .provider-container ul.app-listing.base-provider img:nth-child(3n+2) {
  margin: 0 8px;
}
.my-subscription.form-container.upgrade-free-trial-container .expiry-text {
  margin-top: 20px;
}
.my-subscription.form-container.upgrade-free-trial-container .plan-message {
  margin-top: 30px;
}
.my-subscription.form-container.upgrade-free-trial-container p {
  font-family: sky_reg;
  color: #b6b9d2;
  font-size: 17px;
  line-height: 20px;
  text-align: center;
  padding: 0 20px;
}
.my-subscription.form-container.upgrade-free-trial-container .select-plan {
  background: #33354D;
  mix-blend-mode: normal;
  box-shadow: 0px -5px 10px rgba(0, 0, 0, 0.25);
  margin-top: 26px;
  font-family: sky_reg;
  position: sticky;
  bottom: 0;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 330px) {
  .my-subscription.form-container.upgrade-free-trial-container .provider-container {
    padding: 0 5px;
  }
  .my-subscription.form-container.upgrade-free-trial-container .provider-container ul {
    padding: 6.5px;
    row-gap: 6px;
  }
  .my-subscription.form-container.upgrade-free-trial-container .provider-container ul.app-listing.upgraded-provider img:nth-child(3n+2) {
    margin: 0 8px;
  }
  .my-subscription.form-container.upgrade-free-trial-container .provider-container ul.app-listing.upgraded-provider img:nth-child(2) {
    margin-right: 0;
  }
  .my-subscription.form-container.upgrade-free-trial-container .provider-container ul.app-listing.base-provider img:nth-child(3n+2) {
    margin: 0 6px;
  }
}
@media only screen and (min-device-width: 360px) {
  .my-subscription.form-container.upgrade-free-trial-container .provider-container {
    padding: 0 14px;
  }
  .my-subscription.form-container.upgrade-free-trial-container .provider-container ul {
    padding: 14px;
  }
}
@media only screen and (min-device-width: 375px) {
  .my-subscription.form-container.upgrade-free-trial-container .provider-container {
    padding: 0 5%;
  }
}
@media only screen and (min-device-width: 400px) {
  .my-subscription.form-container.upgrade-free-trial-container .provider-container {
    padding: 0 9%;
  }
}

.upgrade-success-container {
  display: flex;
  flex-direction: row;
  font-family: sky_reg;
  font-weight: 400;
}
.upgrade-success-container .upgrade-success-image {
  font-size: 16px;
  margin-top: 10px;
}
.upgrade-success-container .upgrade-success-text {
  font-size: 14px;
  margin-left: 14px;
}
.upgrade-success-container .upgrade-success-text div:nth-child(2) {
  color: #a3a6c2;
  margin-top: 2px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.preferred-content-language {
  width: 100%;
  flex: 1 0 0;
  margin-top: 3.5em;
}
.preferred-content-language .content-header {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 26px;
  line-height: 120%;
  display: flex;
  align-items: center;
  color: #ffffff;
  margin-bottom: 20px;
}
.preferred-content-language .content-subtitle {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  color: #D6C6F4;
  line-height: 120%;
}
.preferred-content-language .languageId-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
}
.preferred-content-language .languageId-innercontainer {
  position: relative;
  width: 200px;
  height: 52px;
  display: flex;
  border-radius: 5px;
  cursor: pointer;
  margin-top: 20px;
  margin-right: 20px;
}
@media (max-width: 768px) {
  .preferred-content-language {
    margin-top: 0;
  }
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .preferred-content-language .content-header {
    font-size: 19px;
    margin-bottom: 23px;
  }
  .preferred-content-language .content-subtitle {
    font-size: 16px;
    line-height: 120%;
    margin-bottom: 6px;
  }
  .preferred-content-language .selection-container {
    margin-top: -2px;
    padding: 0;
  }
  .preferred-content-language .languageId-innercontainer {
    width: 154px;
    height: 52px;
    display: flex;
    border-radius: 6px;
    cursor: pointer;
    margin-top: 12px;
    margin-right: 12px;
  }
  .preferred-content-language .save-prefernces-button {
    width: 100%;
    height: 45px;
    cursor: pointer;
    z-index: 1000;
    position: relative;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
  }
  .preferred-content-language .languageId-container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
  }
}
@media only screen and (min-width: 320px) and (max-width: 370px) {
  .preferred-content-language .languageId-innercontainer {
    margin-right: 0px;
  }
  .preferred-content-language .languageId-container {
    width: 320px;
    justify-content: space-between;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.profile-container {
  font-family: volte_reg;
}
.profile-container .profile-wrapper {
  margin-top: 3.5em;
  max-width: 420px;
}
.profile-container .profile-wrapper .content-header {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 400;
  font-size: 26px;
  line-height: 120%;
  display: flex;
  align-items: center;
  color: #FFFFFF;
}
.profile-container .mobile-wrapper p:nth-child(1) {
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 110%;
  font-family: volte_medium;
  /* or 15px */
  /* Light Blue ( Icon ) */
  color: #A3A6C2;
}
.profile-container .mobile-wrapper p:nth-child(2) {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  display: flex;
  align-items: center;
  height: 24px;
  /* White */
  color: #FFFFFF;
}
.profile-container .btn-wrapper {
  display: flex;
  justify-content: center;
  width: 100%;
}
.profile-container .btn-wrapper .next {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  border-radius: 22px;
  position: static;
  width: 199px;
  height: 37px;
  margin-top: 35px;
  outline: none;
  font-size: 16px;
  line-height: 120%;
  font-family: "volte_semiBold";
}
.profile-container .next[disabled] {
  background: #8e81a1;
  color: #ffffff;
  cursor: not-allowed !important;
  border: solid 1px #8e81a1;
}
.profile-container .next[disabled]:hover {
  box-shadow: none;
}
.profile-container .input-container {
  margin: 15px 0;
}
.profile-container .input-container .name {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  color: #FFFFFF;
}
.profile-container .input-container label {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  color: #FFFFFF;
}
.profile-container .input-container ::placeholder {
  color: #8e81a1;
}
.profile-container .input-container input {
  height: 44px;
  font-size: 16px;
  line-height: 24px;
  width: 100%;
  font-family: volte_reg;
  background: none;
  mix-blend-mode: normal;
  border: 1px solid #564372;
  box-sizing: border-box;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  outline: none;
  color: #FFFFFF;
  padding: 10px;
  margin-top: 6px;
}
.profile-container h1 {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  /* or 31px */
  display: flex;
  align-items: center;
  color: #FFFFFF;
}
.profile-container .profile-img-section {
  min-height: 90px;
  display: flex;
  justify-content: center;
  margin-bottom: 18px;
}
.profile-container .profile-img-section .profile-hover {
  color: #ffffff;
  border: 2px solid #e10092;
  font-family: volte_medium;
  border-radius: 5px;
  z-index: 10;
  padding: 5px;
  background-color: #e10092;
  position: absolute;
  top: 33%;
}
.profile-container .profile-img-section .gradient-active {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  background: red;
  border-radius: 50%;
  text-align: center;
  background: linear-gradient(to right, #f08300, #e3000f 43%, #a72879 101%);
}
.profile-container .profile-img-section .gradient-active img {
  width: 94px !important;
  height: 94px !important;
  padding: 2.86px;
  object-fit: cover;
  background-color: #1d1e30;
}
.profile-container .profile-img-section .profile-img {
  margin: 20px 0 0 0;
  position: relative;
}
.profile-container .profile-img-section .profile-img img {
  border-radius: 50%;
  width: 100px;
  height: 100px;
}
.profile-container .profile-img-section .profile-img img.unknown-user {
  background: none;
}
.profile-container .profile-img-section .profile-img-icon {
  position: absolute;
  right: -3px;
  bottom: 0;
  /* top: 86px; */
  font-size: 28px;
}
.profile-container .profile-img-section .profile-img-icon.with-avatar {
  bottom: 0;
  top: 86px;
}
.profile-container .profile-img-section .profile-img-icon .icon-camera {
  cursor: pointer;
  font-size: 24px;
}
.profile-container .profile-img-section .profile-img-icon .icon-camera .path1::before {
  color: #e10092;
}
.profile-container .profile-img-section .avatar-image.sb-avatar__text {
  width: 100px;
  height: 100px;
  margin: 25px 0 35px 0;
  display: inline-block;
}
.profile-container .profile-img-section .avatar-image.sb-avatar.sb-avatar--text {
  position: relative;
  top: -15px;
  display: inline-block;
  cursor: default;
}
.profile-container .profile-img-section .avatar-image.sb-avatar.sb-avatar--text div {
  font-size: 70px;
  position: relative;
  top: 15px;
}
.profile-container .profile-img-section input[type=file] {
  display: none;
}
.profile-container .profile-img-section .avatar-block {
  width: 100px;
  height: 100px;
  background: linear-gradient(to right, #f08300, #e3000f 43%, #a72879 101%);
  display: flex;
  align-items: center;
  border-radius: 50%;
  text-align: center;
  color: #ffffff;
}
.profile-container .profile-img-section .avatar-block p {
  width: inherit;
  position: relative;
  text-align: center;
  margin: auto;
  font-size: 70px;
  font-weight: bold;
}
.profile-container .head {
  color: #979ab5;
  font-size: 14px;
}
.profile-container .profile-detail {
  color: #ffffff;
  font-size: 20px;
  max-width: 220px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.profile-container .profile-detail span {
  color: #488bda;
  font-size: 16px;
  position: relative;
  top: 2px;
}
.profile-container table {
  width: 300px;
}
.profile-container table td {
  padding: 6px 0;
}
.profile-container table td span {
  cursor: pointer;
  margin-left: 30px;
  float: right;
  color: #4a90e2;
}
.profile-container table td span i {
  color: #488bda;
  font-size: 14px;
  position: relative;
  right: 4px;
}

.account-detail-page {
  width: 500px;
  margin: 0 auto; /* Centers horizontally */
  padding-bottom: 30px;
}

.profile-update-modal.alert-modal .popupSec {
  width: 554px;
  height: 497px;
  border-radius: 4px;
  box-shadow: 0 2px 30px 0 rgba(0, 0, 0, 0.3);
  background-color: #1d1e30;
}
.profile-update-modal.alert-modal .popupSec .modal-body {
  padding: 0;
}
.profile-update-modal.alert-modal .popupSec .modal-body .alert-icon {
  font-size: 62px;
  margin: 100px 0 26px 0;
}
.profile-update-modal.alert-modal .popupSec .modal-body .alert-icon i {
  color: #a3a6c2;
  font-size: 45px;
}
.profile-update-modal.alert-modal .popupSec .modal-body .alert-icon .get-icon-success-tick {
  padding: 7.5px 18.5px;
  border-radius: 50%;
}
.profile-update-modal.alert-modal .popupSec .modal-body .alert-icon .get-icon-success-tick i:before {
  top: 0;
}
.profile-update-modal.alert-modal .popupSec .modal-body h1 {
  font-size: 35px;
  font-family: volte_medium;
}
.profile-update-modal.alert-modal .popupSec .modal-body .instructions-text {
  font-family: volte_medium;
}
.profile-update-modal.alert-modal .popupSec .modal-body .btn-group .btn {
  width: 263px;
  height: 50px;
  font-family: volte_medium;
}

.change-password-form .form-group {
  margin: 20px auto;
}
.change-password-form .show-password {
  top: 36px;
}

.cancel-btn {
  display: none !important;
}
.cancel-btn a {
  text-decoration: none;
  color: #ffffff !important;
}

input::placeholder {
  font-weight: 400 !important;
  color: #AFB2B3;
}

input::-moz-placeholder {
  font-weight: 500 !important;
  color: #AFB2B3;
}

input::-ms-input-placeholder {
  font-weight: 500 !important;
  color: #AFB2B3;
}

.hide-close .Toastify__close-button {
  display: none;
}

@media only screen and (max-width: 768px) {
  .d-none {
    display: none !important;
  }
  .profile-container .profile-wrapper {
    margin-top: 0 !important;
  }
  .profile-container .profile-wrapper .content-header {
    font-size: 22px;
  }
  .profile-container .profile-wrapper .input-container {
    margin: 20px 0 15px 0 !important;
  }
  .profile-container .profile-wrapper .profile-img-section {
    margin-bottom: -6px !important;
  }
  .profile-container .profile-wrapper .profile-img-section .profile-hover {
    top: 23%;
  }
  .profile-container .profile-wrapper .profile-img-section .profile-img {
    margin: 22px 0 5px 0 !important;
  }
  .profile-container .profile-wrapper .btn-wrapper .next {
    margin-top: 52px !important;
    width: 100% !important;
    padding: 19px 52px !important;
  }
  .profile-container .profile-wrapper .mobile-wrapper p:nth-child(1) {
    color: #ffffff;
  }
  .account-detail-page {
    padding: 10px;
    width: 360px;
    margin: 0 auto; /* Centers horizontally */
  }
  .cancel-btn {
    margin: 20px auto;
    display: flex !important;
  }
  .profile-update-modal.alert-modal .popupSec {
    width: 75%;
    height: 100%;
    overflow-y: auto;
  }
  .profile-update-modal.alert-modal .popupSec .modal-body h1 {
    margin: 0 auto;
    padding: 0 15px;
  }
  .profile-update-modal.alert-modal .popupSec .modal-body p.instructions-text {
    margin: 12px auto;
    padding: 0 15px;
    width: 100%;
  }
}
@media only screen and (max-width: 480px) {
  .profile-img-section .profile-hover {
    display: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.switch-account-setting {
  margin-top: 3.5em;
}
.switch-account-setting .switch-account h2 {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  /* or 31px */
  display: flex;
  align-items: center;
  color: #ffffff;
  margin-bottom: 20px;
}
.switch-account-setting .btn {
  width: 100%;
  margin: 20px auto 0 !important;
  padding: 0 !important;
  font-size: 16px;
  font-family: volte_medium;
}
.switch-account-setting .primary-btn {
  width: 280px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}
.switch-account-setting .switch-account-subTitles h2 {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  margin-bottom: 10px;
  text-align: left;
}
.switch-account-setting .switch-account-subTitles p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #a3a6c2;
  display: flex;
  justify-content: start;
}
.switch-account-setting .switch-account-subTitles2 p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #a3a6c2;
  display: flex;
  justify-content: start;
  margin-top: 20px;
  margin-bottom: 7px;
}
.switch-account-setting .switch-head {
  padding: 4px;
  font-size: 18px;
}
.switch-account-setting .switch-head i.icon-left-arrow {
  cursor: pointer;
}
.switch-account-setting .switch-head i.icon-left-arrow:before {
  color: #ffffff;
  font-size: 12px;
  position: relative;
  margin-right: 16px;
}
.switch-account-setting.switch-account-setting {
  height: auto;
  overflow-y: auto;
  overflow-x: hidden;
  right: 0;
  text-align: left;
}
.switch-account-setting.switch-account-setting .switch-account-container {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.switch-account-setting.switch-account-setting .available-account {
  padding: 0 14px;
  border: 1px solid #564372;
  border-radius: 10px;
  max-width: 420px;
  width: 420px;
  margin-right: 20px;
  display: flex;
  align-items: center;
}
.switch-account-setting.switch-account-setting .acc {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}
.switch-account-setting.switch-account-setting .acc div {
  color: #a3a6c2;
  font-size: 16px;
}
.switch-account-setting.switch-account-setting .acc div.acc-detail {
  position: relative;
  left: 12px;
  display: flex;
  align-items: center;
}
.switch-account-setting.switch-account-setting .acc div.acc-detail i {
  vertical-align: bottom;
}
.switch-account-setting.switch-account-setting .acc div.acc-detail p {
  width: 100%;
  line-height: normal;
}
.switch-account-setting.switch-account-setting .acc div.acc-detail p span.acc-id {
  font-size: 14px;
}
.switch-account-setting.switch-account-setting .acc div.selected-account-img {
  width: 47px;
  background: red;
  border-radius: 50%;
  height: 47px;
  text-align: center;
  background: linear-gradient(121deg, #f08300 8%, #e3000f 31%, #a72879 73%, #064497 99%);
  display: flex;
}
.switch-account-setting.switch-account-setting .acc div.selected-account-img img {
  max-width: 84%;
  min-width: 84%;
  margin: 4px;
  background: white;
  border-radius: 50%;
}
.switch-account-setting.switch-account-setting .acc div.active-tick {
  position: relative;
  right: 0;
  float: right;
}
.switch-account-setting.switch-account-setting .acc div.active-tick .get-icon-success-tick {
  background-color: #ffffff;
  padding: 2px 4px;
  border: 1px solid #7ed321;
  border-radius: 50%;
}
.switch-account-setting.switch-account-setting .acc div.active-tick .get-icon-success-tick i.icon-check {
  font-size: 14px;
  position: relative;
  top: -1px;
}
.switch-account-setting.switch-account-setting .selected-account {
  padding: 8px 14px;
}
.switch-account-setting.switch-account-setting .selected-account .sudId-wrapper {
  display: flex;
  flex-direction: column;
  align-items: start;
}
.switch-account-setting.switch-account-setting .selected-account .sudId-wrapper .plan-name {
  font-weight: 500;
  line-height: 120%;
  font-family: volte_medium;
  font-size: 18px;
  line-height: 21px;
  color: #ffffff;
}
.switch-account-setting.switch-account-setting .selected-account .sudId-wrapper .active {
  display: flex;
  padding: 2px 3px;
  justify-content: center;
  font-family: volte_bold;
  align-items: center;
  border-radius: 2px;
  background: var(--branding-colours-purple-25, #D6C6F4);
  margin-bottom: 4px;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  color: #564372;
}
.switch-account-setting.switch-account-setting .selected-account .sudId-wrapper .inactive {
  display: flex;
  padding: 2px 3px;
  justify-content: center;
  font-family: volte_bold;
  align-items: center;
  margin-bottom: 4px;
  border-radius: 2px;
  background: var(--alerts-error-red, #E56C6C);
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  color: #020005;
}
.switch-account-setting.switch-account-setting .selected-account .sudId-wrapper .alias-name {
  color: #FFF;
  font-family: volte_reg;
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  margin-top: 4px;
  text-align: left;
}
.switch-account-setting.switch-account-setting .selected-account .binge-asset {
  display: flex;
  justify-content: center;
  align-items: center;
}
.switch-account-setting.switch-account-setting .selected-account .binge-asset .set-device-img {
  width: 24px;
}
.switch-account-setting.switch-account-setting .selected-account .binge-asset img {
  position: relative;
}
.switch-account-setting.switch-account-setting .available-account {
  padding: 0 4px;
}
.switch-account-setting.switch-account-setting .available-account .avatar-image.sb-avatar__text {
  padding: 2px;
  background: #2b2d41;
  border: 4px solid #404254;
}
.switch-account-setting.switch-account-setting .available-account.acc div.acc-detail {
  width: 240px;
}
.switch-account-setting.switch-account-setting .available-account .binge-asset {
  display: flex;
  justify-content: center;
  align-items: center;
}
.switch-account-setting.switch-account-setting .available-account .binge-asset img {
  position: relative;
}
.switch-account-setting.switch-account-setting li {
  padding: 0 10px;
  margin-bottom: 20px;
  display: block;
}
.switch-account-setting.switch-account-setting li a {
  text-decoration: none;
  color: #ffffff;
}
.switch-account-setting.switch-account-setting li span.icon.left-icon {
  margin-right: 10px;
}
.switch-account-setting.switch-account-setting.hide {
  display: none;
}
.switch-account-setting.switch-account-setting .sign-out-text {
  cursor: pointer;
  font-size: 18px;
  padding: 10px 6px 6px 6px;
  width: fit-content;
}
.switch-account-setting.switch-account-setting .avatar-image.sb-avatar__text {
  height: 47px;
  width: 47px;
  padding: 5px;
}
.switch-account-setting.switch-account-setting .avatar-image.sb-avatar.sb-avatar--text {
  top: 0;
}
.switch-account-setting.switch-account-setting .avatar-image.sb-avatar.sb-avatar--text div {
  font-size: 25px;
}
.switch-account-setting .unactive-tick {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 24px;
  margin-right: -6px;
  /* Safari 11+ */
}
@media not all and (min-resolution: 0.001dpcm) {
  @supports (-webkit-appearance: none) and (stroke-color: transparent) {
    .switch-account-setting .unactive-tick {
      position: relative;
      top: 9px;
    }
  }
}
.switch-account-setting p {
  display: flex;
  justify-content: center;
  align-items: center;
}
.switch-account-setting p span.white-text {
  position: relative;
  font-size: 18px;
  width: 100%;
  font-family: volte_medium !important;
}
@media only screen and (max-width: 480px) {
  .switch-account-setting.switch-account-setting {
    margin-top: 0;
  }
  .switch-account-setting.switch-account-setting .available-account {
    width: 100% !important;
    margin-right: 0 !important;
  }
  .switch-account-setting .switch-account h2 {
    font-size: 22px !important;
  }
  .switch-account-setting .switch-account-subTitles h2 {
    margin-top: 22px !important;
    font-size: 22px !important;
  }
  .switch-account-setting .switch-account-subTitles2 p {
    margin-bottom: 10px !important;
    margin-top: 15px !important;
  }
  .switch-account-setting.switch-account-setting li {
    margin-bottom: 4px !important;
  }
  .switch-account-setting .btn {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
  }
}
@media only screen and (max-width: 945px) {
  .switch-account-setting .switch-account-container {
    width: 100%;
  }
  .switch-account-setting .switch-account-container .available-account .selected-account {
    width: 100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.main-setting-page .language-setting-container {
  width: 100%;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  min-height: 650px;
  margin-top: 15px;
}
.main-setting-page .language-setting-container.device-screen {
  min-height: 545px;
}
.main-setting-page .side-bar-container {
  width: 30%;
  display: flex;
  flex-direction: column;
}
.main-setting-page .side-bar-container h3 {
  width: 310px;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  font-weight: 600;
  font-family: volte_medium;
  color: #ffffff;
  margin-bottom: 18px;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper {
  display: flex;
  width: 310px;
  padding: 16px 0;
  align-items: center;
  position: relative;
  cursor: pointer;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper:hover .left-image i:before {
  color: #ffffff;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper:hover .dont-show-right-icon {
  display: block !important;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper:hover .dont-show-right-icon .icon-Path {
  margin-left: 40px;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper:hover .dont-show-right-icon .icon-Path::before {
  color: #f3cbe3;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper:hover .right-image .icon-Path:before {
  color: #f3cbe3;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper:not(:nth-last-child(-1n+2)) {
  border-bottom: 1px solid #564372;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper .icon-sign-out {
  font-size: 20px;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper .right-image {
  position: absolute;
  right: 6px;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper .right-image .icon-Path:before {
  color: #ffffff;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper .dont-show-right-icon {
  display: none !important;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper p {
  color: #ffffff;
  width: 235px;
  padding-left: 26px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper img {
  width: 100%;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper span {
  color: #a3a6c2;
  padding: 0 5px;
  font-style: normal;
  font-weight: normal;
  font-size: 13px;
  line-height: 100%;
}
.main-setting-page .side-bar-container .side-bar-inner-wrapper .span-active {
  color: #ffffff;
}
.main-setting-page .toggle-wrapper {
  display: flex;
  align-items: center;
  position: absolute;
  right: 0;
}
.main-setting-page .toggle-wrapper .ToggleSwitch {
  height: 15px;
  width: 34px;
  background: #5087c7;
  border-radius: 9.5px;
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
}
.main-setting-page .toggle-wrapper .ToggleSwitch .knob {
  width: 19px;
  height: 19px;
  border-radius: 50%;
  left: 0;
  transition: left 0.3s ease-out;
  background: #ffffff;
  position: absolute;
}
.main-setting-page .toggle-wrapper .ToggleSwitch .knob.active {
  left: 1em;
}
@media only screen and (min-width: 320px) and (max-width: 768px) {
  .main-setting-page .side-bar-container {
    padding: 0.4em 0 0 0;
    width: 100%;
    margin-bottom: -3.8em;
  }
  .main-setting-page .side-bar-container h3 {
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    font-weight: 400;
    line-height: 120%;
    margin-bottom: 7px;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper {
    width: 100%;
    padding: 22px 0 12px 0;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper:hover .left-image i:before {
    color: #8e81a1;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper p {
    width: 166px;
    font-size: 16px;
    font-weight: 400;
    font-family: volte_medium;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper p.switch-subscription {
    width: 173px;
  }
}
.main-setting-page .d-none {
  display: none;
}
@media only screen and (max-width: 320px) {
  .main-setting-page .side-bar-container {
    width: 100%;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper {
    width: 100%;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper p {
    width: 166px;
    font-size: 13px;
    font-family: volte_medium;
  }
  .main-setting-page .side-bar-container .side-bar-inner-wrapper span {
    font-size: 10px;
  }
}
.main-setting-page main {
  display: flex;
  width: 100%;
  height: 100%;
  position: relative;
}
.main-setting-page .sidebar {
  width: 310px;
  background-size: 200%;
  background-position: 0 100%;
  position: absolute;
  top: 19px;
  left: 0;
  height: 100%;
  transition: 300ms ease-in-out;
  z-index: 1;
  overflow: hidden;
  cursor: pointer;
}
.main-setting-page .sidebar--expanded {
  background-size: 100%;
  background-position: 0 0;
  transform: translateX(0);
  height: auto;
  margin-left: 5.2%;
}
.main-setting-page .sidebar:hover {
  background-position: 0 0;
}
.main-setting-page .sidebar__toggle {
  width: 100%;
  height: 100%;
  height: 4rem;
  position: absolute;
  top: 0;
  left: 0;
  border: none;
  background: transparent;
  font-size: 20px;
  color: white;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 1.8rem;
  padding-bottom: 0;
  transition: 300ms ease;
  cursor: pointer;
}
.main-setting-page .sidebar__toggle:focus {
  outline: none;
}
.main-setting-page .main-content {
  width: 100%;
  display: flex;
  flex-direction: column;
  transition: 300ms ease-in-out;
  position: relative;
  z-index: 2;
}
.main-setting-page .main-content--expanded {
  margin: 0 70px 0 calc(5.2% + 440px);
}
.main-setting-page .main-content header {
  height: 5rem;
  width: 100%;
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 1rem 0 2rem;
}
.main-setting-page .main-content header span {
  width: 16rem;
  height: 2rem;
  background: #e5e5e7;
}
.main-setting-page .main-content header ul {
  list-style: none;
  display: flex;
  align-items: center;
}
.main-setting-page .main-content header ul li {
  width: 6rem;
  height: 2rem;
  margin: 0 1rem;
  background: #e5e5e7;
}
.main-setting-page .main-content header ul li:last-child {
  margin-right: 0;
}
.main-setting-page .main-content .container {
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
}
.main-setting-page .main-content .module--full {
  width: 100%;
  height: 400px;
  box-shadow: 0 3px 8px rgba(211, 211, 211, 0.1), 0 6px 7px rgba(211, 211, 211, 0.1);
}
.main-setting-page .main-content .module-wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 1rem;
}
.main-setting-page .main-content .module--half {
  flex: 1;
  height: 400px;
  box-shadow: 0 3px 8px rgba(211, 211, 211, 0.1), 0 6px 7px rgba(211, 211, 211, 0.1);
}
.main-setting-page .main-content .module--half:first-child {
  margin-right: 1rem;
}
.main-setting-page .shape {
  position: absolute;
  top: 0;
  left: 0;
  width: 360px;
  height: 370px;
  border-radius: 100%;
  margin-left: -100px;
  margin-top: -20px;
  z-index: -1;
  opacity: 0;
  margin-left: 0;
  margin-top: 0;
  transition: 400ms ease;
}
.main-setting-page .shape:nth-child(2) {
  margin-top: 70px;
  margin-left: 50px;
  margin-top: 0;
}
.sidebar--expanded .main-setting-page .shape {
  animation: float 6s infinite alternate;
  margin-left: -100px;
  margin-top: -20px;
  opacity: 0.4;
  transform: scale(1) translateY(0);
}
@keyframes float {
  20% {
    top: 0;
    left: -100px;
  }
  50% {
    left: 0;
  }
  100% {
    top: 500px;
    left: -100px;
  }
}
.main-setting-page .fullWidth {
  width: 100%;
  margin: 0 5.2%;
}
@media only screen and (max-width: 767px) {
  .main-setting-page .language-setting-container {
    flex-wrap: wrap;
    margin: 0 5.2% 24px 5.2%;
  }
  .main-setting-page .main-content--expanded {
    margin: 0;
  }
  .main-setting-page .fullWidth {
    width: 100%;
    margin: 0;
  }
}
@media only screen and (max-width: 480px) {
  .main-setting-page .language-setting-container {
    min-height: 545px;
    margin: 18px 5.2% -21px 5.2%;
  }
}

.hide-close .Toastify__close-button {
  display: none;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.page-cls-subscription-discount .login-with-otp-modal.popup_overlay {
  display: none;
  background: unset;
  background: transparent;
}

.subscription-discount-container {
  position: relative;
}
.subscription-discount-container .banner-container {
  height: 100vh;
  width: 100%;
}
.subscription-discount-container .banner-container.rm-height {
  height: 268px;
}
.subscription-discount-container .banner-container img {
  width: 100%;
  height: 100%;
}
.subscription-discount-container .discount-pack-listing-container {
  width: 29.1%;
  margin: 0 auto;
  position: relative;
}
.subscription-discount-container .discount-pack-listing-container .plan-container.mb-top {
  margin-top: 24px;
}
.subscription-discount-container .discount-pack-listing-container .plan-container .save-discount {
  position: absolute;
  width: 52px;
  height: 16px;
  background: #6b00dd;
  border-radius: 6px 6px 0px 0px;
  top: -17px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.subscription-discount-container .discount-pack-listing-container .plan-container .save-discount p {
  font-weight: 600;
  font-size: 10px;
  line-height: 120%;
  color: #ffffff;
  font-family: volte_reg;
}
.subscription-discount-container .discount-pack-listing-container .plan-container.plan-select .save-discount {
  top: -18px;
}
.subscription-discount-container .discount-pack-listing-container .plan-container.hover:hover .save-discount {
  top: -18px;
}
.subscription-discount-container .discount-pack-listing-container .heading {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 25.2283px;
  line-height: 120%;
  color: #ffffff;
  margin-bottom: 37px;
  text-align: center;
}
.subscription-discount-container .proceed-btn {
  width: 100%;
  margin-top: 20px;
  position: sticky;
  bottom: 0px;
  text-align: center;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 50.52%, #000000 100%);
}
.subscription-discount-container .proceed-btn .btn-wrapper {
  border: none;
  padding: 11px 0px;
  width: 100%;
}
.subscription-discount-container .proceed-btn .btn-wrapper .button-text {
  color: #ffffff;
}
.subscription-discount-container .proceed-btn .btn-wrapper[disabled] {
  background: #8e81a1;
  cursor: not-allowed;
  border: none;
}
.subscription-discount-container .proceed-btn .btn-wrapper[disabled] .button-text {
  color: rgba(255, 255, 255, 0.7);
}
.subscription-discount-container .proceed-btn .btn-wrapper[disabled]:hover {
  box-shadow: none;
}

@media only screen and (min-width: 320px) and (max-width: 480px) {
  .subscription-discount-container .banner-container.rm-height {
    height: 192px;
  }
  .subscription-discount-container .banner-container img {
    object-fit: cover;
  }
  .subscription-discount-container .discount-pack-listing-container {
    width: 100%;
    padding: 0 20px;
  }
  .subscription-discount-container .discount-pack-listing-container .heading {
    font-size: 18px;
  }
  .subscription-discount-container .discount-pack-listing-container .proceed-btn {
    width: 100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.coupon-redeem-container {
  background: linear-gradient(0deg, #020005 -3.36%, #220046 40.02%);
  font-family: "volte_reg";
  font-style: normal;
}
@media (max-width: 480px) {
  .coupon-redeem-container {
    height: calc(100vh - 146px);
  }
}
.coupon-redeem-container .banner-section {
  height: 240px;
  width: 100%;
  background: linear-gradient(180deg, #522779 0%, #000 100%);
  text-align: center;
  display: inline-flex;
  padding: 0px 10% 0px 10%;
  justify-content: center;
  align-items: center;
}
@media (max-width: 480px) {
  .coupon-redeem-container .banner-section {
    height: 146px;
  }
}
.coupon-redeem-container .banner-section .logo-section {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  text-align: left;
}
@media (max-width: 480px) {
  .coupon-redeem-container .banner-section .logo-section {
    display: none;
  }
}
.coupon-redeem-container .banner-section .logo-section p {
  font-size: 27.741px;
  font-weight: 700;
  line-height: 120%;
  /* 33.289px */
  text-transform: uppercase;
  color: #FFF;
}
.coupon-redeem-container .banner-section .logo-section p.pink {
  color: #E10092;
}
@media (max-width: 480px) {
  .coupon-redeem-container .banner-section .img-section img {
    height: auto;
    width: 100%;
    position: relative;
  }
}
.coupon-redeem-container .lower-section {
  height: 100%;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}
.coupon-redeem-container .lower-section .heading-section {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-top: 40px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .heading-section {
    margin-top: 24px;
  }
}
.coupon-redeem-container .lower-section .heading-section p {
  text-align: center;
  font-weight: 500;
  color: #D6C6F4;
  line-height: 24px;
  font-size: 20px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .heading-section p {
    font-size: 12px;
    line-height: 14px;
  }
}
.coupon-redeem-container .lower-section .heading-section p:first-of-type {
  color: var(--White, #FFF);
  font-size: 26px;
  line-height: 31.2px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .heading-section p:first-of-type {
    font-size: 20px;
    line-height: 24pxx;
  }
}
.coupon-redeem-container .lower-section .border-line {
  border: 1px solid #564372;
  width: 50%;
  margin: 20px 0 40px 0;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .border-line {
    width: 85%;
    margin: 35px 0 32px 0;
  }
}
.coupon-redeem-container .lower-section .binge-logo {
  width: 85px;
  height: 20px;
  margin-bottom: 20px;
  margin-top: 40px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .binge-logo {
    margin-top: 37px;
  }
}
.coupon-redeem-container .lower-section .input-section {
  width: 420px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .input-section {
    width: 330px;
  }
}
.coupon-redeem-container .lower-section .input-section p.mobile {
  color: var(--White, #FFF);
  text-align: center;
  font-size: 26px;
  font-weight: 500;
  line-height: 31.2px;
  margin-bottom: 20px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .input-section p.mobile {
    font-size: 20px;
    margin-bottom: 8px;
  }
}
.coupon-redeem-container .lower-section .input-section button.btn.primary-btn.get-otp-btn {
  width: 420px;
  border-radius: 4px;
  margin-top: 20px;
}
@media (min-width: 350px) and (max-width: 480px) {
  .coupon-redeem-container .lower-section .input-section button.btn.primary-btn.get-otp-btn {
    width: 320px;
    position: absolute;
    bottom: 26px;
  }
}
@media (min-width: 480px) and (max-width: 850px) {
  .coupon-redeem-container .lower-section .input-section button.btn.primary-btn.get-otp-btn {
    width: 420px;
    position: absolute;
    bottom: 26px;
  }
}
.coupon-redeem-container .lower-section .input-section .apply-coupon input {
  width: 420px;
  border-radius: 10px;
  border: 1px solid var(--icons-binge-blue-75, #564372);
  background: var(--app-background-app-background, #020005);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);
  margin-bottom: 20px;
  color: #FFF;
  font-family: "volte_medium";
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .input-section .apply-coupon input {
    width: 320px;
  }
}
.coupon-redeem-container .lower-section .input-section .apply-coupon .form-data input.error {
  border: 1px solid #e56c6c;
}
.coupon-redeem-container .lower-section .input-section .apply-coupon .form-data .error-message {
  margin-bottom: 20px;
  font-size: 14px;
  font-weight: 500;
  line-height: 16.8px;
}
.coupon-redeem-container .lower-section .input-section .apply-coupon .coupon-license p {
  color: #ffffff;
  font-family: "volte_medium";
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 120%;
  text-align: center;
}
.coupon-redeem-container .lower-section .input-section .apply-coupon .coupon-license p span a {
  padding-left: 1px;
  text-decoration: none;
  color: #f3cbe3;
  text-decoration: none !important;
}
.coupon-redeem-container .lower-section .input-section .apply-coupon button.btn.primary-btn.apply-coupon {
  margin-top: 40px;
  width: 100%;
  border-radius: 4px;
}
@media (max-width: 480px) {
  .coupon-redeem-container .lower-section .input-section .apply-coupon button.btn.primary-btn.apply-coupon {
    margin-top: 20px;
    width: 320px;
    position: absolute;
    bottom: 26px;
  }
}

@media only screen and (min-width: 250px) and (max-width: 850px) {
  .img-section {
    height: 100%;
    width: 100%;
  }
  .img-section img {
    height: 100%;
    width: 100%;
    position: relative;
  }
}
@media only screen and (min-width: 250px) and (max-width: 850px) {
  .coupon-redeem-container .banner-section {
    padding: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.page-cls-freetrial .binge-trial-error .popupSec {
  width: 90%;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body {
  padding: 51px 20px 43px 20px;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body .alert-icon {
  margin-bottom: 14px;
  font-size: 40px;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body .alert-icon .icon-alert-upd::before {
  color: #A3A6C2;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body h1 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 120%;
  margin-bottom: 5px;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body .instructions-text {
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body .btn-group {
  margin-bottom: 0;
}
.page-cls-freetrial .binge-trial-error .popupSec .modal-body .btn-group .btn {
  margin: 20px 0 0 0;
  border-radius: 4px;
  font-family: volte_medium !important;
}
.page-cls-freetrial .binge-trial-container {
  position: relative;
  height: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-bg-image {
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-bg-image img {
  width: 100%;
  height: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container {
  width: 90%;
  margin: 0 auto;
  z-index: 2;
  position: relative;
  padding-top: 42px;
}
.page-cls-freetrial .binge-trial-container .trial-container .binge-logo-container {
  width: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container .binge-logo-container .binge-logo {
  width: 68px;
  height: 17px;
  text-align: center;
  margin: 0 auto;
}
.page-cls-freetrial .binge-trial-container .trial-container .binge-logo-container .binge-logo img {
  width: 100%;
  height: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container .congrats-verbiage {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 25px;
  text-align: center;
  color: #FFFFFF;
  margin-top: 23px;
}
.page-cls-freetrial .binge-trial-container .trial-container .eligible-verbiage {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 25px;
  text-align: center;
  color: #FFFFFF;
}
.page-cls-freetrial .binge-trial-container .trial-container .eligible-verbiage span {
  background: linear-gradient(270deg, #FFA800 0%, #FFF389 45.31%, #FFA800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container {
  background: linear-gradient(90deg, #D6C6F4 0%, #EFE8FB 47.49%, #D6C6F4 94.27%);
  border-radius: 10px;
  margin-top: 36px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper {
  color: #220046;
  padding: 15.5px 14px 12px 14px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .pack-name {
  display: flex;
  align-items: center;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .pack-name .img-container {
  margin-bottom: 2px;
  width: 21px;
  height: 21px;
  background: #220046;
  border-radius: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .pack-name .img-container img {
  width: 15px;
  height: 15px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .pack-name p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 12px;
  line-height: 120%;
  color: #220046;
  padding-left: 6px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .free-trial-text {
  display: flex;
  align-items: center;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .free-trial-text :nth-child(1) {
  font-size: 16px;
  text-decoration: line-through;
  font-family: volte_medium;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .free-trial .free-trial-text :nth-child(2) {
  font-size: 19px;
  padding-left: 6px;
  font-family: volte_semiBold;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .device-app-text {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 12px;
  line-height: 120%;
  margin-top: 12px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .device-app-text span {
  font-size: 20px;
  font-family: volte_semiBold;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container {
  margin-top: 12.24px;
  display: flex;
  align-items: self-end;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper {
  display: flex;
  align-items: center;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper .laptop {
  width: 18px;
  height: 14px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper .laptop img {
  width: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper .tv {
  width: 18px;
  height: 12px;
  margin-left: 3.73px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper .tv img {
  width: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper .mobile {
  margin-left: 3.73px;
  width: 7px;
  height: 10px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container .screen-wrapper .mobile img {
  width: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .watch-container p {
  padding-left: 8px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 12px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .partners-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 19px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .partners-wrapper div {
  width: 46px;
  height: 46px;
  margin-right: 12px;
  margin-bottom: 12px;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .partners-wrapper div img {
  width: 100%;
  height: 100%;
}
.page-cls-freetrial .binge-trial-container .trial-container .trial-plan-container .wrapper .partners-wrapper p {
  width: 46px;
  height: 46px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 12px;
  line-height: 120%;
  display: flex;
  align-items: center;
  text-align: center;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-container {
  font-family: volte_reg;
  font-weight: 600;
  font-size: 15px;
  line-height: 19px;
  color: #FFFFFF;
  margin-top: 40px;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-container.error-container .form-data input {
  border: 1px solid #E56C6C;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-container .form-data {
  margin-top: 8px;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-container .form-data input {
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  background: #EFE8FB;
  mix-blend-mode: normal;
  border: 1px solid #F7F4FC;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  color: #000000;
  padding: 13px 0 12px 10px;
  font-size: 16px;
  font-weight: 500;
  font-family: volte_medium;
  line-height: 120%;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-container .form-data input ::placeholder {
  color: #8E81A1;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-container .form-data .error-message {
  position: absolute;
  top: 3.54em;
  font-size: 12px;
  line-height: 15px;
  color: #E56C6C;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-btn {
  background: #E10092;
  border-radius: 4px;
  width: 100%;
  padding: 14px 0;
  border: none;
  margin-top: 30px;
  margin-bottom: 10px;
}
.page-cls-freetrial .binge-trial-container .trial-container .rmn-btn .button-text {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  text-align: center;
  color: #FFFFFF;
}
.page-cls-freetrial .binge-trial-container .multiple-SID {
  z-index: 2;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 50px 10px;
}
.page-cls-freetrial .trial-success-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  position: relative;
  z-index: 2;
}
.page-cls-freetrial .trial-success-container .sucess-tick {
  width: 30px;
  height: 30px;
}
.page-cls-freetrial .trial-success-container h2 {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 120%;
  color: #FFFFFF;
  margin-top: 20px;
}
.page-cls-freetrial .trial-success-container h3 {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  color: #FFFFFF;
  text-align: center;
  margin-top: 5px;
}
.page-cls-freetrial .trial-success-container h3 p {
  margin-top: 25px;
  color: #D6C6F4;
}
.page-cls-freetrial .trial-success-container .trial-success-btn {
  background: #E10092;
  border-radius: 4px;
  width: 77%;
  border: none;
  margin-top: 25px;
  padding: 15px 0;
}
.page-cls-freetrial .trial-success-container .trial-success-btn .button-text {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  color: #FFFFFF;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.preferred-language-contr {
  background: linear-gradient(314deg, #020005 0%, #220046 100%);
  position: absolute;
  top: 0;
  height: 100vh;
  width: 100%;
}
.preferred-language-contr .content-subtitle {
  font-family: volte_medium;
  color: #FFF;
  text-align: center;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  margin-top: 24px;
  padding: 0 20px;
}
.preferred-language-contr .selection-container .save-prefernces-button {
  width: 100%;
  margin: 50px 0 16.5px 0;
}
.preferred-language-contr .selection-container .not-click {
  text-align: center;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.delete_account_wrapper {
  width: 460px;
  margin: auto auto 40px auto;
}
.delete_account_wrapper h1 {
  font-size: 22px;
  line-height: 26.4px;
  font-weight: 700;
  font-family: volte_medium;
  color: #ffffff;
  margin-bottom: 24px;
}
.delete_account_wrapper .delete_upper_wrapper li {
  font-size: 18px;
  font-family: volte_reg;
  color: #ffffff;
  line-height: 21.6px;
  font-weight: 500;
  margin-bottom: 24px;
}
.delete_account_wrapper .delete_button {
  border: 2px solid #f3cbe3;
  border-radius: 4px;
  padding: 13px;
  color: #f3cbe3;
  background: none;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  width: 100%;
  margin-bottom: 24px;
  cursor: pointer;
}
.delete_account_wrapper .delete_line_wrapper {
  color: #C7C0CF;
  display: flex;
  flex-direction: row;
  height: 2px;
  margin-bottom: 24px;
}
.delete_account_wrapper .delete_line_wrapper .left_side {
  width: 208px;
  border: 2px solid #C7C0CF;
  text-align: left;
}
.delete_account_wrapper .delete_line_wrapper .text_contain {
  width: 44px;
  text-align: center;
  font-size: 14px;
  font-weight: 600;
  line-height: 4.8px;
}
.delete_account_wrapper .delete_line_wrapper .right_side {
  width: 208px;
  border: 2px solid #C7C0CF;
  text-align: right;
}
.delete_account_wrapper .delete_bottom_wrapper p {
  font-size: 18px;
  font-family: volte_reg;
  color: #ffffff;
  line-height: 21.6px;
  font-weight: 500;
  margin-bottom: 24px;
}

.back_arrow {
  width: 24px;
  height: 24px;
  margin-top: 16px;
  margin-left: 24px;
  margin-bottom: 16px;
  cursor: pointer;
}
.back_arrow img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 480px) {
  .delete_account_wrapper {
    width: 320px;
    margin: 20px auto;
  }
  .delete_account_wrapper h1 {
    font-size: 16px;
    line-height: 19.2px;
    margin-bottom: 16px;
  }
  .delete_account_wrapper .delete_upper_wrapper li {
    font-size: 16px;
    line-height: 19.2px;
    margin-bottom: 16px;
  }
  .delete_account_wrapper .delete_button {
    font-size: 16px;
    padding: 16px;
    margin-bottom: 16px;
  }
  .delete_account_wrapper .delete_line_wrapper {
    height: 1px;
  }
  .delete_account_wrapper .delete_line_wrapper .left_side {
    width: 145px;
    text-align: left;
  }
  .delete_account_wrapper .delete_line_wrapper .text_contain {
    font-size: 12px;
    line-height: 4.4px;
  }
  .delete_account_wrapper .delete_line_wrapper .right_side {
    width: 145px;
    text-align: right;
  }
  .delete_account_wrapper .delete_bottom_wrapper p {
    font-size: 16px;
    line-height: 19.2px;
    margin-bottom: 16px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.identity_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: linear-gradient(154.51deg, #8E81A1 17.1%, #564372 39.25%, #220046 68.84%, #030106 84.82%);
  height: 100vh;
}
.identity_wrapper .identity_image_wrapper {
  width: 135px;
  height: 157px;
  margin-bottom: 15px;
}
.identity_wrapper .identity_image_wrapper img {
  width: 100%;
  height: 100%;
}
.identity_wrapper .text_wrapper {
  font-family: volte_medium;
  width: 500px;
  text-align: center;
}
.identity_wrapper .text_wrapper h1 {
  font-size: 32px;
  line-height: 38.4px;
  font-weight: 600;
  margin-bottom: 16px;
  color: #ffffff;
  font-family: volte_medium;
}
.identity_wrapper .text_wrapper p {
  font-size: 18px;
  line-height: 21.6px;
  font-weight: 500;
  margin-bottom: 24px;
  color: #ffffff;
  font-family: volte_reg;
}
.identity_wrapper .rmn_wrapper {
  height: 81px;
  width: 420px;
  background: #ffffff;
  border-radius: 8px;
  padding: 16px 15px 17px 15px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}
.identity_wrapper .rmn_wrapper .mobile_image {
  width: 40px;
  height: 40px;
}
.identity_wrapper .rmn_wrapper .mobile_image img {
  width: 100%;
  height: 100%;
}
.identity_wrapper .rmn_wrapper .rmn_left_wrapper {
  display: flex;
  flex-direction: row;
}
.identity_wrapper .rmn_wrapper .rmn_left_wrapper .rmn_text_wrapper {
  display: flex;
  flex-direction: column;
  margin-left: 10px;
}
.identity_wrapper .rmn_wrapper .rmn_left_wrapper .rmn_text_wrapper .otp_text {
  font-size: 22px;
  font-weight: 600;
  line-height: 26.4px;
  color: #220046;
  font-family: volte_semiBold;
}
.identity_wrapper .rmn_wrapper .rmn_left_wrapper .rmn_text_wrapper .mobile_no {
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  color: #000;
  font-family: volte_reg;
}

.back_arrow {
  width: 24px;
  height: 24px;
  margin-top: 16px;
  margin-left: 24px;
  margin-bottom: 16px;
  cursor: pointer;
  align-self: flex-start;
}
.back_arrow img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 480px) {
  .identity_wrapper {
    height: 100vh;
    width: 100vw;
    padding-top: 10%;
  }
  .identity_wrapper .text_wrapper {
    width: 300px;
  }
  .identity_wrapper .text_wrapper h1 {
    font-size: 26px;
    line-height: 31.4px;
    margin-bottom: 23px;
  }
  .identity_wrapper .text_wrapper p {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 23px;
  }
  .identity_wrapper .rmn_wrapper {
    width: 300px;
    height: 67px;
    padding: 10px 16px 10px 16px;
  }
  .identity_wrapper .rmn_wrapper .rmn_left_wrapper .mobile_image {
    width: 37px;
    height: 37px;
  }
  .identity_wrapper .rmn_wrapper .rmn_left_wrapper .rmn_text_wrapper {
    margin-left: 14px;
  }
  .identity_wrapper .rmn_wrapper .rmn_left_wrapper .rmn_text_wrapper .mobile_no {
    font-size: 14px;
    line-height: 16.8px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.confirm_delete_wrapper {
  width: 460px;
  margin: auto auto 40px auto;
}
.confirm_delete_wrapper .confirm_text {
  font-size: 18px;
  font-family: volte_medium;
  color: #ffffff;
  font-weight: 500;
  line-height: 21.6px;
  margin-bottom: 24px;
  text-align: left;
}
.confirm_delete_wrapper .confirm_button {
  border: 2px solid #e10092;
  border-radius: 4px;
  padding: 13px;
  font-size: 16px;
  font-weight: 600;
  line-height: 19.2px;
  color: #ffffff;
  background: #e10092;
  font-family: volte_medium;
  width: 100%;
  cursor: pointer;
}

.back_arrow {
  width: 24px;
  height: 24px;
  margin-top: 16px;
  margin-left: 24px;
  margin-bottom: 16px;
  cursor: pointer;
}
.back_arrow img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 480px) {
  .confirm_delete_wrapper {
    width: 320px;
    margin-top: 36px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.account-container {
  display: flex;
  justify-content: center;
  color: white;
  flex-direction: column;
  align-items: center;
  margin-bottom: 100px;
}
.account-container .header-title {
  font-family: volte_reg;
  font-weight: bold;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
}
.account-container .account-detail-container {
  width: 640px;
  margin-top: 50px;
  border-radius: 10px;
  border: 1px solid #8e81a1;
  padding: 40px 16px 28px 16px; /* Add top padding for space */
  background-color: #efe8fb;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative; /* Make it a positioning reference for child elements */
  cursor: pointer;
}
.account-container .account-detail-container.rm-pointer {
  cursor: unset;
}
.account-container .header-logo {
  position: absolute;
  top: -30px; /* Move the image slightly above the box */
  left: 50%;
  transform: translateX(-50%); /* Center horizontally */
  border-radius: 50%;
  height: 52px;
  width: 52px;
}
.account-container .header-logo img {
  width: 100%;
  height: 100%;
}
.account-container .container-title {
  font-family: volte_medium;
  font-weight: bold !important;
  font-size: 24px;
  line-height: 120%;
  text-align: center;
  color: #220046;
}
.account-container .container-description {
  font-family: volte_medium;
  font-weight: bold;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  vertical-align: middle;
  color: #220046;
  padding-top: 16px;
}
.account-container .divider {
  margin: 20px 0px;
  width: 640px; /* Set width to 640px */
  border: 1px solid #564372; /* Border with width, style, and color */
}
.account-container .button-container {
  padding-top: 16px;
}
.account-container .button-container .subscribe-to-btn {
  width: 280px;
  height: 46px;
  min-width: 280px;
  border-radius: 4px;
  padding: 16px;
  background-color: #e10092;
  cursor: pointer;
  border: none !important;
  outline: none;
}
.account-container .button-container .subscribe-to-btn .button-text {
  font-family: volte_semiBold;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px;
  text-align: center;
  color: #ffffff;
}

@media only screen and (max-width: 480px) {
  .account-container {
    display: flex;
    justify-content: center;
    color: white;
    flex-direction: column;
    align-items: center;
    margin-bottom: 495px;
  }
  .account-container .header-title {
    font-size: 24px;
    margin-bottom: 20px;
  }
  .account-container .account-detail-container {
    width: 340px;
    margin-top: 29px;
    border: 1px solid #8e81a1;
    padding: 40px 16px 20px 16px; /* Add top padding for space */
  }
  .account-container .header-logo {
    position: absolute;
    top: -30px; /* Move the image slightly above the box */
    left: 50%;
    transform: translateX(-50%); /* Center horizontally */
    border-radius: 50%;
    height: 52px;
    width: 52px;
  }
  .account-container .container-title {
    font-size: 22px;
    vertical-align: middle;
  }
  .account-container .divider {
    width: 340px;
  }
  .account-container .container-description {
    font-size: 16px;
  }
  .account-container .button-container {
    padding-top: 16px;
  }
  .account-container .button-container .subscribe-to-btn {
    width: 180px;
    min-width: 120px;
  }
  .account-container .button-container .subscribe-to-btn .button-text {
    font-size: 16px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.overlap-hover {
  display: inline-block;
  right: 0;
  top: 0;
  position: relative;
}
.overlap-hover .crown-image {
  position: absolute;
  top: 10px !important;
  left: 10px !important;
  width: 24px !important;
  height: 24px !important;
}

.hover-popup {
  position: absolute;
  z-index: 100;
  width: 100%;
  transition: all linear 0.5s;
}
.hover-popup .playimage-image {
  width: 20px;
  height: 20px;
  position: static;
  margin: 0px 7px 0px 0px;
}
.hover-popup .border-line {
  border: 0.5px solid #564372;
  opacity: 0.5;
  margin: 10px 0px 7px 0px;
  background-color: #564372;
}
.hover-popup .set-title-tile {
  display: flex;
}
.hover-popup .dispay-none {
  display: none;
}
.hover-popup .popover {
  position: absolute;
  width: 100%;
  margin-top: -30px;
  left: 0px;
  z-index: 999999;
  background: #020005;
  border: 1px solid #564372;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.56);
  border-radius: 6px;
  overflow: hidden;
  padding-bottom: 10px;
}
.hover-popup .popover .info-header {
  display: flex;
  justify-content: space-between;
}
.hover-popup .popover .info-header h4 {
  cursor: pointer;
  font-size: 16px;
  font-family: volte_medium;
  color: #ffffff;
  line-height: normal;
}
.hover-popup .popover .info-header img {
  width: 18px;
  height: 15px;
  position: relative;
}
.hover-popup .popover .hr-line {
  width: 92%;
  margin: 8px 10px;
  height: 1px;
  background: #80829c;
}
.hover-popup .popover .image-top img {
  width: 100%;
  position: relative;
  min-height: 122px;
}
.hover-popup .popover .share-icon {
  cursor: pointer;
  color: #80829c;
  float: left;
  padding: 5px 10px;
}
.hover-popup .popover .add-to-binge {
  cursor: pointer;
  color: #80829c;
  float: right;
  padding: 5px 10px;
}
.hover-popup .popover .info-section {
  padding: 7px 20px 12px 12px;
}
.hover-popup .popover .info-section .age-group {
  display: inline-block;
  border: 2px solid #80829c;
  text-align: center;
  border-radius: 4px;
  padding: 3px !important;
  margin-right: 5px;
}
.hover-popup .popover .info-section h4 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 0;
  width: 90%;
}
.hover-popup .popover .info-section p {
  color: #80829c;
  padding: 5px 0px !important;
  height: 32px;
  font-size: 14px;
  font-weight: 800;
}
.hover-popup .popover .info-section .pop-info {
  padding: 6px 0px;
  padding-top: 0px;
}
.hover-popup .popover .info-section .pop-info span {
  color: #80829c;
  display: inline-block;
  padding-right: 10px;
  font-size: 12px;
  font-family: volte_medium;
}
.hover-popup .popover .info-section .pop-info span.age-resptriction {
  border: 1px solid #a3a6c2;
  border-radius: 4px;
  padding: 2px 6px;
  margin-right: 5px;
  font-size: 12px;
}
.hover-popup .popover .description {
  color: #a3a6c2;
  font-size: 12px;
  line-height: 120%;
}
.hover-popup .popover .line-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hover-popup .popover .footer-section {
  position: relative;
  display: flex;
  justify-content: space-between;
  top: 10px;
  z-index: 2;
}
.hover-popup .popover .footer-section i,
.hover-popup .popover .footer-section .icon-share ::before {
  font-size: 12px;
  padding-right: 2px;
  color: #c4c4c4 !important;
}
.hover-popup .popover .footer-section i .textBlock,
.hover-popup .popover .footer-section .icon-share ::before .textBlock {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 10px;
  line-height: 120%;
  align-self: baseline;
}
.hover-popup .popover .footer-section > div {
  display: flex;
  font-size: 10px;
  cursor: pointer;
}
.hover-popup .popover .footer-section .listing-portrait_footer_section {
  left: -7px !important;
}
.hover-popup .popover .footer-section .imagesBlock {
  height: 19px;
  width: 19px;
}
.hover-popup .popover .footer-section .textBlock {
  font-family: volte_medium;
  color: #ffffff;
  padding-left: 5px;
  margin-top: 2px;
}
.hover-popup .popover .landscape-container {
  background-color: red;
}
.hover-popup .listing-top_portrait {
  width: 80%;
  right: 0px;
  z-index: 10000;
  left: unset;
  border-radius: 8px;
  bottom: -35px;
  margin-right: 8px;
}
.hover-popup .listing-top_portrait .line-clamp {
  width: 190px;
}
.hover-popup .listing-top_portrait .image-top img {
  height: 310px;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section {
  padding: 7px 8px 13.81px 8px;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .info-header h4 {
  font-size: 14px;
  width: 92%;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .pop-info {
  padding: 0;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .pop-info .genre {
  color: #ffffff;
  font-size: 12px;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .listing-top_portrait_footer_section .movieButtonContainer i {
  font-size: 9px;
  width: unset;
  height: unset;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .listing-top_portrait_footer_section .movieButtonContainer .textBlock {
  font-size: 10px;
  margin-top: 1px;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .listing-top_portrait_footer_section .icon-share2 {
  width: unset;
  height: unset;
  margin-right: 0;
}
.hover-popup .listing-top_portrait .listing-top_portrait_info-section .listing-top_portrait_footer_section .icon-share2 .textBlock {
  font-size: 10px;
}
.hover-popup .top-ten-image {
  position: absolute;
  bottom: -1.9px;
  right: -50%;
  height: auto;
  width: inherit;
}
.hover-popup .top-ten-image img {
  width: auto;
  height: auto;
  position: relative;
}
.hover-popup .top-ten-image.ten-img {
  right: -12% !important;
}
.hover-popup .listing-landscape-container {
  margin-left: -8px;
  margin-top: -175px;
}
.hover-popup .listing-landscape-container .image-top img {
  height: 150px;
}
.hover-popup .icon-Binge-list-added:before {
  content: "\e992";
  color: #e10092 !important;
  font-size: 12px;
}
.hover-popup .icon-check:before {
  color: #ffffff !important;
}
.hover-popup .icon-share2 {
  margin-right: 10px;
}
.hover-popup .icon-share:before {
  content: "\e949";
  color: #c4c4c4 !important;
  font-size: 12px;
}
.hover-popup .icon-Binge-list::before {
  color: #ffffff !important;
}
.hover-popup .icon-Binge-list:before {
  color: #fff !important;
  font-size: 12px;
}
.hover-popup i.imagesBlock {
  font-size: 12px;
}
.hover-popup .season-hover {
  margin-top: -136px;
}
.hover-popup .broken-image {
  visibility: hidden;
}
.hover-popup .language-hover {
  width: 218px;
  height: 151.65px;
  margin-top: -120px;
  margin-left: -12px;
  border-radius: 15.8293px;
}
.hover-popup .genre-hover {
  margin-top: -102px;
  width: 154px;
  height: 130px;
  margin-left: -7px;
  border: 2.32143px solid #8E81A1;
  background: #564372;
  border-radius: 15.5714px;
  padding: 0;
}
.hover-popup .genre-hover .genre-action-image {
  display: flex;
  justify-content: center;
}
.hover-popup .genre-hover .genre-action-image.image-handling img {
  max-width: 97px;
  max-height: 44px;
}
.hover-popup .genre-hover .genre-action-image img {
  max-width: 50px;
  max-height: 42px;
  position: absolute;
  top: 26.5%;
}
.hover-popup .genre-hover .genre-item-title {
  position: absolute;
  font-family: volte_medium;
  line-height: 1.25;
  letter-spacing: normal;
  color: #ffffff;
  font-family: "sky_reg";
}
.hover-popup .genre-hover .genre-item-title.isGenre {
  font-size: 20px;
  bottom: 28px;
  width: 100%;
}
.hover-popup .genre-hover .genre-item-title.isGenre h1 {
  font-size: 20px;
  bottom: 28px;
  width: 100%;
}
.hover-popup .genre-hover .image-top {
  width: 100%;
  height: 100%;
}
.hover-popup .genre-hover img {
  height: 100%;
}
.hover-popup .binge-channel-square-hover {
  margin-top: -96px;
  margin-left: -14px;
  width: 120px;
  height: 120px;
  border-radius: 6px;
  background: transparent;
}
.hover-popup .binge-channel-square-hover .image-top {
  width: 100%;
  height: 100%;
}
.hover-popup .binge-channel-square-hover img {
  max-width: 120px;
  max-height: 120px;
}
.hover-popup .background-banner-hover {
  width: 220px;
  height: 204px;
  margin-top: -142px;
  margin-left: -10px;
}
.hover-popup .background-banner-hover .image-top img {
  height: 111px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

section.page-header {
  background: #fff;
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}
section.page-header .category-header {
  display: flex;
  align-items: center;
}
section.page-header .category-header .icon-contr {
  display: flex;
  color: #ffffff;
  align-items: center;
  margin-right: 10px;
  width: 25px;
  cursor: pointer;
}
section.page-header .category-header .icon-contr img {
  max-width: 100%;
}
section.page-header .category-header .img-contr {
  height: 30px;
  width: 30px;
  display: flex;
  margin-right: 10px;
  background: #594074 !important;
  padding: 7px;
  border-radius: 50%;
}
section.page-header .category-header .text-contr {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 15px);
  font-size: 28px;
  font-family: volte_medium;
  padding-top: 3px;
}
section.page-header .category-header .icon-video-icon:before {
  font-size: 11px;
  top: -1.5px;
  position: relative;
}
@media screen and (max-width: 768px) {
  section.page-header .category-header .text-contr {
    font-size: 20px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.child-container-popup .popupSec {
  position: relative;
  border-radius: 20px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  overflow-y: auto;
  width: 640px;
  height: auto;
}
.child-container-popup .modal-body {
  padding: 30px 60px;
}
.child-container-popup .modal-container {
  display: flex;
  justify-content: center;
  color: white;
  flex-direction: column;
  align-items: center;
}
.child-container-popup .modal-container .header-title {
  padding-top: 12px;
  font-family: volte_medium;
  font-weight: 500;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
}
.child-container-popup .modal-container .sub-title {
  font-family: volte_medium;
  font-weight: 500;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  color: #d6c6f4;
  padding-top: 12px;
}
.child-container-popup .modal-container .account-detail-container {
  width: 640px;
  margin-top: 50px;
  border-radius: 10px;
  border: 1px solid #8e81a1;
  padding: 50px 16px 28px 16px; /* Add top padding for space */
  background-color: #efe8fb;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative; /* Make it a positioning reference for child elements */
}
.child-container-popup .modal-container .header-logo {
  border-radius: 50%;
  height: 52px;
  width: 52px;
}
.child-container-popup .modal-container .header-logo img {
  width: 100%;
  height: 100%;
}
.child-container-popup .modal-container .container-title {
  font-family: volte_semiBold;
  font-weight: 500;
  font-size: 24px;
  line-height: 120%;
  text-align: center;
  color: #220046;
}
.child-container-popup .modal-container .container-description {
  font-family: volte_medium;
  font-weight: 500;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  vertical-align: middle;
  color: #220046;
  padding-top: 16px;
}
.child-container-popup .modal-container .divider {
  margin: 20px 0px;
  width: 640px; /* Set width to 640px */
  border: 1px solid #564372; /* Border with width, style, and color */
}
.child-container-popup .modal-container .button-container {
  padding: 20px 0px;
}
.child-container-popup .modal-container .button-container .btn {
  margin: 0;
}
.child-container-popup .modal-container .button-container .subscribe-to-btn {
  width: 280px;
  height: 46px;
  min-width: 280px;
  border-radius: 4px;
  padding: 16px;
  background-color: #e10092;
  cursor: pointer;
  border: none !important;
  outline: none;
}
.child-container-popup .modal-container .button-container .subscribe-to-btn .button-text {
  font-family: volte_semiBold;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px;
  text-align: center;
  color: #ffffff;
}
.child-container-popup .modal-container .cancel-class {
  font-family: volte_semiBold;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  vertical-align: middle;
  color: #f3cbe3;
  cursor: pointer;
}

.explore-container-popup .modal-body {
  padding: 30px 60px;
}
.explore-container-popup .explore-header-logo {
  position: absolute;
  left: 50%;
  top: 28%;
  z-index: 100;
  transform: translateX(-50%); /* Center horizontally */
  border-radius: 50%;
  height: 80px; /* Fixed height */
  width: 80px; /* Fixed width */
  display: flex;
  justify-content: center;
  align-items: center;
}
.explore-container-popup .explore-header-logo img {
  width: 100%; /* Makes image take 80% of container width */
  height: 100%; /* Makes image take 80% of container height */
  object-fit: contain; /* Ensures the image is fully visible */
  border-radius: 50%; /* Ensures it remains circular */
}
.explore-container-popup .account-details-bg {
  position: relative;
  border-radius: 20px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  overflow-y: auto;
  width: 640px;
  height: auto;
}
.explore-container-popup .account-details-bg:before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 20px;
  padding: 2px;
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: destination-out;
  mask-composite: exclude;
  z-index: -1;
}
.explore-container-popup .explore-container {
  display: flex;
  justify-content: center;
  color: white;
  flex-direction: column;
  align-items: center;
}
.explore-container-popup .explore-container .header-title {
  font-family: volte_semiBold;
  font-weight: 500;
  font-size: 24px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.explore-container-popup .explore-container .sub-title {
  padding-top: 12px;
  font-family: volte_medium;
  font-weight: 500;
  font-size: 18px;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  color: #ffffff;
}
.explore-container-popup .explore-container .account-detail-container {
  width: 640px;
  margin-top: 50px;
  border-radius: 10px;
  border: 1px solid #8e81a1;
  padding: 50px 16px 28px 16px; /* Add top padding for space */
  background-color: #efe8fb;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative; /* Make it a positioning reference for child elements */
}
.explore-container-popup .explore-container .container-title {
  font-family: volte_semiBold;
  font-weight: 500;
  font-size: 24px;
  line-height: 120%;
  text-align: center;
  color: #220046;
}
.explore-container-popup .explore-container .container-description {
  font-family: volte_medium;
  font-weight: 500;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  vertical-align: middle;
  color: #220046;
  padding-top: 16px;
}
.explore-container-popup .explore-container .button-container {
  padding-top: 20px;
}
.explore-container-popup .explore-container .button-container .subscribe-to-btn {
  width: 280px;
  border-radius: 4px;
  padding: 16px;
  background-color: #e10092;
  cursor: pointer;
  border: none !important;
  outline: none;
  margin-bottom: 0;
}
.explore-container-popup .explore-container .button-container .subscribe-to-btn .button-text {
  font-family: volte_semiBold;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 19px;
  text-align: center;
  color: #ffffff;
}

@media only screen and (max-width: 480px) {
  .child-container-popup .popupSec {
    width: 320px !important;
  }
  .child-container-popup .modal-body {
    padding: 30px 20px;
  }
  .child-container-popup .modal-container {
    display: flex;
    justify-content: center;
    color: white;
    flex-direction: column;
    align-items: center;
    height: 100%;
  }
  .child-container-popup .modal-container .header-title {
    font-size: 22px;
    padding-top: 10px;
  }
  .child-container-popup .modal-container .sub-title {
    width: 280px;
    font-size: 16px;
    padding: 0px;
    padding-top: 10px !important;
  }
  .child-container-popup .modal-container .account-detail-container {
    width: 340px;
    margin-top: 29px;
    border: 1px solid #8e81a1;
    padding: 40px 16px 20px 16px; /* Add top padding for space */
  }
  .child-container-popup .modal-container .container-title {
    font-size: 22px;
    vertical-align: middle;
  }
  .child-container-popup .modal-container .cancel-class {
    font-size: 16px;
  }
  .child-container-popup .modal-container .container-description {
    font-size: 16px;
  }
  .child-container-popup .modal-container .button-container {
    padding-top: 20px;
  }
  .child-container-popup .modal-container .button-container .subscribe-to-btn {
    width: 280px;
    min-width: 120px;
  }
  .child-container-popup .modal-container .button-container .subscribe-to-btn .button-text {
    line-height: "120%";
  }
  .explore-container-popup .explore-header-logo {
    top: 31%;
    height: 80px;
    width: 80px;
  }
  .explore-container-popup .account-details-bg {
    width: 320px !important;
  }
  .explore-container-popup .account-details-bg:before {
    padding: 2px;
  }
  .explore-container-popup .explore-container {
    display: flex;
    justify-content: center;
    color: white;
    flex-direction: column;
    align-items: center;
  }
  .explore-container-popup .explore-container .header-title {
    width: 280px !important;
    font-size: 18px;
  }
  .explore-container-popup .explore-container .sub-title {
    width: 280px !important;
    font-size: 14px;
    padding-top: 10px;
  }
  .explore-container-popup .explore-container .account-detail-container {
    width: 640px;
    margin-top: 50px;
    border-radius: 10px;
    border: 1px solid #8e81a1;
    padding: 50px 16px 28px 16px; /* Add top padding for space */
    background-color: #efe8fb;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative; /* Make it a positioning reference for child elements */
  }
  .explore-container-popup .explore-container .container-title {
    font-family: volte_semiBold;
    font-weight: 500;
    font-size: 24px;
    line-height: 120%;
    text-align: center;
    color: #220046;
  }
  .explore-container-popup .explore-container .container-description {
    font-family: volte_medium;
    font-weight: 500;
    font-size: 18px;
    line-height: 120%;
    text-align: center;
    vertical-align: middle;
    color: #220046;
    padding-top: 16px;
  }
  .explore-container-popup .explore-container .button-container {
    padding-top: 20px;
  }
  .explore-container-popup .explore-container .button-container .subscribe-to-btn {
    width: 160px !important;
    border-radius: 4px;
    padding: 0px;
    height: 46px;
    background-color: #e10092;
    cursor: pointer;
    border: none !important;
    outline: none;
  }
  .explore-container-popup .explore-container .button-container .subscribe-to-btn .button-text {
    font-family: volte_semiBold;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 19px;
    text-align: center;
    color: #ffffff;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.account-container {
  display: flex;
  justify-content: center;
  color: white;
  flex-direction: column;
  align-items: center;
  margin-bottom: 100px;
  gap: 20px;
}
.account-container .account-detail-container {
  width: 640px;
  border-radius: 10px;
  border: 1px solid #8e81a1;
  box-shadow: 0px 2px 2px rgba(255, 255, 255, 0.32);
  margin-top: 30px;
  padding: 40px 16px 28px 16px;
  gap: 16px;
  background-color: #efe8fb;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  cursor: pointer;
}
.account-container .account-detail-container.rm-pointer {
  cursor: unset;
}
.account-container .header-logo {
  position: absolute;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
  height: 52px;
  width: 52px;
}
.account-container .header-logo img {
  width: 100%;
  height: 100%;
}
.account-container .container-description {
  font-family: volte_medium;
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  vertical-align: middle;
  color: #220046;
  padding-top: unset;
}
.account-container .divider {
  width: 640px;
  border: 1px solid #564372;
  margin: unset;
}
.account-container .button-container {
  padding-top: unset;
}
.account-container .button-container .subscribe-to-btn {
  width: 280px;
  height: 46px;
  min-width: 280px;
  border-radius: 4px;
  padding: 16px;
  background-color: #e10092;
  cursor: pointer;
  border: none !important;
  outline: none;
  margin: unset;
}
.account-container .button-container .subscribe-to-btn .button-text {
  font-family: volte_semiBold;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
  text-align: center;
  color: #ffffff;
}

@media only screen and (max-width: 480px) {
  .account-container {
    margin-bottom: 495px;
    padding: 12px 10px;
    gap: 24px;
  }
  .account-container .account-detail-container {
    width: calc(100vw - 20px);
    max-width: 340px;
    height: 156px;
    margin-top: 29px;
    border: 1px solid #8e81a1;
    padding: 40px 16px 20px;
    gap: 12px;
  }
  .account-container .header-logo {
    position: absolute;
    top: -29px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 50%;
    height: 52px;
    width: 52px;
  }
  .account-container .divider {
    margin: unset;
    width: calc(100vw - 20px);
    max-width: 340px;
  }
  .account-container .container-description {
    width: calc(100vw - 52px);
    max-width: 308px;
    height: 38px;
    font-size: 16px;
    padding-top: unset;
  }
  .account-container .button-container {
    padding-top: unset;
  }
  .account-container .button-container .subscribe-to-btn {
    width: 180px;
    min-width: 120px;
    height: 46px;
  }
  .account-container .button-container .subscribe-to-btn .button-text {
    width: 56px;
    height: 10px;
    font-size: 16px;
    line-height: 19px;
  }
}
@media only screen and (min-width: 481px) and (max-width: 768px) {
  .account-container {
    padding: 0px;
    gap: 20px;
  }
  .account-container .account-detail-container {
    width: calc(100vw - 128px);
    max-width: 640px;
    height: 152px;
    padding: 40px 16px 28px;
    gap: 16px;
    margin-top: 30px;
  }
  .account-container .divider {
    margin: unset;
    width: calc(100vw - 128px);
    max-width: 640px;
  }
  .account-container .container-description {
    width: calc(100vw - 160px);
    max-width: 608px;
    min-height: 22px;
    font-size: 18px;
    padding-top: unset;
  }
  .account-container .button-container {
    padding-top: unset;
  }
  .account-container .button-container .subscribe-to-btn {
    width: 280px;
    min-width: 280px;
    height: 46px;
  }
  .account-container .button-container .subscribe-to-btn .button-text {
    width: 56px;
    height: 13px;
    font-size: 20px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.cancel-page-slider-container {
  margin-top: 40px;
}
.cancel-page-slider-container .listing-wrapper .slick-list {
  padding-left: 7px !important;
}
.cancel-page-slider-container .listing-wrapper.first-card .slick-track {
  margin-left: 26px;
}
.cancel-page-slider-container .listing-wrapper.isFirst .slick-track {
  margin-left: -26px;
}
.cancel-page-slider-container .listing-wrapper .slick-track {
  padding-left: 0px;
}
.cancel-page-slider-container .listing-wrapper .slick-slide {
  width: 274px;
}
.cancel-page-slider-container .listing-wrapper .rails-container {
  width: 260px;
  height: 390px;
  position: relative;
}
.cancel-page-slider-container .listing-wrapper .rails-container .provider-block {
  width: 28px;
  height: 28px;
  position: absolute;
  border: 0.6px solid #564372;
  right: 8px;
  top: 8px;
  border-radius: 2.4px;
}
.cancel-page-slider-container .listing-wrapper .rails-container .provider-block img {
  width: 100%;
  height: 100%;
  position: unset;
}
.cancel-page-slider-container .listing-wrapper .rails-container .poster-image img {
  width: 100%;
  height: 100%;
  position: unset;
  border-radius: 8px;
}
.cancel-page-slider-container .listing-wrapper .slick-slide:not(.slick-center) {
  position: relative;
  top: 39px;
}
.cancel-page-slider-container .listing-wrapper .slick-center {
  width: 326px;
  height: 468px;
}
.cancel-page-slider-container .listing-wrapper .slick-center .rails-container {
  width: 312px;
}
.cancel-page-slider-container .listing-wrapper .slick-center .rails-container .provider-block {
  right: 9.6px;
  top: 9.6px;
  width: 33.6px;
  height: 33.6px;
}
.cancel-page-slider-container .listing-wrapper .slick-center .rails-container .poster-image img {
  border-radius: 9.6px;
}
.cancel-page-slider-container .listing-wrapper .hb-slick-dots {
  width: 75px;
}
.cancel-page-slider-container .listing-wrapper .hb-slick-dots ul {
  padding: 0;
  display: flex;
  transition: all 0.32s;
  position: relative;
  margin: 0px;
  align-items: baseline;
  margin-top: 24px;
}
.cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li {
  position: relative;
  display: flex;
  align-items: center;
  width: 8px;
  height: 8px;
  margin: 0 3px;
  padding: 0;
  transition: all 0.32s;
}
.cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 6px;
  height: 6px;
  padding: 0px;
  color: transparent;
  border: 0;
  outline: 0;
  background: 0 0;
  background: #8E81A1;
  width: 6px;
  height: 6px;
  border-radius: 100%;
}
.cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li.slick-active button {
  background: #F4F2F5;
  width: 8px;
  height: 8px;
  border-radius: 100%;
}
.cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li.small button {
  width: 4px;
  height: 4px;
  border-radius: 100%;
}

@media only screen and (max-width: 480px) {
  .cancel-page-slider-container {
    margin-top: 40px;
  }
  .cancel-page-slider-container .listing-wrapper .slick-list {
    padding-left: 5px !important;
  }
  .cancel-page-slider-container .listing-wrapper.first-card .slick-track {
    margin-left: 8px;
  }
  .cancel-page-slider-container .listing-wrapper.isFirst .slick-track {
    margin-left: -8px;
  }
  .cancel-page-slider-container .listing-wrapper .slick-slide {
    width: auto;
  }
  .cancel-page-slider-container .listing-wrapper .rails-container {
    width: 100%;
    height: 100%;
    position: relative;
  }
  .cancel-page-slider-container .listing-wrapper .rails-container .provider-block {
    width: 16px;
    height: 16px;
    position: absolute;
    border: 0.5px solid #564372;
    right: 8px;
    top: 8px;
    border-radius: 2px;
  }
  .cancel-page-slider-container .listing-wrapper .rails-container .provider-block img {
    width: 100%;
    height: 100%;
    position: unset;
  }
  .cancel-page-slider-container .listing-wrapper .rails-container .poster-image {
    width: 100%;
    height: calc(100% - 63px);
  }
  .cancel-page-slider-container .listing-wrapper .rails-container .poster-image img {
    width: 100%;
    height: 100%;
    position: unset;
    border-radius: 6px;
  }
  .cancel-page-slider-container .listing-wrapper .slick-slide:not(.slick-center) {
    position: relative;
    top: 31.5px;
  }
  .cancel-page-slider-container .listing-wrapper .slick-center {
    width: inherit;
    height: inherit;
  }
  .cancel-page-slider-container .listing-wrapper .slick-center .rails-container {
    width: 312px;
    margin: 0 14px;
  }
  .cancel-page-slider-container .listing-wrapper .slick-center .rails-container .provider-block {
    right: 8px;
    top: 8px;
    width: 16px;
    height: 16px;
  }
  .cancel-page-slider-container .listing-wrapper .slick-center .rails-container .poster-image {
    height: 100%;
  }
  .cancel-page-slider-container .listing-wrapper .slick-center .rails-container .poster-image img {
    border-radius: 9.6px;
  }
  .cancel-page-slider-container .listing-wrapper .hb-slick-dots {
    width: 75px;
  }
  .cancel-page-slider-container .listing-wrapper .hb-slick-dots ul {
    padding: 0;
    display: flex;
    transition: all 0.32s;
    position: relative;
    margin: 0px;
    align-items: baseline;
    margin-top: 24px;
  }
  .cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li {
    position: relative;
    display: flex;
    align-items: center;
    width: 8px;
    height: 8px;
    margin: 0 3px;
    padding: 0;
    transition: all 0.32s;
  }
  .cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li button {
    font-size: 0;
    line-height: 0;
    display: block;
    width: 6px;
    height: 6px;
    padding: 0px;
    color: transparent;
    border: 0;
    outline: 0;
    background: 0 0;
    background: #8E81A1;
    width: 6px;
    height: 6px;
    border-radius: 100%;
  }
  .cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li.slick-active button {
    background: #F4F2F5;
    width: 8px;
    height: 8px;
    border-radius: 100%;
  }
  .cancel-page-slider-container .listing-wrapper .hb-slick-dots ul li.small button {
    width: 4px;
    height: 4px;
    border-radius: 100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.pack-listing-container {
  position: relative;
}
.pack-listing-container .login-msg {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  cursor: pointer;
  text-align: end;
  color: #f3cbe3;
  margin-bottom: 16px;
  margin-right: -11%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 420px;
  padding-right: 10px;
}
.pack-listing-container .login-msg span {
  padding-right: 11px;
}
.pack-listing-container .add-free-gaming {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  padding: 10px 0px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  display: flex;
  justify-content: center;
  width: 420px;
  align-items: center;
  margin: 12px auto;
}
.pack-listing-container .add-free-gaming span {
  margin-left: 10px;
}
.pack-listing-container .pack-listing-title {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  margin: 20px 0;
}
@media only screen and (min-width: 320px) and (max-width: 768px) {
  .pack-listing-container .pack-listing-title {
    font-size: 22px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 326px) {
  .pack-listing-container .pack-listing-title {
    font-size: 20px;
  }
}
.pack-listing-container ul.current-plan-exist {
  padding-top: 10px;
  position: relative;
}
.pack-listing-container ul.current-plan-exist li {
  position: relative;
}
.pack-listing-container ul.current-plan-exist li .pack-listing .pack-bottom .disabled-plan {
  background-color: #8e81a1;
}
.pack-listing-container ul.pack-block {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  margin: 0 auto;
}
.pack-listing-container ul.pack-block .pack-block-wrapper {
  width: 420px;
  position: relative;
}
.pack-listing-container ul.pack-block .pack-block-wrapper .plan-container .device-details .mobile-wrapper {
  padding-left: 4px;
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
  .pack-listing-container ul.pack-block .pack-block-wrapper {
    width: 420px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .pack-listing-container ul.pack-block .pack-block-wrapper {
    width: 420px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1280px) {
  .pack-listing-container ul.pack-block .pack-block-wrapper {
    width: 420px;
  }
}
.pack-listing-container ul.pack-block .pack-block-wrapper .bottom-shadow {
  position: absolute;
  height: 43px;
  left: 0px;
  bottom: 85px;
  width: 100%;
  background: linear-gradient(180deg, rgba(2, 0, 5, 0) 0%, #020005 100%);
  z-index: 59;
}
.pack-listing-container ul.pack-block .pack-block-wrapper li {
  margin-bottom: 10px;
}
.pack-listing-container ul.pack-block .pack-block-wrapper li.mb-top {
  margin-top: 7%;
}
@media only screen and (min-width: 360px) and (max-width: 480px) {
  .pack-listing-container ul.pack-block .pack-block-wrapper .plan-container .partner-container {
    width: 300px;
  }
}
.pack-listing-container ul.pack-block .pack-block-wrapper .plan-container .partner-container > * {
  margin-bottom: 12px;
}
.pack-listing-container ul.pack-block .btn-wrapper {
  border: none;
  width: 100%;
  margin: 0;
  margin-top: 20px;
  margin-bottom: 30px;
}
.pack-listing-container ul.pack-block .btn-wrapper[disabled] {
  background: #8e81a1;
  cursor: not-allowed;
  border: none;
}
.pack-listing-container ul.pack-block .btn-wrapper[disabled]:hover {
  box-shadow: none;
}
.pack-listing-container ul.pack-block .overlay-shadow {
  display: none;
}
.pack-listing-container ul.pack-block li .pack-listing {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 20px 25px;
  position: static;
  width: 310px;
  height: 574px;
  left: 0px;
  top: 0px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  mix-blend-mode: normal;
  /* FTV CTA */
  border: 1px solid #564372;
  box-sizing: border-box;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 20px;
  /* Inside Auto Layout */
  flex: none;
  order: 0;
  flex-grow: 0;
  margin: 0px 10px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .hr {
  border-bottom: 0.5px solid #564372;
  opacity: 0.5;
  width: 100%;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-head {
  padding-bottom: 10px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-head p {
  width: 100%;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-head p span:first-child {
  font-size: 16px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: left;
  color: #ffffff;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-head p span:first-child:before {
  content: "";
  background-image: url(/d012b19f863808e37f8d0b99a7b43e83.svg);
  display: inline-block;
  margin-right: 10px;
  width: 24px;
  height: 24px;
  margin-bottom: -8px;
  background-size: cover;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-head p span:last-child {
  font-family: volte_reg;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: right;
  float: right;
  color: #ffffff;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body {
  padding-top: 10px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body .top-parnters {
  height: 116px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body p:first-child {
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 100%;
  letter-spacing: -0.5px;
  text-align: center;
  color: #ffffff;
  margin-bottom: 5px;
  font-family: volte_reg;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body p.premium-partner-head {
  font-family: volte_reg;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: center;
  color: #ffffff;
  margin-top: 25px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body ul.app-listing {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
  position: relative;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body ul.app-listing li img {
  height: 35.56px;
  width: 35.7px;
  left: 2.2px;
  top: 2.2px;
  border-radius: 0px;
  margin: 5px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-top .pack-body ul.app-listing.not-included {
  opacity: 0.4;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-bottom {
  text-align: center;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-bottom .pack-amount {
  font-family: volte_reg;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: center;
  color: white;
  margin-bottom: 15px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-bottom .pack-amount span:first-child {
  margin-right: -3px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-bottom .footer-message {
  font-family: volte_reg;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  letter-spacing: 0px;
  text-align: center;
  color: #d7c6f4;
  height: 30px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-bottom .sun-text-message {
  margin-top: 10px;
}
.pack-listing-container ul.pack-block li .pack-listing .pack-bottom .primary-btn {
  width: 240px;
  margin-right: 0;
}
.pack-listing-container ul.pack-block li .pack-listing .suntext-pack-bottom {
  margin-bottom: 38px;
}
.pack-listing-container ul.pack-block li .pack-listing:hover {
  cursor: pointer;
  border: 1px solid #ffffff;
}
.pack-listing-container .compare-plan {
  margin: 20px 20px;
  text-align: center;
  font-family: volte_reg;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0px;
  color: #f3cbe3;
  cursor: pointer;
  position: relative;
  padding-bottom: 50px;
}
.pack-listing-container .preemium-text {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

@media only screen and (max-width: 480px) {
  .pack-listing-container .login-msg {
    width: 100%;
    margin-top: 0;
    padding-top: 10px;
    padding-right: 24px;
    overscroll-behavior: contain;
  }
  .pack-listing-container .add-free-gaming {
    font-weight: 600;
    font-size: 14px;
    line-height: 120%;
    width: 100%;
  }
  .pack-listing-container .scrollable {
    height: 70vh;
    overflow-y: scroll;
    padding-right: 7px;
  }
  .pack-listing-container .scrollable::-webkit-scrollbar {
    width: 4px;
    height: 10px;
    min-height: 20px;
    padding-left: 10px;
    cursor: pointer;
  }
  .pack-listing-container .scrollable::-webkit-scrollbar-button {
    height: 10px;
  }
  .pack-listing-container .scrollable::-webkit-scrollbar-thumb {
    background: #f3cbe3;
    border-radius: 6px;
    width: 4px;
  }
  .pack-listing-container .scrollable::-webkit-scrollbar-track {
    box-shadow: none;
    border-radius: 5px;
  }
  .pack-listing-container ul.pack-block .pack-block-wrapper {
    width: 100%;
    padding-left: 20px;
    padding-right: 7px;
  }
  .pack-listing-container ul.pack-block .pack-block-wrapper li {
    margin-bottom: 20px;
  }
  .pack-listing-container ul.pack-block .pack-block-wrapper li.mb-top {
    margin-top: 9%;
  }
  .pack-listing-container ul.pack-block .pack-block-wrapper li:last-child {
    margin-bottom: 0;
  }
  .pack-listing-container ul.pack-block .btn-wrapper {
    position: sticky;
    bottom: 25px;
    margin-bottom: 0;
    width: 97%;
  }
  .pack-listing-container .bottom-shadow {
    display: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.pack-wrapper {
  margin-right: 20px;
  border-radius: 10px;
  border: 2px solid #564372;
}
.pack-wrapper:hover {
  border: 2px solid #fff;
  cursor: pointer;
}
.pack-wrapper.selected-plan {
  border: 2px solid #e10092;
  border-radius: 10px;
  background-origin: border-box;
  background-clip: content-box, border-box;
}
.pack-wrapper.selected-plan.higher-plan {
  background: linear-gradient(339.81deg, #220046 59.34%, #E10092 134.97%);
  border: 2px solid #564372;
}
.pack-wrapper.selected-plan.higher-plan:hover {
  border: 2px solid #564372;
}
.pack-wrapper.selected-plan:hover {
  border: 2px solid #e10092;
}
.pack-wrapper .pack-availability {
  width: 200px;
  border-radius: 10px;
}
.pack-wrapper .pack-availability .hr {
  border-bottom: 0.5px solid #564372;
  opacity: 0.5;
}
.pack-wrapper .pack-availability .hr:last-child {
  border-bottom: 0px;
}
.pack-wrapper .pack-availability li {
  text-align: center;
  height: 63.5px;
}
.pack-wrapper .pack-availability li:first-child {
  height: 150px;
}
.pack-wrapper .pack-availability li:first-child .checked-item {
  padding-top: 0;
}
.pack-wrapper .pack-availability li:last-child {
  border-bottom: none;
}
.pack-wrapper .pack-availability li .pack-detail {
  display: flex;
  flex-direction: column;
  padding-top: 14px;
  padding-bottom: 25px;
}
.pack-wrapper .pack-availability li .pack-detail span {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 120%;
  color: #ffffff;
}
.pack-wrapper .pack-availability li .pack-detail .pack-amount {
  margin-top: 7px;
}
.pack-wrapper .pack-availability li .pack-detail .crown-icon {
  width: 24px;
  height: 24px;
}
.pack-wrapper .pack-availability li .preemium-text {
  line-height: 100% !important;
}
.pack-wrapper .pack-availability li .preemium-text span {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.pack-wrapper .pack-availability li .checked-item {
  padding: 25px 0;
}
.pack-wrapper .pack-availability li .checked-item i {
  font-size: 13px;
}
.pack-wrapper .pack-availability li .checked-item i:before {
  color: #c4c4c4;
}
.pack-wrapper .pack-availability li .sun-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 0;
}
.pack-wrapper .pack-availability li .sun-text i {
  margin-bottom: 10px;
}
.pack-wrapper .pack-availability li .sun-text span {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 11px;
  line-height: 120%;
  color: #ffffff;
}
.pack-wrapper .pack-availability .last-pack-item {
  height: 192px;
}
.pack-wrapper .pack-availability .last-pack-item .checked-item {
  height: 63px;
  border-bottom: 0.5px solid #3e4054;
}
.pack-wrapper .pack-availability .last-pack-item .pack-footer-detail {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 12px;
  line-height: 120%;
  color: #d6c6f4;
  text-align: center;
}
.pack-wrapper .pack-availability .last-pack-item .pack-footer-detail div {
  height: 63px;
  padding: 25px 0;
}
.pack-wrapper .pack-availability .last-pack-item .pack-footer-detail .hr {
  height: 0px;
  padding: 0px;
}

@media only screen and (max-width: 480px) {
  .pack-wrapper {
    margin-right: 10px;
  }
  .pack-wrapper:hover {
    border: 2px solid #564372;
    cursor: pointer;
  }
  .pack-availability {
    width: 110px !important;
  }
  .pack-availability li .sun-text span {
    font-size: 9px !important;
    letter-spacing: -0.1px !important;
    margin: 2px;
  }
  .pack-availability .pack-footer-detail {
    font-size: 9px;
    text-align: left;
  }
  .pack-availability .pack-footer-detail span {
    font-size: 9px;
    line-height: 10.8px;
    letter-spacing: -0.1px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.compare-plan-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
}
.compare-plan-container .compare-plan-title {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  color: #ffffff;
  margin-bottom: 30px;
  margin-top: 10px;
}
.compare-plan-container .compare-plan-listing {
  display: flex;
  justify-content: center;
  width: 72%;
  margin: auto;
}
.compare-plan-container .compare-plan-listing .arrow-nav {
  display: flex;
  align-items: center;
  height: 100vh;
}
.compare-plan-container .compare-plan-listing .arrow-nav .icon-Path::before {
  color: #f3cbe3;
  font-size: 20px;
}
.compare-plan-container .compare-plan-listing .provider-list {
  margin-right: 25px;
}
.compare-plan-container .compare-plan-listing .provider-list .list {
  position: absolute;
  top: 4.15em;
  display: block;
}
.compare-plan-container .compare-plan-listing .provider-list .list div {
  color: #ffffff;
  width: 90px;
  height: 64px;
  font-family: volte_medium;
  font-weight: 500;
  font-size: 14px;
  padding-left: 1px;
  margin-left: 10px;
  justify-content: center;
  border-top: 0.5px solid #564372;
}
.compare-plan-container .compare-plan-listing .provider-list li {
  width: 110px;
  height: 64px;
  text-align: center;
  display: flex;
  flex-direction: column-reverse;
  position: relative;
}
.compare-plan-container .compare-plan-listing .provider-list li div {
  margin: auto;
  display: flex;
  align-items: center;
}
.compare-plan-container .compare-plan-listing .provider-list li div p {
  color: #ffffff;
  font-family: volte_medium;
  font-weight: 500;
  font-size: 14px;
  padding: 10px;
}
.compare-plan-container .compare-plan-listing .provider-list li div p::first-letter {
  text-transform: capitalize;
}
.compare-plan-container .compare-plan-listing .provider-list li .hr {
  border-bottom: 0.5px solid #564372;
  width: 90px;
}
.compare-plan-container .compare-plan-listing .provider-list li:first-child {
  height: 149px;
}
.compare-plan-container .compare-plan-listing .provider-list li:first-child div {
  position: absolute;
  bottom: 4px;
  left: 15px;
}
.compare-plan-container .compare-plan-listing .provider-list li:first-child .hr {
  border: none;
}
.compare-plan-container .compare-plan-listing .provider-list li .provider-item img {
  width: 50px;
  height: 50px;
  border-radius: 50%;
}
.compare-plan-container .compare-plan-listing .provider-list li .provider-item .place-holder-image {
  position: absolute;
}
.compare-plan-container .compare-plan-listing .provider-list li .provider-item .listing-item-image {
  position: relative;
}
.compare-plan-container .compare-plan-listing .provider-list .pack-footer-item {
  height: 128px;
}
.compare-plan-container .compare-plan-listing .provider-list .pack-footer-item .provider-item {
  border-bottom: 0.5px solid #564372;
  padding-bottom: 4px;
}
.compare-plan-container .compare-plan-listing .provider-list .pack-footer-item .last-icon {
  border-bottom: none;
}
.compare-plan-container .compare-plan-listing .plan-container {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  background: none;
  border: none;
  padding: 0px 0px 20px 0px;
}
.compare-plan-container .pack-footer-message {
  color: #d6c6f4;
  width: 53%;
  margin-top: 5px;
}
.compare-plan-container .pack-footer-message div {
  padding: 5px;
  font-size: 14px;
  font-family: volte_medium;
  font-weight: 500;
  line-height: 17px;
  letter-spacing: -0.1px;
}
.compare-plan-container .pack-action {
  margin-top: 50px;
  margin-bottom: 44px;
}
.compare-plan-container .pack-action .btn {
  width: 420px;
  margin: 0;
  font-size: 20px;
}

@media only screen and (max-width: 320px) {
  .compare-plan-container .compare-plan-listing {
    width: 96%;
  }
  .compare-plan-container .pack-action .btn {
    width: 200px;
  }
}
@media only screen and (max-width: 480px) {
  .compare-plan-container .compare-plan-title {
    margin-bottom: 10px;
  }
  .compare-plan-container .compare-plan-listing {
    width: 85%;
  }
  .compare-plan-container .compare-plan-listing .provider-list {
    margin-right: 5px;
  }
  .compare-plan-container .compare-plan-listing .provider-list .list div {
    height: 63px;
  }
  .compare-plan-container .pack-action .btn {
    width: 94vw;
    position: fixed;
    top: 90vh;
    left: 15px;
    border: 20px solid black;
    border-radius: 70px;
    z-index: 1000;
  }
  .compare-plan-container .pack-footer-message {
    width: 85%;
  }
}
@media only screen and (max-width: 375px) {
  .pack-action .btn {
    top: 89vh !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.invalid-pack-data .popupSec {
  height: 170px;
}
.invalid-pack-data .popupSec h1 {
  margin: 20px auto;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.genre-action-image img {
  max-width: 56px;
  max-height: 42px;
  position: absolute;
  top: 17%;
}

.genre-item-title {
  position: absolute;
  bottom: 9px;
  height: 20px;
  font-family: volte_medium;
  line-height: 1.25;
  letter-spacing: normal;
  color: #ffffff;
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 80%;
  font-family: "sky_reg";
}
.genre-item-title.isGenre {
  font-size: 20px;
  width: 100%;
  overflow: unset;
  bottom: 12px;
  text-align: center;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.cancel-plan-container {
  position: relative;
  height: 100%;
  background: linear-gradient(339.81deg, #220046 59.34%, #E10092 134.97%);
}
.cancel-plan-container .header-fill {
  background: linear-gradient(339.81deg, #220046 59.34%, #E10092 134.97%);
  position: absolute;
  width: 100%;
  height: 100%;
  top: -70px;
  z-index: 1;
}
.cancel-plan-container .cancel-plan-wrapper {
  position: relative;
  z-index: 2;
}
.cancel-plan-container .container {
  width: 640px;
  margin: 0 auto;
  text-align: center;
}
.cancel-plan-container h1 {
  font-family: volte_reg;
  font-weight: 500;
  font-size: 26px;
  line-height: 31.2px;
  letter-spacing: 0px;
  padding-top: 24px;
}
.cancel-plan-container h2 {
  font-family: volte_reg;
  font-weight: 500;
  font-size: 22px;
  line-height: 26.4px;
  letter-spacing: 0px;
  margin-top: 40px;
}
.cancel-plan-container .explore-btn {
  height: 46px;
  min-width: 320px;
  border-radius: 4px;
  border: 0;
  padding: 0 60px;
  margin-top: 40px;
}
.cancel-plan-container .explore-btn span {
  font-family: volte_medium;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 0px;
  text-align: center;
}
.cancel-plan-container .cancel-link {
  font-family: volte_medium;
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
  letter-spacing: 0px;
  color: #F3CBE3;
  margin-top: 24px;
  padding-bottom: 100px;
}
.cancel-plan-container .cancel-link span {
  cursor: pointer;
}

@media only screen and (max-width: 480px) {
  .cancel-plan-container .header-fill {
    top: -49px;
    background: linear-gradient(307.81deg, #220046 59.34%, #E10092 134.97%);
  }
  .cancel-plan-container .container {
    width: 100%;
    margin: 0 auto;
    padding: 0 16px;
    text-align: center;
  }
  .cancel-plan-container h1 {
    font-family: volte_reg;
    font-weight: 500;
    font-size: 26px;
    line-height: 31.2px;
    letter-spacing: 0px;
    margin-top: 24px;
  }
  .cancel-plan-container h2 {
    font-family: volte_reg;
    font-weight: 500;
    font-size: 20px;
    line-height: 26.4px;
    letter-spacing: 0px;
    margin: auto;
    margin-top: 25px;
    width: 323px;
  }
  .cancel-plan-container .explore-btn {
    height: 46px;
    width: 328px;
    min-width: 120px;
    border-radius: 4px;
    border: 0;
    padding: 0 60px;
    margin-top: 85px;
  }
  .cancel-plan-container .explore-btn span {
    font-family: volte_medium;
    font-weight: 600;
    font-size: 16px;
    line-height: 19.2px;
    letter-spacing: 0px;
    text-align: center;
  }
  .cancel-plan-container .cancel-link {
    font-family: volte_medium;
    font-weight: 600;
    font-size: 16px;
    line-height: 19.2px;
    letter-spacing: 0px;
    color: #F3CBE3;
    margin-top: 24px;
    cursor: pointer;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.toggle-switch {
  /* Rounded sliders */
}
.toggle-switch span.label-text {
  color: #ffffff;
  font-size: 16px;
}
.toggle-switch .switch {
  position: relative;
  display: inline-block;
  width: 39px;
  height: 16px;
}
.toggle-switch .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.toggle-switch .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #52547a;
  -webkit-transition: 0.4s;
  transition: 0.4s;
}
.toggle-switch .slider::before {
  position: absolute;
  content: "";
  height: 22px;
  width: 22px;
  bottom: -2px;
  background-color: #ffffff;
  -webkit-transition: 0.4s;
  transition: 0.4s;
  left: 0px;
}
.toggle-switch input:checked + .slider {
  background-color: #5674b9;
}
.toggle-switch input:focus + .slider {
  box-shadow: 0 0 1px #5674b9;
}
.toggle-switch input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
  left: -8px;
}
.toggle-switch .slider.round {
  border-radius: 34px;
}
.toggle-switch .slider.round:before {
  border-radius: 50%;
}

.toogleContent .toggle-switch input:checked + .slider {
  background-color: #E10092;
}
.toogleContent .content-free {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 120%;
  width: 44px;
  height: 22px;
  margin-left: 16px;
}
.toogleContent .content-all {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 120%;
  margin-right: 16px;
  width: 113px;
  height: 26px;
}
.toogleContent .active {
  color: #ffffff;
}
.toogleContent .inactive {
  color: #8e81a1;
}
.toogleContent .toggle-switch .switch {
  width: 34px;
  height: 14px;
}
.toogleContent .toggle-switch .slider::before {
  height: 19px;
  width: 19px;
}

@media only screen and (max-width: 480px) {
  .toogleContent {
    display: flex !important;
  }
  .toogleContent .content-all {
    font-weight: 400;
    font-size: 13px;
    line-height: 13px;
    margin-right: 7px;
    width: 67px;
    height: 13px;
  }
  .toogleContent .content-free {
    font-weight: 400;
    width: auto;
    height: 13px;
    font-size: 13px;
    line-height: 14px;
    font-weight: 400;
    margin-left: 7px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.account-notification-settings .form-group {
  margin: 14px auto;
}
.account-notification-settings .form-group .form-data {
  min-width: 350px;
}
.account-notification-settings .checkbox {
  font-family: sky_med;
}
.account-notification-settings .toggle-switch span.label-text {
  font-family: sky_med;
}
.account-notification-settings .notification-settings-head {
  color: #ffffff;
  font-size: 20px;
  font-family: sky_med;
}
.account-notification-settings .notification-settings-sub-head {
  color: #ffffff;
  font-size: 15px;
  margin: 6px 0 25px 0;
}
.account-notification-settings .email-notification-settings {
  margin-top: 50px;
}
.account-notification-settings .email-notification-settings h6 {
  margin-bottom: 20px;
}
.account-notification-settings .email-block {
  margin-top: 15px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

header .header-left .list-container {
  width: 24.3%;
  height: auto;
  background: #1D1E30;
  position: fixed;
  border: 1px solid #444764;
  box-sizing: border-box;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 6px;
  z-index: 10000000000000;
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  margin-top: 15px;
  margin-left: -20px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
}
header .header-left .list-container .selectedLink p {
  color: #ffffff !important;
}
header .header-left .list-container .items-container {
  width: 90%;
  height: 49px;
  display: flex;
  align-items: center;
  margin: 0 auto;
  padding: 0;
}
header .header-left .list-container .items-container a {
  text-decoration: none;
  display: inline-block;
  position: relative;
  padding: 1em;
  margin-left: -1em;
  padding-right: 16em;
}
header .header-left .list-container .items-container p {
  font-family: volte_reg !important;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #FFFFFF;
  opacity: 0.9;
}
header .header-left .list-container .items-container a p:hover {
  color: #ffffff;
  font-weight: 600;
  font-family: volte_semiBold !important;
}
header .header-left .list-container .items-container:not(:last-child) {
  border-bottom: 1px solid #444764;
}

.bottomstyle-heading {
  font-style: normal;
  font-weight: normal;
  font-size: 22px;
  line-height: 120%;
  text-align: center;
  color: #FFFFFF;
  height: 26px;
  margin: 20px 0;
}

.bottomstyle-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 90%;
  margin: 0 auto;
}

.bottom-close {
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #f3cbe3;
  margin: 20px 0 27px 0;
  font-family: volte_semiBold;
}

.subImage-container {
  width: 156px;
  height: 89px;
  position: relative;
  margin-right: 7px;
  margin-bottom: 10px;
  border-radius: 6px;
}
.subImage-container img {
  width: 100%;
}
.subImage-container p {
  position: absolute;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #FFFFFF;
  left: 6.5px;
  bottom: 3px;
  height: 19px;
  font-family: volte_medium;
}

@media only screen and (max-width: 360px) {
  .bottomstyle-container {
    width: 100%;
  }
  .subImage-container {
    width: 137px;
  }
  .subImage-container p {
    bottom: 10px;
    font-size: 15px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.switch-account-dropdown-list .switch-head {
  padding: 4px;
  font-size: 18px;
}
.switch-account-dropdown-list .switch-head i.icon-left-arrow {
  cursor: pointer;
}
.switch-account-dropdown-list .switch-head i.icon-left-arrow:before {
  color: #ffffff;
  font-size: 12px;
  position: relative;
  margin-right: 16px;
}
.switch-account-dropdown-list.switch-account-dropdown-list {
  position: absolute;
  top: 41px;
  width: 335px;
  height: auto;
  overflow-y: auto;
  overflow-x: hidden;
  right: 0;
  background-color: #2b2d41;
  padding: 8px;
  text-align: left;
}
.switch-account-dropdown-list.switch-account-dropdown-list.profile-img {
  top: 45px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc {
  display: flex;
  flex-wrap: wrap;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div {
  margin: 5px 0;
  display: inline-block;
  color: #a3a6c2;
  font-size: 16px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.acc-detail {
  position: relative;
  left: 12px;
  display: flex;
  align-items: center;
  width: 170px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.acc-detail i {
  vertical-align: bottom;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.acc-detail p {
  width: 100%;
  /*word-break: break-all;*/
  line-height: normal;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.acc-detail p span.acc-id {
  font-size: 14px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.selected-account-img {
  width: 47px;
  background: red;
  border-radius: 50%;
  height: 47px;
  text-align: center;
  background: linear-gradient(121deg, #f08300 8%, #e3000f 31%, #a72879 73%, #064497 99%);
  display: flex;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.selected-account-img img {
  max-width: 84%;
  min-width: 84%;
  margin: 4px;
  background: white;
  border-radius: 50%;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.active-tick {
  left: 30px;
  position: relative;
  right: 0;
  float: right;
  top: 8px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.active-tick .get-icon-success-tick {
  background-color: #ffffff;
  padding: 2px 4px;
  border: 1px solid #7ed321;
  border-radius: 50%;
}
.switch-account-dropdown-list.switch-account-dropdown-list .acc div.active-tick .get-icon-success-tick i.icon-check {
  font-size: 14px;
  position: relative;
  top: -1px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .selected-account {
  padding: 6px 30px;
  border-bottom: 1px solid #564372;
}
.switch-account-dropdown-list.switch-account-dropdown-list .selected-account .binge-asset {
  height: 32px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .selected-account .binge-asset img {
  position: relative;
  top: 8px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .available-account {
  padding: 0 4px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .available-account .avatar-image.sb-avatar__text {
  padding: 2px;
  background: #2b2d41;
  border: 4px solid #404254;
}
.switch-account-dropdown-list.switch-account-dropdown-list .available-account.acc div.acc-detail {
  width: 240px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .available-account .binge-asset {
  height: 45px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .available-account .binge-asset img {
  position: relative;
  top: 14px;
}
.switch-account-dropdown-list.switch-account-dropdown-list li {
  padding: 0 10px;
  background-color: #272840;
  margin: 9px 0;
  display: block;
}
.switch-account-dropdown-list.switch-account-dropdown-list li a {
  text-decoration: none;
  color: #ffffff;
}
.switch-account-dropdown-list.switch-account-dropdown-list li:hover {
  background-color: #1d1e30;
}
.switch-account-dropdown-list.switch-account-dropdown-list li span.icon.left-icon {
  margin-right: 10px;
}
.switch-account-dropdown-list.switch-account-dropdown-list.hide {
  display: none;
}
.switch-account-dropdown-list.switch-account-dropdown-list .sign-out-text {
  cursor: pointer;
  font-size: 18px;
  padding: 10px 6px 6px 6px;
  width: fit-content;
}
.switch-account-dropdown-list.switch-account-dropdown-list .avatar-image.sb-avatar__text {
  height: 47px;
  width: 47px;
  padding: 5px;
}
.switch-account-dropdown-list.switch-account-dropdown-list .avatar-image.sb-avatar.sb-avatar--text {
  top: 0;
}
.switch-account-dropdown-list.switch-account-dropdown-list .avatar-image.sb-avatar.sb-avatar--text div {
  font-size: 25px;
}
.switch-account-dropdown-list p span.white-text {
  position: relative;
  bottom: 2px;
  font-size: 18px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.top-menu-wrapper {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
}
.top-menu-wrapper .img-section .avatar-block {
  width: 40px;
  height: 40px;
  background: linear-gradient(to right, #f08300, #e3000f 43%, #a72879 101%);
  display: flex;
  align-items: center;
  border-radius: 50%;
  text-align: center;
  color: #ffffff;
}
.top-menu-wrapper .img-section .avatar-block p {
  width: inherit;
  position: relative;
  text-align: center;
  margin: auto;
  font-size: 30px;
}
.top-menu-wrapper .img-section .profile-img-section .profile-img.add-border {
  max-width: 50px;
  max-height: 50px;
  display: block;
  border: 2px solid transparent;
  border-radius: 50%;
  background-image: linear-gradient(#33354d, #33354d), linear-gradient(121deg, #f08300 8%, #e3000f 31%, #a72879 73%, #064497 99%);
  background-origin: border-box;
  background-clip: content-box, border-box;
}
.top-menu-wrapper .img-section .profile-img-section .profile-img img {
  max-width: 40px;
  max-height: 40px;
  margin: 3px;
  background: white;
  border-radius: 50%;
  width: 100px;
  height: 100px;
}
.top-menu-wrapper .img-section .profile-img-section .profile-img-icon {
  position: relative;
  right: 21px;
  bottom: 4px;
  font-size: 40px;
}
.top-menu-wrapper .img-section .profile-img-section .profile-img-icon.with-avatar {
  bottom: 0;
  top: 40px;
}
.top-menu-wrapper .img-section .profile-img-section .avatar-image.sb-avatar__text {
  width: 72px;
  height: 72px;
  margin: 25px 0 35px 0;
  display: inline-block;
}
.top-menu-wrapper .img-section .profile-img-section .avatar-image.sb-avatar.sb-avatar--text {
  position: relative;
  top: -15px;
  display: inline-block;
}
.top-menu-wrapper .img-section .profile-img-section .avatar-image.sb-avatar.sb-avatar--text div {
  font-size: 60px;
  position: relative;
  top: 6px;
}
.top-menu-wrapper span {
  display: flex;
  justify-content: center;
}
.top-menu-wrapper .profile-avatar-wrapper {
  padding: 15px 0 10px 0;
}
.top-menu-wrapper .profile-avatar-wrapper img {
  width: 40px;
  height: 40px;
  cursor: pointer;
}
.top-menu-wrapper .logged-in-user-detail {
  flex-direction: column;
  margin-bottom: 32px;
}
.top-menu-wrapper .logged-in-user-detail div {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2px;
  word-break: break-word;
}
.top-menu-wrapper .logged-in-user-detail div i {
  margin-right: 12px;
}
.top-menu-wrapper .logged-in-user-detail .user-detail {
  font-family: volte_medium;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 19px;
  margin-left: 12px;
  color: #ffffff;
}
.top-menu-wrapper .logged-in-user-detail .user-rmn-detail {
  margin-left: 0;
}
.top-menu-wrapper .login-text {
  font-family: volte_medium;
  font-size: 16px;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  color: #ffffff;
  text-align: center;
}
.top-menu-wrapper .login-btn {
  font-family: volte_medium;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  line-height: 120%;
  color: #f3cbe3;
  padding: 10px 0 14.5px 0;
  cursor: pointer;
}

@media only screen and (max-width: 480px) {
  .top-menu-wrapper .logged-in-user-detail {
    margin-bottom: 23px;
  }
  .top-menu-wrapper .profile-avatar-wrapper {
    padding: 23px 0 8px 0;
  }
  .top-menu-wrapper .login-btn {
    font-size: 16px;
    font-weight: 600;
    line-height: 19.2px;
    font-family: volte_medium;
    border: 2px solid #F3CBE3;
    border-radius: 4px;
    padding: 7px;
    width: 120px;
    align-self: center;
    margin-top: 8px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.download-link {
  margin-top: 18px;
}
.download-link span {
  font-family: volte_medium;
  font-size: 16px;
  font-weight: 400;
  line-height: 120%;
  color: #ffffff;
}
.download-link .app-store-btn {
  margin-top: 8px;
  display: flex;
}
.download-link .app-store-btn a {
  margin-right: 16px;
  display: inline-block;
}
.download-link .app-store-btn a .apple-store {
  width: 100px;
  height: 34px;
}
.download-link .app-store-btn a .play-store {
  width: 111px;
  height: 34px;
}

@media only screen and (min-width: 481px) and (max-width: 672px) {
  .download-link .app-store-btn {
    justify-content: space-between;
  }
  .download-link .app-store-btn a {
    margin-right: 10px;
    width: 48%;
  }
  .download-link .app-store-btn a .apple-store {
    width: 100%;
  }
  .download-link .app-store-btn a .play-store {
    width: 100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.connect-link {
  display: flex;
  flex-direction: column;
}
.connect-link .connect-us-title {
  margin-bottom: 8px;
  font-family: volte_medium;
  font-size: 16px;
  font-weight: 400;
  line-height: 120%;
  color: #ffffff;
}
.connect-link .connect-us-btn {
  display: flex;
  align-items: center;
}
.connect-link .connect-us-btn a {
  margin-right: 25px;
}
.connect-link .connect-us-btn a .social-images {
  width: 18.75px;
  height: 18.75px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.bottom-menu-wrapper {
  height: 100%;
  overflow-y: auto;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
}
.bottom-menu-wrapper .w-70 {
  width: 75%;
}
@media only screen and (min-width: 480px) {
  .bottom-menu-wrapper ul .top-margin .top-list-item .end-icon {
    position: absolute;
    right: -15px;
  }
}
.bottom-menu-wrapper ul li {
  padding: 20px 0 15px 0;
  margin: 0 10px 0 20px;
  border-bottom: 1px solid #564372;
  display: flex;
  flex-direction: column;
  font-family: volte_reg;
  color: #ffffff;
}
.bottom-menu-wrapper ul li .top-list-item {
  display: flex;
  justify-content: space-between;
  font-family: volte_reg;
  cursor: pointer;
  position: relative;
}
.bottom-menu-wrapper ul li .top-list-item:hover {
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
}
.bottom-menu-wrapper ul li .top-list-item:hover i:before {
  color: #ffffff;
}
.bottom-menu-wrapper ul li .top-list-item .list-item-span {
  width: 100%;
}
.bottom-menu-wrapper ul li .top-list-item .list-item-span div:nth-child(2) {
  width: 100%;
}
.bottom-menu-wrapper ul li .top-list-item .list-item-span div:nth-child(2) img {
  position: absolute;
  right: 18px;
}
.bottom-menu-wrapper ul li .top-list-item span {
  display: flex;
  align-items: center;
  font-family: volte_reg;
}
.bottom-menu-wrapper ul li .top-list-item .second-label-text {
  font-family: volte_reg;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
  color: #ffffff !important;
}
.bottom-menu-wrapper ul li .top-list-item .balance-info {
  display: flex;
}
.bottom-menu-wrapper ul li .top-list-item .small-end-icon {
  width: 8px;
  height: 12px;
  margin-left: 8px;
}
.bottom-menu-wrapper ul li .top-list-item .end-icon {
  margin-left: 12px;
}
.bottom-menu-wrapper ul li .bottom-list-item {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.bottom-menu-wrapper ul li .bottom-list-item .due-date-text {
  font-family: volte_reg;
  font-size: 10px;
  font-style: normal;
  font-weight: 400;
  line-height: 12px;
  color: #a3a6c2;
  margin-top: 10px;
  margin-bottom: 2px;
}
.bottom-menu-wrapper ul li .bottom-list-item .due-date-text.expired-date {
  color: #e56c6c;
}
.bottom-menu-wrapper ul li .bottom-list-item .renew-btn {
  width: 173px;
  margin: 0;
  height: 36px;
  padding: 0.5px 0;
  font-size: 16px;
  line-height: 120%;
}
.bottom-menu-wrapper ul li .bottom-list-item .renew-btn-with-margin {
  margin-top: 12px;
}
.bottom-menu-wrapper ul li .crown-icon {
  margin-right: 12px;
}
.bottom-menu-wrapper ul li .crown-icon img {
  width: 24px;
  height: 24px;
}
.bottom-menu-wrapper ul li .prime-menu-logo {
  margin-right: 12px;
}
.bottom-menu-wrapper ul li .prime-menu-logo img {
  height: 20px;
  width: 20px;
}
.bottom-menu-wrapper ul li .go-vip {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.bottom-menu-wrapper ul li i {
  display: block;
  font-size: 20px;
  margin-right: 14px;
}
.bottom-menu-wrapper ul li i.icon-Binge-list1 {
  font-size: 19px;
}
.bottom-menu-wrapper ul li a {
  text-decoration: none;
  font-family: volte_reg;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 19px;
  letter-spacing: 0;
  color: #ffffff;
  display: flex;
  align-items: center;
}
.bottom-menu-wrapper .download-link-wrapper {
  padding: 36px 10px 16px 20px;
}
.bottom-menu-wrapper .download-link-wrapper .download-link {
  margin-top: 0;
}
.bottom-menu-wrapper .download-link-wrapper .download-link span {
  font-family: volte_reg;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  color: #a3a6c2;
}
.bottom-menu-wrapper .contact-link-wrapper {
  display: flex;
  padding: 0 10px 13px 20px;
}
.bottom-menu-wrapper .contact-link-wrapper.mb-link {
  margin-bottom: 30px;
}
.bottom-menu-wrapper .contact-link-wrapper .connect-link .connect-us-btn a {
  margin-right: 19px;
}
.bottom-menu-wrapper .contact-link-wrapper .dot {
  width: 4px;
  height: 4px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
}
.bottom-menu-wrapper .contact-link-wrapper a {
  text-decoration: none;
  font-family: volte_reg;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px;
  color: #f3cbe3;
  margin-right: 14px;
}

@media only screen and (max-width: 480px) {
  .bottom-menu-wrapper {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }
  .bottom-menu-wrapper ul .top-margin .top-list-item .end-icon {
    margin-top: 0px;
  }
  .bottom-menu-wrapper ul li {
    font-size: 19px;
  }
  .bottom-menu-wrapper ul li .top-list-item:hover {
    color: unset !important;
    font-size: unset !important;
    font-weight: unset !important;
  }
  .bottom-menu-wrapper ul li .top-list-item:hover i:before {
    color: #8e81a1 !important;
  }
  .bottom-menu-wrapper ul li .top-list-item .crown-icon img {
    width: 20px;
    height: 20px;
  }
  .bottom-menu-wrapper ul li .top-list-item .end-icon {
    position: absolute;
    right: 18px;
  }
  .bottom-menu-wrapper ul li .top-list-item .second-label-text {
    font-size: 14px;
    line-height: 24px;
  }
  .bottom-menu-wrapper ul li .top-list-item .second-label-text span {
    position: relative;
  }
  .bottom-menu-wrapper ul li .top-list-item .second-label-text span.pack-name {
    right: 25px;
  }
  .bottom-menu-wrapper ul li .top-list-item span.bal-margin {
    margin-right: 8px;
  }
  .bottom-menu-wrapper ul li .top-list-item span a img {
    margin-right: 18px;
  }
  .bottom-menu-wrapper ul li a {
    line-height: 120%;
  }
}
@media only screen and (max-width: 350px) {
  .bottom-menu-wrapper ul li .top-list-item .second-label-text span {
    font-size: 11px;
  }
}
@media only screen and (max-height: 720px) {
  .contact-link-wrapper.mb-link {
    min-height: 15vh;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.account-dropdown-list {
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
}
.account-dropdown-list .bottom-menu-wrapper ul {
  padding: 0;
}
.account-dropdown-list .bottom-menu-wrapper ul li {
  padding: 14px 0 14px 0 !important;
  margin: 0 29px 0 29px !important;
}
.account-dropdown-list .bottom-menu-wrapper ul li.top-margin {
  padding: 22px 0 14px 0 !important;
}
.account-dropdown-list .bottom-menu-wrapper ul li:last-child {
  border-bottom: 0;
  padding: 14.5px 0 21.5px 0 !important;
}
.account-dropdown-list .bottom-menu-wrapper ul li i {
  font-size: 24px;
  margin-right: 19px;
  margin-top: -1.5px;
}
.account-dropdown-list .bottom-menu-wrapper ul li .crown-icon {
  margin-right: 17px;
}
.account-dropdown-list .bottom-menu-wrapper ul li .prime-menu-logo {
  margin-right: 17px;
}
.account-dropdown-list .bottom-menu-wrapper ul li .prime-menu-logo img {
  height: 24px;
  width: 24px;
  border-radius: 4.8px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.side-bar-overlay {
  height: 100vh;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1001;
  transition: 850ms;
  background-color: rgba(2, 0, 5, 0.75);
}

.nav-menu {
  height: 100vh;
  width: 83%;
  position: fixed;
  top: 0;
  left: -100%;
  z-index: 1001;
  transition: 850ms;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border-top-right-radius: 50px;
  display: flex;
  flex-direction: column;
}

.nav-menu-active {
  left: 0;
  transition: 350ms;
}

.nav-menu-inactive {
  left: -100%;
  transition: 850ms;
}

@media only screen and (min-width: 480px) {
  .side-bar-overlay {
    display: none;
  }
  .nav-menu {
    display: none;
  }
}
@media only screen and (max-height: 640px) {
  .nav-menu {
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
  }
  .nav-menu .bottom-menu-wrapper ul li {
    padding: 17px 0 17px 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1, h2, h3, h4, h5, h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active, select:focus, select:active, button.btn:focus, button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

header {
  /*.avatar-image {
    &.sb-avatar__text {
      height: 22px;
      width: 22px;
      padding: 4px 0;
      text-align: center;
    }

    &.sb-avatar.sb-avatar--text {
      div {
        font-size: 15px;
        position: absolute;
        padding: 2px 2.5px;
      }
    }
  }*/
}
header .header-top-margin {
  top: 45px !important;
}
header .header {
  position: fixed;
  left: 0;
  z-index: 999;
  width: 100%;
  max-height: 4.375em;
  padding: 0 3% 0 2.8%;
  box-sizing: border-box;
  top: 0;
}
header .header.cancel-page-header-gradient {
  background: linear-gradient(180deg, #020005 0%, rgba(2, 0, 5, 0) 100%);
}
header .header.for-web {
  display: block;
}
header .header.rm-gradient {
  background: unset;
}
header .header.subscription-header:before {
  height: 90px;
}
header .header.home-header:before {
  height: 150px;
}
header .header.header-overlay-remove::before {
  height: 80px;
}
header .header.page-scroll {
  background: #020005;
  background: rgba(2, 0, 5, 0.6);
  backdrop-filter: blur(20px);
}
header .header.page-scroll::before {
  height: 80px;
}
header .header-left {
  float: left;
  display: inline-block;
  width: 70%;
  position: relative;
  z-index: 1000;
}
header .header-left .more-option {
  width: 28px;
  display: none;
}
header .header-left .header-logo {
  display: inline-block;
  text-indent: -9999px;
  cursor: pointer;
  background-size: contain;
  height: 25px;
  width: 80px;
  background: url(/df950e1ecde65bc295d781ef8a591ecc.svg) no-repeat;
  margin: 22px 0 0 0;
  font-size: 1em;
}
header .header-left .active-Popup {
  overflow: hidden;
}
header .header-left .active-Popup .open-popup {
  height: 400px;
}
header .header-left ul {
  display: inline-block;
  width: 70%;
  overflow: auto;
  white-space: nowrap;
  position: absolute;
  padding: 1.4em 0 1.69em;
  -ms-overflow-style: none;
  margin-left: 151px;
  /* Internet Explorer 10+ */
  scrollbar-width: none;
  /* Firefox */
}
header .header-left ul::-webkit-scrollbar {
  display: none;
  /* Safari and Chrome */
}
header .header-left ul li {
  padding: 0 0.625em;
  display: inline-block;
  -webkit-tap-highlight-color: transparent;
  -moz-tap-highlight-color: transparent;
  -o-tap-highlight-color: transparent;
  cursor: pointer;
}
header .header-left ul li .crown-img {
  position: absolute;
  margin-top: -0.3em;
}
header .header-left ul li:focus, header .header-left ul li:active {
  outline: none;
}
header .header-left ul li:first-child {
  padding-left: 0;
}
header .header-left ul li:last-child {
  display: inline-flex;
}
header .header-left ul li:last-child a {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-left: 1.42em;
}
header .header-left ul li .subscription-awaiting {
  border: 1px solid #F3CBE3;
  border-radius: 55px;
  border-width: 1px;
  padding: 4px 11px;
  margin-left: 0px !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  -webkit-text-fill-color: #F3CBE3 !important;
}
header .header-left ul li .subscription-awaiting span {
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0px;
  text-align: center;
  line-height: 120%;
  color: #F3CBE3;
}
header .header-left ul li .header-menu-item {
  color: #766a84;
  cursor: pointer;
  text-decoration: none;
  font-family: volte_medium;
  outline: none;
  font-size: 18px;
  line-height: 21px;
  /* identical to box height */
  text-align: center;
  letter-spacing: 0.294643px;
}
header .header-left ul li .header-menu-item:active, header .header-left ul li .header-menu-item:hover {
  color: #ffffff;
}
header .header-left ul li .header-menu-item.selectedLink {
  color: #ffffff;
  background: transparent;
}
header .header-left ul li .header-menu-item.selectedLink:last-child {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  background-clip: text;
  -webkit-background-clip: text;
}
header .header-left ul li:hover .header-menu-item {
  color: #ffffff;
}
header .header-left ul li:hover .highlighted-line {
  display: block;
}
header .header-left ul li .highlighted-line {
  height: 1px;
  /*  position: relative;
  top: 6px;*/
  border: solid 2px #5087c7;
  display: none;
}
header .header-right {
  width: 30%;
  display: inline-flex;
  justify-content: flex-end;
  text-align: right;
}
header .header-right .header-menu-right > li {
  min-height: 40px;
}
header .header-right ul {
  z-index: 999;
  padding: 21.5px 0 0;
  /* display: flex;*/
  justify-content: end;
}
header .header-right ul.web-large {
  position: relative;
  width: 100%;
}
header .header-right ul.web-small .search-position {
  width: 95% !important;
  position: absolute;
  top: 8px;
  left: 0px;
  z-index: 1000;
}
header .header-right ul.web-small li.search-position {
  padding-bottom: 0px;
}
header .header-right ul.web-small input {
  width: 85% !important;
  padding: 6px 38px 6px 32px !important;
  bottom: auto !important;
  background: url(/b7646bcf7615347a1cb5f0c9f0113a0f.svg) no-repeat 8px 6px/16px #efe8fb !important;
}
header .header-right ul.web-small .backarrow {
  float: left;
  top: 5px;
  position: relative;
}
header .header-right ul li {
  /*cursor: pointer;*/
  display: inline-block;
  margin-right: 25px;
  margin-top: 2px;
}
header .header-right ul li i.icon-icon-search,
header .header-right ul li i.icon-account1 {
  cursor: pointer;
}
header .header-right ul li.account-dropdown span.icon-text:hover .login-text,
header .header-right ul li.account-dropdown span.icon-text:hover i.icon-account1:before {
  color: #eef2f7;
}
header .header-right ul li svg.profile-svg:hover path {
  fill: #eef2f7;
}
header .header-right ul li.search-header-icon {
  font-size: 31px;
  z-index: 10002;
  margin-top: 0;
}
header .header-right ul li.search-header-icon .icon-icon-search-upd:hover:before {
  color: #ffffff;
}
header .header-right ul li.search-header-icon.logged_search {
  font-size: 28px;
}
header .header-right ul li.notification-icon {
  font-size: 24px;
}
header .header-right ul li.notification-icon i {
  cursor: pointer;
}
header .header-right ul li:last-child {
  margin-right: 0;
}
header .header-right ul li a {
  text-decoration: none;
}
header .header-right ul li a i {
  font-size: 16px;
}
header .header-right ul li a svg {
  width: 1.5625em;
  height: 1.375em;
}
header .header-right ul li.account-dropdown {
  width: 5%;
  color: #ffffff;
  /*cursor: pointer;*/
  position: relative;
  align-self: center;
  vertical-align: top;
  /*margin-top: -2px;*/
}
header .header-right ul li.account-dropdown i.icon-account1 {
  font-size: 22px;
}
header .header-right ul li.account-dropdown .login-text {
  font-family: volte_medium;
  padding-left: 5px;
  padding-right: 5px;
  position: relative;
  top: -4px;
  word-break: break-all;
}
header .header-right ul li.account-dropdown ul {
  display: block;
}
header .header-right ul li.account-dropdown ul.account-dropdown-list {
  font-family: volte_reg;
  position: absolute;
  top: 37px;
  width: 288px;
  right: -14px;
  border-radius: 20px;
  text-align: left;
  display: flex;
  flex-direction: column;
  padding: 0;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  overflow: hidden;
}
header .header-right ul li.account-dropdown ul.account-dropdown-list li {
  display: block;
  padding: 9px 10px;
  margin: 4px 0;
  color: #ffffff;
  min-height: 40px;
  cursor: pointer;
}
header .header-right ul li.account-dropdown ul.account-dropdown-list li a {
  text-decoration: none;
  color: #ffffff;
}
header .header-right ul li.account-dropdown ul.account-dropdown-list.hide {
  display: none;
}
header .header-right ul li.logged_out_wrapper {
  vertical-align: top;
  margin-top: -6px;
}
header .header-right ul li.logged_out_wrapper .logged_out_button {
  width: 73px;
  height: 36px;
  border: 2px solid #f3cbe3;
  border-radius: 4px;
  background: none;
  color: #f3cbe3;
  cursor: pointer;
  font-size: 16px;
  font-weight: 600;
  font-family: volte_medium;
}
header .header-right .logged-in-user-img {
  width: 24px;
  background: red;
  border-radius: 50%;
  height: 24px;
  text-align: center;
  position: relative;
  cursor: pointer;
}
header .header-right .logged-in-user-img img {
  max-width: 76%;
  max-height: 80%;
  background: white;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 2px 0;
}
header .logged-out-profile {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  text-align: center;
  cursor: pointer;
}
header .avatar-block {
  width: 24px;
  height: 24px;
  background: linear-gradient(to right, #f08300, #e3000f 43%, #a72879 101%);
  display: flex;
  align-items: center;
  border-radius: 50%;
  text-align: center;
  cursor: pointer;
}
header .avatar-block img {
  width: 24px;
  height: 24px;
}
header .avatar-block p {
  width: inherit;
  position: relative;
  text-align: center;
  margin: auto;
}

.header-left ul li.active a {
  color: #ffffff !important;
}

header .header-right ul li.search {
  position: relative;
  margin-right: 0;
  cursor: auto;
  font-size: 16px;
  font-family: volte_medium !important;
}
header .header-right ul li.search.search-position {
  width: 92%;
  right: 22px;
}
header .header-right ul li.search.search-position ul {
  display: block;
  border-top-left-radius: unset;
  border-top-right-radius: unset;
  border-top: none;
}
header .header-right ul li.search.search-position ul li {
  width: 100%;
}
header .header-right ul li.search.search-position.logged_position {
  width: 78%;
  right: 24px;
}
header .header-right ul li.search input {
  width: 100%;
  font-size: 14px;
  font-family: volte_medium !important;
  appearance: none;
  -webkit-appearance: none;
  border: 1px solid #564372 !important;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  background-color: #efe8fb;
  border-radius: 6px;
  color: #020005;
  padding: 10px 38px 10px 34px;
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  backdrop-filter: blur(8px);
  text-overflow: ellipsis;
  bottom: 10px;
  line-height: 120%;
}
header .header-right ul li.search input::placeholder {
  font-size: 14px !important;
  font-family: volte_medium;
  color: #8E81A1;
}
header .header-right ul li.search input:focus::placeholder {
  color: transparent;
}
header .header-right ul li.search span.icon-close {
  top: 0px;
  font-size: 20px;
}
header .header-right ul li.search span.icon-close:before {
  color: #220046;
}
header .header-right ul li.search i {
  position: absolute;
  top: 6px;
  left: 14px;
  z-index: 1;
  cursor: pointer;
  font-size: 18px;
}
header .header-right ul li.search i.icon-icon-search {
  top: 0px;
  left: 10px;
}
header .header-right ul li.search i.icon-icon-search:before {
  color: #220046;
}
header .header-right ul li.search i.icon-close {
  top: -28px;
  /* right: 0px; */
  left: -12px;
  /* float: right; */
  position: relative;
}
header .header-right ul li.search i.icon-close path {
  fill: #a3a6c2;
}
header .header-right ul li.search ul {
  width: 100%;
  height: auto;
  box-shadow: 0 2px 10px 2px rgba(0, 0, 0, 0.3), 0 2px 4px 0 rgba(0, 0, 0, 0.5);
  background-color: #020005;
  overflow-y: auto;
  padding: 18px 10px 22px 16px;
  top: 27px;
  position: absolute;
  cursor: auto;
  border: 1px solid #564372;
  border-radius: 10px;
  font-family: volte_medium !important;
  overscroll-behavior: contain;
}
header .header-right ul li.search ul li {
  /*overflow-x: hidden;*/
  text-overflow: ellipsis;
  white-space: nowrap;
  font-family: volte_medium;
  margin-right: 0;
  font-size: 16px;
  color: #f0f0ff;
  display: block;
  text-align: left;
  margin-bottom: 13px;
  cursor: pointer;
}
header .header-right ul li.search ul li:first-child {
  font-size: 18px;
  font-family: volte_medium !important;
  margin-bottom: 19px;
  cursor: default;
  overflow: hidden;
}
header .header-right ul li.search ul li i {
  font-size: 13px;
  position: static;
  margin-right: 6px;
  margin-left: 1px;
}
header .header-right ul li.search ul li:last-child {
  margin-bottom: 0;
}
header .header-right ul li.search ul li .search-name {
  float: none;
  color: inherit;
  font-size: inherit;
  font-family: volte_medium !important;
  padding-top: 0px;
  cursor: inherit;
  width: 96%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #f3cbe3;
  padding-right: 10px;
}
header .header-right ul li.search ul li span {
  display: inline-block;
  float: right;
  color: #f3cbe3;
  font-family: volte_medium !important;
  font-size: 14px;
  cursor: pointer;
  padding-top: 3px;
}

.header-for-responsive {
  display: none;
}

.image_off,
.notification-dropdown:hover .image_on {
  display: none;
}

.image_on,
.notification-dropdown:hover .image_off {
  display: block;
}

/*@media (min-width: 1920px) {
  header {
    .header {
      width: 1920px;
      left: auto;
    }
  }
}*/
.recent-search-dp .recent-search-sub-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  height: 100%;
}
.recent-search-dp .recent-search-list {
  display: flex;
  flex-wrap: wrap;
}
.recent-search-dp .auto-Suggestion-containe {
  height: 320px;
  overflow: initial;
}
.recent-search-dp .auto-Suggestion-containe .content-container {
  display: flex;
}
.recent-search-dp .auto-Suggestion-containe .content-container .content-image {
  margin-right: 15px;
}

header .header-right ul li.search ul li.list-name {
  border: 1px solid #F3CBE3;
  border-radius: 55px;
  padding: 15px;
  width: max-content;
  margin-right: 15px;
  margin-bottom: 13px;
  height: 30px;
  font-size: 16px;
}

@media only screen and (max-width: 480px) {
  header .header-right ul.web-small input:focus {
    background: #efe8fb url(/b7646bcf7615347a1cb5f0c9f0113a0f.svg) no-repeat !important;
    background-size: 16px !important;
    background-position: 8px 6px !important;
  }
  header .header-right ul.web-small input::placeholder {
    font-size: 14px !important;
  }
  header .header-right ul.web-small input:focus::placeholder {
    color: transparent;
    font-size: 14px;
    font-family: volte_medium;
  }
  header {
    position: relative;
    top: 0;
    width: 100%;
  }
  header .header {
    position: fixed;
    padding: 0 5.2% 0 5.5%;
    height: 51px;
    background: linear-gradient(180deg, #020005 0%, rgba(2, 0, 5, 0) 100%);
  }
  header .header:before {
    display: none;
  }
  header .header.home-search {
    top: 0;
    height: 50px;
  }
  header .category-page {
    padding-bottom: 90px;
  }
  header .categoryPopup {
    color: white;
    font-size: 20px;
    font-weight: 400;
    font-style: normal;
    margin-top: 3px;
    display: flex;
    align-items: center;
    height: 35px;
  }
  header .categoryPopup span {
    padding-left: 10px;
    display: inline-flex;
    align-items: flex-start;
  }
  header .categoryPopup span img {
    width: 9px;
    height: 6px;
  }
  header .hide-more-option {
    display: none !important;
  }
  header .header-left {
    display: flex;
    align-items: center;
    width: 90%;
  }
  header .header-left .more-option {
    display: block;
  }
  header .header-left .subscribe-action {
    display: flex;
    margin-left: 13px;
    border: solid 1px #f3cbe3;
    width: 101px;
    height: 24px;
    border-radius: 55px;
    align-items: center;
  }
  header .header-left .subscribe-action span img {
    width: 16px;
    height: 16px;
    margin-left: 10px;
  }
  header .header-left .subscribe-action .subscribe-btn {
    color: #f3cbe3;
    background-blend-mode: normal, overlay;
    background: transparent;
    font-size: 12px;
    cursor: pointer;
    border: none;
    font-family: volte_medium;
    padding: 0 5px;
  }
  header .header-left .subscription-awaiting-action {
    display: flex;
    margin-left: 16px;
    width: auto;
    align-items: center;
    border: 1px solid #F3CBE3;
    border-radius: 55px;
    padding: 8px 12px;
  }
  header .header-left .subscription-awaiting-action .subscribe-btn {
    color: #f3cbe3;
    background-blend-mode: normal, overlay;
    background: transparent;
    font-size: 12px;
    cursor: pointer;
    border: none;
    font-family: volte_medium;
    padding: 0 5px;
  }
  header .header-left span {
    cursor: pointer;
  }
  header .header-left span img {
    height: 14px;
    width: 17px;
  }
  header .header-left .header-logo {
    margin: 11px 0 12px 10px;
    background: url(/1d5bb4afcf39c7f1eb21c76d27708810.svg) no-repeat center;
    width: 69px;
    height: 24px;
  }
  header ul.web-small .search-position {
    top: 10px !important;
    /* TSF-3173: UI is broken */
  }
  header .header-right {
    width: 30%;
    display: inline;
  }
  header .header-right ul {
    padding: 0.75em 0;
  }
  header .header-right ul li.search ul {
    padding: 16px;
  }
  header .header-right ul li.search ul li span {
    display: block;
    width: 100%;
    text-align: left;
  }
  header .header-right ul li.search ul li .search-name {
    display: inline-block;
    width: 90%;
  }
  header .header-right ul li.search .icon-icon-search::before {
    color: #ffffff !important;
  }
  header .header-right ul li span.icon-close {
    top: 6px !important;
    right: 9px !important;
    font-size: 14px;
  }
  header .header-right ul li.search-header-icon {
    font-size: 18px;
    margin-right: -6px;
  }
  header .header-right ul li.search-header-icon i {
    font-size: 24px;
  }
  header .header-right ul li.search-header-icon .icon-icon-search-upd::before {
    color: #ffffff;
  }
  header .header-right ul li.notification-icon {
    display: none;
  }
  header .header-right ul li.account-dropdown {
    display: none;
  }
}
@media only screen and (max-width: 768px) {
  header .category-page {
    padding-bottom: 95px;
    height: auto;
  }
  header .header-right .header-menu-right > li {
    min-height: 0px;
  }
  header .icon-icon-search::before {
    color: #ffffff !important;
  }
  header .categoryPopup {
    color: white;
    font-size: 20px;
    font-weight: 400;
    font-style: normal;
    align-items: center;
    height: 24px;
  }
  header .categoryPopup.bt-category {
    position: relative;
    bottom: 16px;
  }
  header .categoryPopup span {
    padding-left: 10px;
    display: inline-flex;
    align-items: flex-start;
  }
  header .categoryPopup span img {
    width: 9px;
    height: 6px;
  }
  header .header-left ul {
    display: none;
  }
  span.icon-close {
    top: 10px !important;
    font-size: 13px;
  }
  .header-for-responsive {
    display: block;
    background: linear-gradient(294.65deg, #020005 0.69%, #220046 100%);
    backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
    position: fixed;
    bottom: 0;
    z-index: 1000;
    width: 100%;
    height: 55px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.5);
  }
  .header-for-responsive .kids-font-family {
    font-family: volte_medium;
  }
  .header-for-responsive ul {
    height: 100%;
    width: 100%;
    padding: 10px 32px 10px 36px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
  }
  .header-for-responsive ul li {
    display: grid;
    align-self: baseline;
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    /* &:hover{
      background: #2b2d41;
    }*/
  }
  .header-for-responsive ul li i {
    display: block;
    font-size: 20px;
    position: relative;
    margin-bottom: 4px;
  }
  .header-for-responsive ul li i.icon-movies_in_active {
    font-size: 19px;
  }
  .header-for-responsive ul li i.icon-tv_in_active {
    font-size: 21px;
  }
  .header-for-responsive ul li i.icon-Category {
    font-size: 16px;
  }
  .header-for-responsive ul li .header-menu-item {
    color: #a3a6c2;
    cursor: pointer;
    text-decoration: none;
    font-style: normal;
    font-size: 10px;
    line-height: 11px;
    text-align: center;
    font-family: volte_medium;
    font-weight: bold;
  }
  .header-for-responsive ul li .header-menu-item .icon-home {
    margin-left: -4px;
  }
  .header-for-responsive ul li .header-menu-item i:before {
    color: #766a84;
  }
  .header-for-responsive ul li .header-menu-item i:before .icon-home {
    margin-left: -4px;
  }
  .header-for-responsive ul li .header-menu-item.selectedLink {
    color: #e796c7;
  }
  .header-for-responsive ul li .header-menu-item.selectedLink i:before {
    color: #e796c7;
    background: transparent;
  }
  .header-for-responsive ul li .header-menu-item .header-menu-img {
    display: flex;
    position: relative;
    left: 8px;
  }
  .header-for-responsive ul .shows-icon .header-menu-item {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .header-for-responsive ul .shows-icon .header-menu-item img {
    width: 30px;
    height: 20px;
    margin-bottom: 5px;
  }
}
@media only screen and (min-width: 2700px) {
  .avatar-block p {
    width: inherit;
    position: relative;
    text-align: center;
    margin: auto;
    top: 1px;
    left: -2px;
  }
}
@media only screen and (min-width: 770px) and (max-width: 1194px) {
  .header-right {
    width: 20% !important;
    float: right;
  }
}
@media only screen and (min-width: 820px) and (max-width: 1194px) {
  header .header-right ul li.search.search-position.logged_position {
    width: 52%;
    right: 20px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 819px) {
  header .header-right ul li.search.search-position.logged_position {
    width: 47%;
    right: 20px;
  }
}
/*@media not all and (min-resolution:.001dpcm) {
  @supports (-webkit-appearance:none) {
    header .header-right ul li.search span.icon-close {
      top: 6px !important;
    }
  }
}*/
@media only screen and (min-device-width: 480px) and (max-device-width: 760px) and (orientation: landscape) {
  .subscribe-action {
    display: flex;
    border: solid 1px #f3cbe3;
    width: 101px;
    height: 24px;
    border-radius: 55px;
    position: absolute;
    margin-left: 97px;
    top: 17px;
  }
  .subscribe-action span img {
    width: 16px;
    height: 16px;
    margin-left: 10px;
    margin-top: 2px;
  }
  .subscribe-action .subscribe-btn {
    color: #f3cbe3;
    background-blend-mode: normal, overlay;
    background: transparent;
    font-size: 12px;
    cursor: pointer;
    border: none;
    font-family: volte_medium;
    padding: 5px;
    font-weight: 600;
  }
}
@media only screen and (min-device-width: 770px) and (orientation: landscape) {
  .subscribe-action {
    display: none;
  }
}
@media (min-width: 540px) and (max-width: 541px) {
  .subscribe-action {
    display: flex;
    border: solid 1px #f3cbe3;
    width: 101px;
    height: 24px;
    border-radius: 55px;
    position: absolute;
    margin-left: 97px;
    top: 17px;
  }
  .subscribe-action span img {
    width: 16px;
    height: 16px;
    margin-left: 10px;
    margin-top: 2px;
  }
  .subscribe-action .subscribe-btn {
    color: #f3cbe3;
    background-blend-mode: normal, overlay;
    background: transparent;
    font-size: 12px;
    cursor: pointer;
    border: none;
    font-family: volte_medium;
    padding: 5px;
    font-weight: 600;
  }
}
@media only screen and (min-width: 768px) and (max-width: 870px) {
  header .header-left {
    width: 60%;
  }
}
/* Safari 11+ */
@media not all and (min-resolution: 0.001dpcm) {
  @supports (-webkit-appearance: none) and (stroke-color: transparent) {
    @media only screen and (max-width: 480px) {
      header .header-right ul li.search span.icon-close {
        top: 10px !important;
      }
    }
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.checkbox {
  position: relative;
}
.checkbox label {
  width: 18px;
  height: 18px;
  border-radius: 3px;
  border: solid 1px #52547a;
  overflow: hidden;
  position: absolute;
  display: inline-block;
  background-color: #52547a;
}
.checkbox label i.icon-check {
  display: none;
  font-size: 1.143rem;
}
.checkbox label.right {
  right: 0;
}
.checkbox input[type=checkbox] {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  opacity: 0;
  cursor: pointer;
  z-index: 1;
  -webkit-tap-highlight-color: transparent;
  -moz-tap-highlight-color: transparent;
  -o-tap-highlight-color: transparent;
}
.checkbox label.checked {
  border-color: #e10092;
  background: #e10092;
}
.checkbox label.checked i.icon-check {
  display: block;
  padding: 2px 1.5px;
  font-size: 0.857rem;
}
.checkbox label.checked i.icon-check:before {
  color: #fff;
}
.checkbox .checkbox-text {
  color: #ffffff;
  margin-left: 10px;
  position: relative;
  bottom: 0px;
  left: 16px;
  display: inline-block;
}
.checkbox .checkbox-text.left {
  margin-left: 0;
  left: 0;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .checkbox {
    padding-right: 15px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.watch-notification .recent-block div .notification-block div, .watch-notification .earlier-block div .notification-block div {
  cursor: pointer;
}
.watch-notification .recent-block div .notification-block div:first-child, .watch-notification .earlier-block div .notification-block div:first-child {
  position: relative;
  min-width: 88px;
  max-width: 88px;
  max-height: 56px;
}
.watch-notification .recent-block div .notification-block div:first-child img, .watch-notification .earlier-block div .notification-block div:first-child img {
  position: absolute;
  max-width: 88px;
  max-height: 56px;
  min-height: 56px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
}
.watch-notification .recent-block div .notification-block div:nth-child(2), .watch-notification .earlier-block div .notification-block div:nth-child(2) {
  min-width: 161px;
  max-width: 161px;
  margin: 6px 10px;
}
.watch-notification .recent-block div .notification-block div:nth-child(2) p, .watch-notification .earlier-block div .notification-block div:nth-child(2) p {
  font-size: 14px;
  color: #ffffff;
  overflow: hidden;
  line-height: 1.17;
}
.watch-notification .recent-block div .notification-block div:nth-child(2) p:first-child, .watch-notification .earlier-block div .notification-block div:nth-child(2) p:first-child {
  white-space: nowrap;
  text-overflow: ellipsis;
}
.watch-notification .recent-block div .notification-block div:nth-child(2) p:nth-child(2), .watch-notification .earlier-block div .notification-block div:nth-child(2) p:nth-child(2) {
  font-size: 12px;
  color: #a3a6c2;
  max-height: 30px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.watch-notification .recent-block div .notification-block div:last-child, .watch-notification .earlier-block div .notification-block div:last-child {
  text-align: right;
  width: 138px;
  margin: 6px 6px;
}
.watch-notification .recent-block div .notification-block div:last-child p, .watch-notification .earlier-block div .notification-block div:last-child p {
  font-size: 12px;
  font-family: sky_med;
  color: #a3a6c2;
}
.watch-notification .recent-block div .notification-block div:last-child img, .watch-notification .earlier-block div .notification-block div:last-child img {
  min-width: 46px;
  max-height: 13px;
  position: relative;
  top: 20px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.transaction-notification .recent-block div .notification-block div, .transaction-notification .earlier-block div .notification-block div {
  cursor: pointer;
}
.transaction-notification .recent-block div .notification-block div:first-child, .transaction-notification .earlier-block div .notification-block div:first-child {
  min-width: 270px;
  max-width: 270px;
  margin: 6px 10px;
}
.transaction-notification .recent-block div .notification-block div:first-child p, .transaction-notification .earlier-block div .notification-block div:first-child p {
  color: #ffffff;
  overflow: hidden;
  line-height: 1.17;
}
.transaction-notification .recent-block div .notification-block div:first-child p:first-child, .transaction-notification .earlier-block div .notification-block div:first-child p:first-child {
  white-space: nowrap;
  text-overflow: ellipsis;
  line-height: 1.14;
  font-size: 14px;
  margin-bottom: 2px;
}
.transaction-notification .recent-block div .notification-block div:first-child p:nth-child(2), .transaction-notification .earlier-block div .notification-block div:first-child p:nth-child(2) {
  font-size: 12px;
  color: #a3a6c2;
  max-height: 30px;
  line-height: 1.17;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.transaction-notification .recent-block div .notification-block div:last-child, .transaction-notification .earlier-block div .notification-block div:last-child {
  text-align: right;
  width: 70px;
  margin: 6px 6px;
}
.transaction-notification .recent-block div .notification-block div:last-child p, .transaction-notification .earlier-block div .notification-block div:last-child p {
  font-size: 12px;
  font-family: sky_med;
  color: #a3a6c2;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.notification-popup {
  position: absolute;
  width: 387px;
  max-height: 583px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.3);
  background-color: #2b2d41;
  right: 48px;
  top: 47px;
  padding: 15px;
  text-align: left;
}
.notification-popup div.tab-sub-header {
  font-size: 14px;
  line-height: 1.71;
  color: white;
  font-family: sky_med;
  margin-bottom: 10px;
}
.notification-popup div.tab-sub-header.earlier {
  margin-top: 25px;
}
.notification-popup div.tab-sub-header .delete-block {
  float: right;
  position: relative;
  top: 6px;
  cursor: pointer;
}
.notification-popup div.tab-sub-header .delete-block.disable-delete {
  cursor: not-allowed;
}
.notification-popup div.tab-sub-header .delete-block i.icon-trash-grey.disable {
  pointer-events: none;
}
.notification-popup div.tab-sub-header .delete-block i.icon-trash-grey:hover:before {
  color: #5087c7;
}
.notification-popup div.tab-sub-header .delete-block i.icon-trash-grey.edit-mode:before {
  color: #a3a6c2;
}
.notification-popup div.earlier-block .tab-sub-header {
  margin-top: 25px;
  margin-bottom: 10px;
}
.notification-popup ul.tab-row {
  text-align: center;
  width: 100%;
}
.notification-popup li.tab {
  width: 50%;
  text-align: center;
  margin-right: 0;
  font-size: 16px;
  color: #a3a6c2;
  font-family: sky_med;
  cursor: pointer;
}
.notification-popup li.tab.active {
  color: #ffffff;
}
.notification-popup li.tab:focus, .notification-popup li.tab:active {
  outline: none;
}
.notification-popup li i.icon-oval {
  font-size: 5px;
  position: relative;
  top: -8px;
  left: 1px;
}
.notification-popup .watch-notification,
.notification-popup .transaction-notification {
  width: 357px;
  margin-top: 20px;
  overflow-y: scroll;
  height: 528px;
  padding-right: 14px;
  float: right;
}
.notification-popup .watch-notification .notification-block,
.notification-popup .transaction-notification .notification-block {
  width: 340px;
  height: 67px;
  padding: 5px 5px 5px 10px;
  display: flex;
  box-sizing: border-box;
  margin-bottom: 5px;
}
.notification-popup .watch-notification .recent-notification-container,
.notification-popup .transaction-notification .recent-notification-container {
  width: 340px;
  clear: both;
  position: relative;
}
.notification-popup .watch-notification .notification-checkbox,
.notification-popup .transaction-notification .notification-checkbox {
  position: relative;
  top: 25px;
}
.notification-popup .watch-notification .notification-checkbox .checkbox input[type=checkbox],
.notification-popup .transaction-notification .notification-checkbox .checkbox input[type=checkbox] {
  width: inherit;
  height: inherit;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.prime-addon-container .popupSec {
  width: 640px;
  background-color: #33354d;
  border-radius: 20px;
  padding: 23px 108px 24px;
}
.prime-addon-container .popupSec .modal-body {
  padding: 0;
}
.prime-addon-container .amazon-modal-container h2 {
  padding: 0 82px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 22px;
  line-height: 120%;
  margin-top: -3px;
  margin-bottom: 40px;
  text-align: center;
}
.prime-addon-container .amazon-modal-container .prime-bottom {
  margin-bottom: 30px !important;
}
.prime-addon-container .amazon-modal-container .disabled {
  opacity: 0.5;
  cursor: not-allowed;
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Chrome/Safari/Opera */
  -khtml-user-select: none;
  /* Konqueror */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge*/
  user-select: none;
  pointer-events: none;
}
.prime-addon-container .amazon-modal-container .button-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: #020005;
  margin-bottom: 20px;
  height: 76px;
  border-radius: 10px;
  padding-left: 15px;
  padding-right: 27px;
  border: 1px solid #444764;
}
.prime-addon-container .amazon-modal-container .button-container .info-wrapper {
  display: flex;
  align-items: center;
}
.prime-addon-container .amazon-modal-container .button-container .info-wrapper .img-wrapper {
  width: 38px;
  height: auto;
}
.prime-addon-container .amazon-modal-container .button-container .info-wrapper .img-wrapper img {
  width: 100%;
}
.prime-addon-container .amazon-modal-container .button-container .info-wrapper .vip-text {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.prime-addon-container .amazon-modal-container .button-container .info-wrapper p {
  padding-left: 10px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  line-height: 120%;
  color: #FFFFFF;
}
.prime-addon-container .amazon-modal-container .button-container .price-wrapper {
  display: inline-flex;
  align-items: center;
}
.prime-addon-container .amazon-modal-container .button-container .price-wrapper p {
  font-size: 16px;
  font-family: volte_reg;
  padding-right: 1px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
  color: #A3A6C2;
  font-size: 20px;
  padding-top: 1px;
}
.prime-addon-container .amazon-modal-container .button-container .price-wrapper .checkbox {
  display: inline-flex;
  align-items: center;
}
.prime-addon-container .amazon-modal-container .button-container .price-wrapper .checkbox .checkbox-text {
  margin-right: 10px;
  font-size: 16px;
  line-height: 120%;
  color: #A3A6C2;
  font-size: 20px;
  padding-top: 1px;
  font-family: volte_reg;
}
.prime-addon-container .amazon-modal-container .button-container .price-wrapper .checkbox label {
  border-radius: 50%;
  position: unset;
  margin-top: 4px;
}
.prime-addon-container .amazon-modal-container .cancel-text {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  color: #A3A6C2;
  margin-bottom: 20px;
}
.prime-addon-container .amazon-modal-container .not-now {
  width: 100%;
}
.prime-addon-container .amazon-modal-container .not-now .btn {
  width: 100%;
  font-size: 20px;
}
.prime-addon-container .amazon-modal-container .not-now .btn .button-text {
  font-family: volte_reg;
}
.prime-addon-container .amazon-modal-container .proceed {
  width: 100%;
  margin-top: 10px;
}
.prime-addon-container .amazon-modal-container .proceed .btn {
  width: 100%;
  font-size: 20px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
}
.prime-addon-container .amazon-modal-container .proceed .btn .button-text {
  font-family: volte_reg;
}

@media only screen and (min-width: 320px) and (max-width: 480px) {
  .prime-addon-container .popupSec {
    width: 90%;
    padding: 20px;
  }
  .prime-addon-container .amazon-modal-container h2 {
    padding: 0 11px;
    margin-top: 0px;
  }
  .prime-addon-container .amazon-modal-container .prime-bottom {
    margin-bottom: 20px !important;
  }
  .prime-addon-container .amazon-modal-container .button-container {
    height: 47px;
    border-radius: 10px;
    padding-left: 5px;
    padding-right: 12px;
    margin-bottom: 10px;
  }
  .prime-addon-container .amazon-modal-container .button-container .info-wrapper .img-wrapper {
    width: 26px;
  }
  .prime-addon-container .amazon-modal-container .button-container .info-wrapper p {
    font-size: 16px;
  }
  .prime-addon-container .amazon-modal-container .button-container .price-wrapper p {
    font-size: 16px;
  }
  .prime-addon-container .amazon-modal-container .button-container .price-wrapper .checkbox {
    padding-right: 0;
  }
  .prime-addon-container .amazon-modal-container .button-container .price-wrapper .checkbox .checkbox-text {
    font-size: 16px;
  }
  .prime-addon-container .amazon-modal-container .button-container .price-wrapper .checkbox label {
    border-radius: 50%;
    position: unset;
    margin-top: 4px;
  }
  .prime-addon-container .amazon-modal-container .not-now {
    width: 100%;
  }
  .prime-addon-container .amazon-modal-container .not-now .btn {
    width: 100%;
    font-size: 16px;
    padding: 11px 38px;
    margin-bottom: 5px;
  }
  .prime-addon-container .amazon-modal-container .proceed {
    width: 100%;
    margin-top: 10px;
  }
  .prime-addon-container .amazon-modal-container .proceed .btn {
    width: 100%;
    font-size: 16px;
    padding: 11px 38px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.amazon-container {
  margin: 0px auto;
  text-align: center;
  width: 642px;
  position: relative;
}
.amazon-container .add-on {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 20px 0;
}
.amazon-container .add-on .hr {
  width: 100px;
  border: 0.5px solid #d6c6f4;
}
.amazon-container .add-on p {
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
}
.amazon-container .amazon-subscription {
  background: #EFE8FB;
  border-radius: 20px;
  border: 1px solid #564372;
  padding: 20px 27px;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity {
  display: flex;
  align-items: center;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(1) {
  width: 80px;
  height: 80px;
  border-radius: 136px;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(1) img {
  width: 100%;
  border-radius: 8px;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(2) {
  padding-left: 40px;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(2) p:nth-child(1) {
  font-style: normal;
  font-weight: 500;
  font-size: 26px;
  line-height: 120%;
  display: flex;
  align-items: center;
  color: #564372;
  font-family: volte_medium;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(2) p:nth-child(2) {
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  display: flex;
  align-items: center;
  color: #564372;
  font-family: volte_medium;
  text-align: start;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-price {
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  color: #564372;
  font-family: volte_medium;
}
.amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-price span {
  font-size: 30px;
  font-family: volte_semiBold;
}
.amazon-container .amazon-subscription .amazon-prime-footer {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  display: flex;
  align-items: center;
  color: #8E81A1;
  font-family: volte_medium;
  padding-left: 120px;
}
.amazon-container .amazon-subscription .error-msg {
  font-family: volte_medium;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  color: #e56c6c;
  padding: 0 20px;
}
.amazon-container .amazon-subscription .border-line {
  display: block;
  border: 1px solid #444764;
  background: #444764;
  opacity: 0.5;
  margin: 20px 0px 28px 0px;
}
.amazon-container .amazon-subscription .other-option {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  cursor: pointer;
  font-family: volte_medium;
  color: #E56C6C;
  margin-top: 30px;
}

@media only screen and (max-width: 640px) {
  .amazon-container {
    width: 100%;
  }
  .amazon-container .add-on {
    margin: 15px 0;
  }
  .amazon-container .add-on .hr {
    width: 50px;
    border: 0.5px solid #D6C6F4;
  }
  .amazon-container .add-on p {
    font-size: 16px;
  }
  .amazon-container .amazon-subscription {
    padding: 20px 20px;
  }
  .amazon-container .amazon-subscription hr {
    border: 1px solid #444764;
    margin-top: 17px;
    margin-bottom: 11px;
  }
  .amazon-container .amazon-subscription .amazon-prime-footer {
    font-size: 12px;
    padding-left: 21.5%;
    text-align: left;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(1) {
    width: 50px;
    height: 50px;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(1) img {
    width: 100%;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(2) {
    padding-left: 15px;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(2) p:nth-child(1) {
    font-size: 16px;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-validity div:nth-child(2) p:nth-child(2) {
    font-size: 14px;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-price {
    font-size: 12px;
    display: inline-flex;
  }
  .amazon-container .amazon-subscription .amazon-subscription-wrapper .amazon-price span {
    font-size: 24px;
    color: #220046;
    margin-top: -3px;
  }
  .amazon-container .amazon-subscription .other-option {
    font-size: 16px;
    font-family: volte_medium;
    color: #E56C6C;
  }
  .amazon-container .amazon-subscription .error-msg {
    font-size: 16px;
    margin-top: 22px;
  }
  .amazon-container .amazon-subscription .border-line {
    display: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.tik_tik_my_plan_container {
  margin: 15px auto 0px auto;
  text-align: center;
  width: 642px;
  position: relative;
  padding-bottom: 40px;
}
.tik_tik_my_plan_container .tik_main_heading {
  font-size: 26px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: center;
  opacity: 0.8;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper {
  background: #EFE8FB;
  margin-top: 22.5px;
  border-radius: 20px;
  padding-bottom: 30px;
  border: 1px solid #564372;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14.5px 20px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading {
  display: flex;
  align-items: center;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading .tik_crown_img_wrapper {
  width: 21px;
  height: 21px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading .tik_crown_img_wrapper img {
  width: 100%;
  background: #220046;
  border-radius: 23.9063px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading p:nth-child(2) {
  font-size: 18px;
  line-height: 21.6px;
  padding-left: 10px;
  font-family: volte_semiBold;
  color: #220046;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_right_heading {
  font-weight: 700;
  font-size: 24px;
  line-height: 28.8px;
  color: #220046;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_right_heading span:nth-child(1) {
  font-family: volte_bold;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_right_heading span:nth-child(2) {
  font-family: volte_semiBold;
  font-size: 14px;
  font-weight: 500;
  line-height: 16.8px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings {
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-family: volte_semiBold;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .apps_count {
  font-size: 14px;
  line-height: 16.8px;
  color: #220046;
  font-weight: 500;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .apps_count .app_number {
  font-size: 22px;
  font-weight: 600;
  line-height: 24px;
  margin-right: 5px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .pack_validity {
  font-size: 14px;
  line-height: 16.8px;
  font-weight: 600;
  font-family: volte_medium;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_partner_container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 0 12px 0 20px;
  margin-top: 0px;
  margin-bottom: 20px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_partner_container .content-wrapper {
  width: 50px;
  height: 50px;
  margin-right: 16px;
  text-align: center;
  margin-top: 10px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_partner_container .content-wrapper img {
  width: 100%;
  height: 100%;
  mix-blend-mode: normal;
  border-radius: 4.31023px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages {
  display: flex;
  flex-direction: column;
  padding: 10px 20px 5px 20px;
  text-align: start;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_1 {
  padding-bottom: 10px;
  color: #220046;
  display: flex;
  align-items: center;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_1 img {
  width: 42px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_1 .myplan_message_sub_1 {
  font-size: 14px;
  font-weight: 600;
  line-height: 16.8px;
  margin-left: 5px;
  font-family: volte_medium;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_2 {
  font-size: 16px;
  font-weight: 500;
  color: #8e81a1;
  line-height: 16.8px;
  font-family: volte_medium;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_button_wrapper .btn-wrapper {
  border-radius: 4px;
  width: 91%;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_button_wrapper .btn-wrapper:hover {
  border: solid 2px #e10092;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_button_wrapper .other_option {
  font-family: volte_semiBold;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0px;
  text-align: center;
  color: #e10092;
  cursor: pointer;
  margin-bottom: 10px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_expiry_verbiage {
  font-size: 16px;
  font-weight: 500;
  color: #8e81a1;
  line-height: 16.8px;
  font-family: volte_medium;
  text-align: start;
  padding: 0 20px 10px 20px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .error_msg {
  color: #E56C6C;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage {
  font-size: 16px;
  font-weight: 500;
  color: #220046;
  line-height: 16.8px;
  font-family: volte_medium;
  text-align: start;
  padding: 0px 20px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container {
  display: flex;
  background: #d6c6f4;
  border-radius: 6px;
  height: 44px;
  align-items: center;
  font-size: 14px;
  color: #220046;
  margin-bottom: 8px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container img {
  width: 36px;
  height: 36px;
  margin-left: 5px;
  margin-right: 10px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .replace_verbiage {
  margin: 0;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .tik_request_date {
  font-size: 14px;
  font-family: "volte_semiBold";
  color: #6b00dd;
  padding-left: 5px;
}
.tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage p {
  margin-bottom: 8px;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper {
  margin-top: 22.5px;
  border-radius: 20px;
  border: 1px solid #8E81A1;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #220046 68.75%);
  position: relative;
  z-index: 2;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tick-tick-background-img {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0.55;
  overflow-y: hidden;
  border-radius: 20px;
  z-index: -1;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tick-tick-background-img img {
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100%;
  object-fit: cover;
  object-position: 0%;
  opacity: 1;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_tik_upgrade_plan_headings {
  font-family: volte_medium;
  font-size: 22px;
  font-weight: 500;
  line-height: 26px;
  letter-spacing: 0px;
  text-align: center;
  color: #ffffff;
  margin-top: 20px;
  margin-bottom: 20px;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_tik_upgrade_plan_sub_headings {
  font-family: volte_medium;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: center;
  color: #d6c6f4;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_myplan_partner_container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding: 0 20px 0 30px;
  margin-top: 10px;
  margin-bottom: 10px;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_myplan_partner_container .content-wrapper {
  width: 46px;
  height: 46px;
  margin-right: 16px;
  text-align: center;
  margin-top: 10px;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_myplan_partner_container .content-wrapper img {
  width: 100%;
  height: 100%;
  mix-blend-mode: normal;
  border-radius: 4.31023px;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_many_more {
  font-family: volte_medium;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: center;
  color: #d6c6f4;
  margin-bottom: 20px;
}
.tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .upgrade-btn-wrapper {
  border-radius: 4px;
  width: 91%;
  margin-bottom: 20px;
}
.tik_tik_my_plan_container .tik_cancel_button {
  font-family: volte_semiBold;
  font-size: 18px;
  font-weight: 600;
  line-height: 19px;
  letter-spacing: 0px;
  text-align: center;
  color: #f3cbe3;
  margin-top: 15px;
  margin-bottom: 20px;
}
.tik_tik_my_plan_container .tik_cancel_button span {
  cursor: pointer;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 360px) {
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings {
    align-items: unset;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .apps_count {
    text-align: left;
  }
}
@media only screen and (max-device-width: 480px) {
  .tik_tik_my_plan_container {
    width: 90%;
    margin: 0 auto;
  }
  .tik_tik_my_plan_container .tik_main_heading {
    font-size: 22px;
    opacity: 1;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper {
    margin-top: 15px;
    padding-bottom: 10px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18.5px 15px 0px 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading {
    display: flex;
    align-items: center;
    margin-top: -5px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading .tik_crown_img_wrapper {
    width: 15px;
    height: 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading .tik_crown_img_wrapper img {
    width: 100%;
    background: #220046;
    border-radius: 23.9063px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_left_heading p:nth-child(2) {
    font-size: 12px;
    line-height: 14.4px;
    padding-left: 4px;
    margin-top: 2px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_headings .tik_right_heading {
    font-weight: 600;
    font-size: 19px;
    margin-top: -5px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings {
    margin-top: 6px;
    padding: 0 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .apps_count {
    font-size: 12px;
    line-height: 14.4px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .apps_count .app_number {
    font-size: 20px;
    margin-right: 2px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_headings .pack_validity {
    font-size: 12px;
    line-height: 13.2px;
    font-weight: 500;
    margin-top: 4px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_partner_container {
    margin-bottom: 12px;
    margin-top: 0px;
    padding: 0 12px 0 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_partner_container .content-wrapper {
    width: 46px;
    height: 46px;
    margin-right: 10px;
    margin-top: 10px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_expiry_verbiage {
    font-size: 12px;
    padding: 0 15px 12px 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages {
    padding: 5px 15px 0px 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_1 {
    padding-bottom: 0px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_1 img {
    width: 37px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_1 .myplan_message_sub_1 {
    font-size: 12px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_myplan_sub_messages .myplan_message_2 {
    font-size: 12px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_button_wrapper .btn-wrapper {
    width: 92%;
    padding: 13px;
    margin-left: 10px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_button_wrapper .other_option {
    font-size: 16px;
    line-height: 19.2px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage {
    font-size: 12px;
    font-weight: 500;
    color: #564372;
    line-height: 14.4px;
    padding: 0px 15px 0px 15px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container {
    height: 42px;
    font-size: 12px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .replace_verbiage {
    margin: 0;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container img {
    width: 30px;
    height: 30px;
    margin-left: 5px;
    margin-right: 10px;
  }
  .tik_tik_my_plan_container .tik_tik_plan_wrapper .tik_my_plan_bottom_verbiage .tik_replace_verbiage_container .tik_request_date {
    font-size: 12px;
  }
  .tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_tik_upgrade_plan_headings {
    line-height: 26.4px;
    margin: 20px 20px 10px 20px;
    font-size: 20px;
  }
  .tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_tik_upgrade_plan_sub_headings {
    line-height: 19.2px;
    margin: 0px 44px 10px 44px;
    font-size: 14px;
  }
  .tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_myplan_partner_container {
    padding: 0 12px 0 20px;
    margin-top: 0px;
    margin-bottom: 8px;
  }
  .tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_myplan_partner_container .content-wrapper {
    width: 46px;
    height: 46px;
    margin-right: 10px;
    margin-top: 10px;
  }
  .tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .tik_many_more {
    font-size: 14px;
    line-height: 19.2px;
    margin-bottom: 20px;
  }
  .tik_tik_my_plan_container .tik_tik_upgrade_plan_wrapper .upgrade-btn-wrapper {
    border-radius: 4px;
    width: 90%;
    margin-left: 10px;
    padding: 13px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.complementary-apps-container {
  margin-top: 20px;
  border-radius: 20px;
  width: 100%;
  height: auto;
  padding: 20px;
  position: relative;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 20px;
  background: linear-gradient(0deg, #000000, #000000) padding-box, linear-gradient(270deg, #FFA800 0%, #FFF389 45.31%, #FFA800 100%) border-box;
}
.complementary-apps-container .complementary-header {
  text-align: start;
  display: flex;
  align-items: center;
}
.complementary-apps-container .complementary-header img {
  width: 43px;
  height: 36px;
}
.complementary-apps-container .complementary-header p {
  font-family: "volte_reg";
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  color: #FFFFFF;
}
.complementary-apps-container .complementary-images-block {
  margin-top: 18px;
  margin-bottom: 8px;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 8px;
}
.complementary-apps-container .complementary-images-block div {
  width: 79px;
  height: 75px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.complementary-apps-container .complementary-images-block div .content-wrapper {
  width: 55px;
  height: 55px;
  border-radius: 4px;
  margin: 4px 0;
  box-shadow: 0px 1.72px 5.16px 1.72px rgba(255, 255, 255, 0.2509803922);
}
.complementary-apps-container .complementary-images-block div .content-wrapper img {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}
.complementary-apps-container .complementary-images-block div .complementary-category {
  font-family: "volte_reg";
  font-size: 10px;
  font-weight: 500;
  line-height: 12px;
  text-align: center;
  color: #FFE8F7;
  position: relative;
  bottom: -2px;
}
.complementary-apps-container .collapse-show {
  overflow: hidden;
  max-height: 500px;
  transition: max-height 2s ease-out;
}
.complementary-apps-container .collapse-hide {
  overflow: hidden;
  max-height: 100px;
  transition: max-height 1s ease-in;
}
.complementary-apps-container .complmentary-cta {
  width: fit-content;
  height: 23px;
  padding: 3px;
  font-family: "volte_semiBold";
  font-size: 14px;
  line-height: 16.8px;
  text-align: center;
  color: #F3CBE3;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: auto;
}
.complementary-apps-container .complmentary-cta img {
  margin-left: 2px;
  width: 10px;
  height: 10px;
}

@media only screen and (max-width: 480px) {
  .complementary-apps-container {
    padding: 16px 5px 14px 5px;
  }
  .complementary-apps-container .complementary-header p {
    font-size: 16px;
  }
  .complementary-apps-container .complementary-images-block {
    margin-top: 12px;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 6px;
  }
  .complementary-apps-container .complementary-images-block div {
    width: auto;
    height: 75px;
  }
  .complementary-apps-container .complementary-images-block div .content-wrapper {
    width: 55px;
    height: 55px;
    border-radius: 3px;
    margin-bottom: 3px;
  }
  .complementary-apps-container .complementary-images-block div .complementary-category {
    font-size: 9px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.revoke-button-option .primary-btn:hover {
  border: solid 2px #e10092;
}
.revoke-button-option .primary-btn {
  width: 600px;
  height: 46px;
  min-width: 280px;
  border-radius: 4px;
  background: #E10092;
}
.revoke-button-option .primary-btn span {
  font-family: volte_medium;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
}

@media only screen and (max-device-width: 480px) {
  .revoke-button-option .primary-btn:hover {
    border: solid 2px #e10092;
  }
  .revoke-button-option .primary-btn {
    width: 95.537%;
    min-width: 120px;
    border-radius: 4px;
    background: #E10092;
    margin-bottom: 5px;
  }
  .revoke-button-option .primary-btn span {
    font-size: 16px;
  }
}
@charset "UTF-8";
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.combo-plan {
  padding-bottom: 30px;
}
.combo-plan .lg-d-grid {
  display: grid;
  justify-items: start;
}
.combo-plan .lg-d-grid span:nth-child(2) span:nth-child(1) {
  padding: 5px 16px;
}
.combo-plan .netflix-width {
  max-width: 78.5% !important;
  margin: 0px auto;
}
.combo-plan .netflix-full-width {
  width: 100% !important;
  max-width: 100% !important;
}
.combo-plan .netflix-730-width {
  max-width: 70%;
  margin: auto;
  text-align: start;
  display: flex;
}
.combo-plan .partner-desc {
  font-weight: 500;
  font-size: 12px;
  color: #564372;
  text-align: start;
  padding: 0px 15px;
  font-family: volte_medium;
}
.combo-plan .partner-desc:before {
  content: "• ";
}
.combo-plan .channels-view {
  display: inline-grid;
  align-content: center;
  padding: 15px 15px;
  width: 180px;
  padding-top: 30%;
  height: 100%;
  padding-left: 26px;
}
.combo-plan .comboinfo-verbiage {
  font-family: volte_medium;
  font-weight: 500;
  font-size: 16px;
  line-height: 16px;
  letter-spacing: 0.188422px;
  color: #d6c6f4;
  margin-top: 15px;
  text-align: left;
  margin-left: 3px;
}
.combo-plan .net-flix-comboinfo-verbiage {
  margin: 20px 12% 0px 12%;
  text-align: start;
}
.combo-plan .ottchanels {
  font-family: volte_medium;
  color: #564372;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 20px;
  display: flex;
  align-items: flex-end;
}
.combo-plan .channel-name {
  background: #020005;
  border: solid #f3cbe3 4px;
  border-radius: 4px;
  font-size: 24px;
  color: #f3cbe3;
  padding: 5px 13px;
  margin-left: 6px;
  margin-right: 16px;
  font-weight: bolder;
}
.combo-plan .lg-mt-29 {
  margin-top: 29px;
}
.combo-plan .border-image-plus {
  position: relative;
  margin-top: 10%;
}
.combo-plan .border-image-plus img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 10px 10px;
}
.combo-plan .border-image-plus .first-img {
  background: #EFE8FB;
}
.combo-plan .channel-count {
  color: #564372;
  font-style: normal;
  font-weight: 400;
  font-size: 27px;
}
.combo-plan .verbiage-text {
  color: #d6c6f4;
  font-weight: 400;
  font-size: 12px;
  text-align: start;
  padding: 0px 15px;
}
.combo-plan .renewal-text {
  color: #d6c6f4;
  font-style: normal;
  font-family: volte_reg;
  font-weight: 500;
  font-size: 14px;
  margin-top: 12px;
}
.combo-plan .product-name {
  font-size: 24px;
  font-weight: 500;
  color: #ffffff;
  text-align: start;
  margin-top: 35px;
  display: flex;
  justify-content: space-between;
  font-family: volte_medium;
  margin-bottom: 19.5px;
}
.combo-plan .product-name div:first-child {
  width: 70%;
}
.combo-plan .inline-center .product-name-price {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 20px;
  text-align: right;
  letter-spacing: -0.5px;
  color: #ffffff;
  text-align: left;
  opacity: 0.75;
}
.combo-plan .product-name-price {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 24px;
  line-height: 30px;
  letter-spacing: -0.5px;
  color: #ffffff;
}
.combo-plan .button-wrapper {
  width: 640px;
  height: 73px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #020005;
  mix-blend-mode: normal;
  border: 2px solid #564372;
  box-sizing: border-box;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  padding: 16px 15px 17px;
  margin: 20px 0;
  cursor: pointer;
}
.combo-plan .button-wrapper div:nth-child(1) {
  display: flex;
  align-items: center;
  padding-left: 3px;
}
.combo-plan .button-wrapper div:nth-child(1) img {
  width: 29px;
  height: auto;
}
.combo-plan .button-wrapper div:nth-child(1) p {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  padding-left: 24px;
  font-family: volte_medium;
  color: #ffffff;
}
.combo-plan .myplan-bgimage-container {
  padding-bottom: 30px;
}
.combo-plan .center {
  display: flex;
  justify-content: center;
  align-items: flex-end;
}
.combo-plan .netflix-container {
  width: 300px;
  height: 89px;
  margin: 0px 26px;
  height: 67%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.combo-plan .netflix-container .nextflix-sub-title {
  width: 100%;
}
.combo-plan .netflix-container .nextflix-sub-title p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 16px;
  color: #564372;
  text-align: start;
  margin-top: 5px;
}
.combo-plan .netflix-container .netflix-sub-conatiner {
  border: 1px solid #564372;
  border-radius: 5px;
  padding: 10px 15px;
  background: linear-gradient(91.54deg, #000000 2.87%, rgba(0, 0, 0, 0.902) 36.94%, rgba(0, 0, 0, 0.624) 100.5%, rgba(0, 0, 0, 0.92) 100.51%);
}
.combo-plan .netflix-container .netflix-sub-conatiner .card-image {
  width: 80px;
  height: 21px;
}
.combo-plan .netflix-container .netflix-sub-conatiner .card-image img {
  width: 100%;
  height: 100%;
}
.combo-plan .netflix-container .netflix-sub-conatiner .card-text p {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 12px;
  line-height: 15px;
  margin-top: 6px;
  color: #ffffff;
  text-align: start;
}
.combo-plan .expired {
  border: 1px solid #e56c6c !important;
}
.combo-plan .my-plans-wrapper {
  margin: 12px auto;
  text-align: center;
  max-width: 730px;
  position: relative;
}
.combo-plan .my-plans-wrapper h3:nth-child(1) {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: center;
  color: #ffffff;
}
.combo-plan .my-plans-wrapper .cancel-button {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: center;
  color: #f3cbe3;
  cursor: pointer;
  margin-top: 60px;
}
.combo-plan .my-plans-wrapper .my-plans-container {
  background: #EFE8FB;
  margin-top: 30px;
  padding: 20px 4px 19px 6px;
  border-radius: 20px;
  border: 1px solid #564372;
  display: flex;
}
.combo-plan .my-plans-wrapper .my-plans-container .footer-msg {
  font-family: volte_reg;
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  letter-spacing: 0px;
  text-align: center;
  color: rgba(255, 255, 255, 0.75);
  margin: 0px 5px;
  padding: 0 8px;
}
.combo-plan .my-plans-wrapper .my-plans-container .error-msg {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: center;
  color: #e56c6c;
}
.combo-plan .my-plans-wrapper .my-plans-container .auto-renew {
  color: rgba(255, 255, 255, 0.75);
}
.combo-plan .my-plans-wrapper .footer-text-container {
  padding: 25px 0;
  opacity: 0.75;
}
.combo-plan .my-plans-wrapper .footer-text-container .footer-text-first {
  color: #d6c6f4;
  font-size: 20px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  margin-top: 80px;
}
.combo-plan .my-plans-wrapper .footer-text-container .footer-text-second {
  color: #d6c6f4;
  font-size: 20px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  margin-top: 20px;
}
@media only screen and (max-width: 1024px) {
  .combo-plan .my-plans-wrapper .footer-text-container {
    padding: 20px 0;
  }
  .combo-plan .my-plans-wrapper .footer-text-container .footer-text-first {
    font-size: 12px;
    margin-top: 10px;
    line-height: 120%;
  }
  .combo-plan .my-plans-wrapper .footer-text-container .footer-text-second {
    font-size: 12px;
    margin-top: 10px;
    line-height: 120%;
    padding: 0 10px;
  }
}
.combo-plan .my-plans-wrapper .border-line {
  border: 1px solid #8e81a1;
  height: 85%;
}
.combo-plan .my-plans-wrapper .my-plans-heading {
  padding-left: 15px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .pack-heading {
  display: flex;
  align-items: center;
}
.combo-plan .my-plans-wrapper .my-plans-heading .pack-heading .crown-image {
  padding-right: 12px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .pack-heading .crown-image img {
  width: 40px;
  height: 40px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .pack-heading p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  color: #564372;
}
.combo-plan .my-plans-wrapper .my-plans-heading .price-wrapper {
  margin-top: 15px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.combo-plan .my-plans-wrapper .my-plans-heading .price-wrapper span:nth-child(1) {
  font-family: volte_medium;
  font-weight: 600;
  color: #220046;
  font-size: 24px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .price-wrapper span:nth-child(2) {
  font-family: volte_medium;
  font-weight: 500;
  color: #220046;
  font-size: 20px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .price-wrapper .expire-msg {
  color: #564372;
  font-family: volte_medium;
  font-size: 16px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .platform-wrapper {
  text-align: start;
  margin-top: 10px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .platform-wrapper p {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  font-family: volte_medium;
  color: #220046;
}
.combo-plan .my-plans-wrapper .my-plans-heading .platform-wrapper p span:nth-child(1) {
  font-family: volte_semiBold;
  font-size: 20px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .platform-wrapper p span:nth-child(2) {
  font-family: volte_semiBold;
}
.combo-plan .my-plans-wrapper .my-plans-heading .active {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.combo-plan .my-plans-wrapper .my-plans-heading .left-heading {
  display: flex;
  align-items: center;
}
.combo-plan .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper {
  width: 29px;
  height: 23px;
}
.combo-plan .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper img {
  width: 100%;
}
.combo-plan .my-plans-wrapper .my-plans-heading .left-heading p:nth-child(2) {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  padding-left: 23px;
  color: #ffffff;
  font-family: volte_medium;
}
.combo-plan .my-plans-wrapper .my-plans-heading .right-heading {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  font-family: volte_medium;
  color: #ffffff;
}
.combo-plan .my-plans-wrapper .my-plans-heading .right-heading .apps-count {
  font-family: volte_reg;
  color: #ffffff;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 20px;
  margin-left: 12px;
}
.combo-plan .my-plans-wrapper .content-wrapper {
  width: 60px;
  height: 60px;
  text-align: center;
  margin: 0px 12px 10px 12px;
}
.combo-plan .my-plans-wrapper .content-wrapper img {
  width: 100%;
  height: 100%;
  mix-blend-mode: normal;
}
.combo-plan .my-plans-wrapper .partner-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin: 11px 0px 13px 0px;
}
.combo-plan .my-plans-wrapper .button-wrapper {
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%) !important;
}
.combo-plan .my-plans-wrapper .btn-wrapper {
  padding: 9px 52px;
  width: 420px;
  height: 45px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin: 20px auto;
}
.combo-plan .my-plans-wrapper .btn-wrapper .button-text {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
}
.combo-plan .my-plans-wrapper .other-option {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  cursor: pointer;
  font-family: volte_medium;
  color: #f3cbe3;
}
.combo-plan .myplan-bgimage-container-combo {
  padding-bottom: 30px;
}

@media only screen and (max-width: 1024px) {
  .combo-plan .my-plans-wrapper {
    margin: 0 auto;
    width: 90%;
  }
  .combo-plan .my-plans-wrapper h3:nth-child(1) {
    font-size: 22px;
  }
  .combo-plan .my-plans-wrapper .cancel-button {
    font-size: 16px;
    margin-top: 20px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .error-msg {
    font-size: 16px;
  }
  .combo-plan .my-plans-wrapper .border-line {
    margin: 15px 0px;
    border: 1px solid #8e81a1;
  }
  .combo-plan .my-plans-wrapper .my-plans-heading {
    padding: 0px;
  }
  .combo-plan .my-plans-wrapper .my-plans-heading .left-heading {
    display: flex;
    align-items: center;
  }
  .combo-plan .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper {
    width: 19px;
    height: 15px;
  }
  .combo-plan .my-plans-wrapper .my-plans-heading .left-heading .img-wrapper img {
    width: 100%;
  }
  .combo-plan .my-plans-wrapper .my-plans-heading .left-heading p:nth-child(2) {
    font-size: 16px;
    padding-left: 10px;
    font-weight: 400;
  }
  .combo-plan .my-plans-wrapper .my-plans-heading .right-heading .apps-count {
    margin-left: 0;
    font-size: 18px;
  }
  .combo-plan .my-plans-wrapper .content-wrapper {
    width: 50px;
    height: 50px;
    margin: 5px;
  }
  .combo-plan .my-plans-wrapper .content-wrapper img {
    width: 100%;
    height: 100%;
  }
  .combo-plan .my-plans-wrapper .partner-container {
    padding: 0px;
    margin: 12px 0 13px 0;
    justify-content: center;
  }
  .combo-plan .my-plans-wrapper .btn-wrapper {
    padding: 9px 52px;
    width: 90%;
    height: 44px;
    margin: 15px auto;
  }
  .combo-plan .my-plans-wrapper .btn-wrapper .button-text {
    font-size: 16px;
    font-family: volte_semiBold;
  }
  .combo-plan .my-plans-wrapper .other-option {
    font-size: 16px;
    font-family: volte_medium;
    color: #f3cbe3;
  }
  .combo-plan .border-image-plus {
    position: relative;
    margin-top: 0%;
  }
  .combo-plan .border-image-plus img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 0px 10px;
    height: 18px;
  }
  .combo-plan .my-plans-container {
    display: block !important;
    padding: 13px 15px 14px 15px !important;
    margin-top: 16px !important;
  }
  .combo-plan .channel-count {
    color: #564372;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
  }
  .combo-plan .ottchanels {
    display: block;
    justify-content: start;
  }
  .combo-plan .lg-d-grid {
    display: block;
  }
  .combo-plan .lg-mt-29 {
    margin-top: 0px;
  }
  .combo-plan .channel-name {
    border: solid #f3cbe3 1.81733px;
    border-radius: 2px;
    font-size: 12px;
    color: #f3cbe3;
    padding: 3px 7px !important;
    margin-left: 6px;
    margin-right: 6px;
  }
  .combo-plan .product-name {
    font-size: 19px;
    font-weight: 400;
    color: #ffffff;
    text-align: start;
    margin-top: 20px;
    margin-bottom: 12px;
  }
  .combo-plan .product-name div:first-child {
    width: 100%;
  }
  .combo-plan .renewal-text {
    margin-top: 0px;
    color: #fff;
  }
  .combo-plan .channels-view {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 0;
    margin-bottom: 10px;
    width: 100%;
    padding: 0 4px;
  }
  .combo-plan .button-wrapper {
    height: 56px;
    padding: 16px 15px 17px;
    margin: 15px 0;
  }
  .combo-plan .button-wrapper div:nth-child(1) {
    padding-left: 3px;
  }
  .combo-plan .button-wrapper div:nth-child(1) img {
    width: 19px;
    height: 15px;
  }
  .combo-plan .button-wrapper div:nth-child(1) p {
    font-size: 16px;
    padding-left: 10.67px;
  }
  .combo-plan .partner-desc {
    padding: 0;
  }
  .combo-plan .netflix-container {
    width: 100%;
    margin: 0;
    padding: 0 4px;
  }
  .combo-plan .comboinfo-verbiage {
    font-size: 12px;
    text-align: initial;
    padding: 0 4px;
    color: #564372;
  }
  .combo-plan .inline-center {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
  }
}
.more-options-container .popupSec {
  width: 640px;
  max-height: 351px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border-radius: 20px;
  padding: 58px 110px 30px;
  border: 1px solid #564372;
}
.more-options-container .popupSec .modal-body {
  padding: 0;
}
.more-options-container .popupSec .modal-header {
  padding: 0;
}
.more-options-container .popupSec .modal-header h3 {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  font-family: volte_medium;
  text-align: center;
  color: #ffffff;
}
.more-options-container .popupSec .not-now {
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  cursor: pointer;
  color: #f3cbe3;
}

@media only screen and (max-width: 640px) {
  .more-options-container .popupSec {
    width: 90%;
    max-height: 178px;
    border-radius: 20px 20px;
    padding: 20px;
  }
  .more-options-container .popupSec .modal-header h3 {
    font-size: 22px;
  }
  .more-options-container .popupSec .not-now {
    font-size: 18px;
  }
  .amazon-container {
    margin: 0 auto;
    width: 100%;
  }
}
@media only screen and (max-width: 480px) {
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading {
    width: 100%;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading .crown-image {
    padding-right: 6px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading .crown-image img {
    width: 20px;
    height: 20px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading p {
    font-size: 12px;
    line-height: 120%;
    text-align: start;
    color: #220046;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading div:last-child {
    width: 72%;
    text-align: right;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading div:last-child span:nth-child(1) {
    font-family: volte_medium;
    font-weight: 600;
    color: #220046;
    font-size: 24px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .pack-heading div:last-child span:nth-child(2) {
    font-family: volte_medium;
    font-weight: 600;
    color: #220046;
    font-size: 12px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper {
    margin-top: 6.5px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper .platform-wrapper {
    margin-top: 0px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper .platform-wrapper .apps-count {
    font-weight: 500;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper .platform-wrapper .apps-count span:nth-child(1) {
    font-size: 12px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper .platform-wrapper .apps-count span:nth-child(2) {
    font-size: 12px;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper .platform-wrapper .apps-count span:nth-child(3) {
    font-size: 12px;
    font-family: volte_medium;
    color: #220046;
  }
  .combo-plan .my-plans-wrapper .my-plans-container .my-plans-heading .price-wrapper .expire-msg {
    color: #220046;
    font-family: volte_medium;
    font-size: 12px;
    font-weight: 500;
    text-align: end;
  }
  .combo-plan .my-plans-wrapper .partner-container {
    justify-content: unset;
  }
  .combo-plan .my-plans-wrapper .partner-container .content-wrapper {
    margin: 0 12px 10px 0;
  }
}
@media only screen and (max-width: 480px) and (max-width: 375px) {
  .combo-plan .my-plans-wrapper .partner-container .content-wrapper {
    margin: 0 8px 8px 0;
  }
}
@media only screen and (max-width: 480px) {
  .combo-plan .netflix-container .nextflix-sub-title p {
    margin-top: 7px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.container .header-msg {
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  font-family: volte_medium;
}
.container .footer-msg {
  margin-top: 5px;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #a3a6c2;
  font-family: volte_medium;
}
.container .expire-msg {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  margin-top: 12px;
  color: #f3cbe3;
  font-family: volte_reg;
}
.container .btn-wrapper-later {
  border-radius: 22px;
  margin-top: 20px;
  margin-bottom: 10px;
  display: block;
  width: 100%;
}
.container .btn-wrapper-later .button-text {
  font-size: 16px;
}
.container .btn-wrapper-proceed {
  background: transparent;
  border-radius: 22px;
  display: block;
  width: 100%;
  border: 2px solid #f3cbe3;
}
.container .btn-wrapper-proceed .button-text {
  color: white;
  font-size: 16px;
}

.cancel-plan-error .popupSec {
  height: 170px;
}
.cancel-plan-error .popupSec h1 {
  margin: 20px auto;
}

@media only screen and (max-width: 480px) {
  .container .header-msg {
    font-size: 20px;
  }
  .container .footer-msg {
    font-size: 16px;
  }
  .container .expire-msg {
    font-size: 16px;
    margin-top: 10px;
  }
  .container .btn-wrapper-later {
    margin-top: 15px;
    margin-bottom: 8px;
  }
  .container .btn-wrapper-later .button-text {
    font-size: 14px;
  }
  .container .btn-wrapper-proceed .button-text {
    color: white;
    font-size: 14px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.subscription-container {
  padding-top: 1px;
}
.subscription-container .subscription-background {
  position: absolute;
  width: 100%;
  min-height: 400px;
  right: 0;
  top: -3.5rem;
  background-size: cover;
  background-repeat: no-repeat;
}
.subscription-container .subscription-background.hide-background-img img {
  display: none;
}
.subscription-container .subscription-background img {
  width: 100%;
  max-height: 488px;
  position: absolute;
}

@media only screen and (max-width: 480px) {
  .subscription-container .subscription-background {
    opacity: 0.55;
    top: 0;
    background: url(/3523b0428b540e4eb30ae4f36076af92.png);
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.payment-container {
  padding: 1.6% 5.4% 5% 5.2%;
}
.payment-container .payment-gateway-wrapper {
  width: 600px;
  margin: 20px auto;
  display: flex;
  flex-direction: column;
}
@media only screen and (max-width: 768px) {
  .payment-container .payment-gateway-wrapper {
    width: 100%;
  }
  .payment-container .payment-gateway-wrapper .back-arrow {
    top: 0;
  }
}
.payment-container .payment-gateway-wrapper .back-arrow {
  width: 24px;
  height: 24px;
  cursor: pointer;
  position: absolute;
  left: 4.8%;
}
.payment-container .payment-gateway-wrapper .amount-wrapper {
  padding: 37px 0;
  width: 100%;
  background: linear-gradient(99.16deg, #8E81A1 0.32%, #564372 40.3%, #220046 78.3%, #030106 99.48%);
}
.payment-container .payment-gateway-wrapper .amount-wrapper h3 {
  font-style: normal;
  font-weight: normal;
  font-family: volte_reg;
  font-size: 24px;
  line-height: 120%;
  color: #ffffff;
  width: 600px;
  margin: 0 auto;
  text-align: center;
  width: 100%;
}
.payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount {
  width: 100%;
  display: flex;
  align-items: center;
  padding-top: 21px;
  justify-content: center;
}
.payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount img {
  width: 32px;
  height: 32px;
}
.payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount .text {
  font-size: 24px;
  line-height: 110%;
  font-family: volte_medium !important;
  color: #ffffff;
  padding: 0 12px;
}
.payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount .amount {
  color: #ffffff;
  font-family: volte_medium !important;
  font-size: 24px;
  line-height: 120%;
}
.payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount .disable_actual_amount {
  color: #8e81a1;
  font-family: volte_medium !important;
  font-size: 14px;
  text-decoration-line: line-through;
  line-height: 120%;
  margin-right: 6px;
}
.payment-container .payment-gateway-wrapper .amount-wrapper .coupon_code_text {
  color: #ffffff;
  font-family: volte_medium !important;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 21.5px;
  margin-top: 18px;
  text-align: center;
  margin-left: 2em;
}
.payment-container .payment-gateway-wrapper .balance-wrapper {
  padding: 18px 20px;
  background: #564372;
}
.payment-container .payment-gateway-wrapper .balance-wrapper p {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  font-family: volte_medium;
  /* or 19px */
  /* White */
  color: #ffffff;
}
.payment-container .payment-gateway-wrapper .balance-show {
  display: flex;
  flex-direction: column;
  padding: 8px 20px;
  background: #EFE8FB;
  border: 1px solid #564372;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper {
  display: flex;
  align-items: center;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(1) {
  width: 18px;
  height: 16px;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(1) img {
  width: 100%;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) {
  padding-left: 16.25px;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) p:nth-child(1) {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  font-family: volte_medium;
  color: #220046;
  /* or 19px */
  /* White */
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) p:nth-child(2) {
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 110%;
  padding-top: 5.5px;
  font-family: volte_medium;
  color: #564372;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show {
  display: inline-flex;
  align-items: center;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show p {
  font-size: 16px;
  color: #220046;
  padding-right: 1px;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show .checkbox .checkbox-text {
  margin-right: 30px;
  font-size: 16px;
  line-height: 120%;
  color: #220046;
}
.payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show .checkbox label {
  border-radius: 50%;
}
.payment-container .payment-gateway-wrapper .balance-show .make-payment-btn {
  padding-left: 34px;
  margin-top: 10px;
}
.payment-container .payment-gateway-wrapper .balance-show .make-payment-btn p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #c7c0cf;
  margin-bottom: 10px;
}
.payment-container .payment-gateway-wrapper .balance-show .make-payment-btn p.err-msg {
  color: #E56C6C;
}
.payment-container .payment-gateway-wrapper .balance-show .make-payment-btn .primary-btn {
  font-size: 14px !important;
  padding: 14px;
}
.payment-container .payment-gateway-wrapper .balance-show .make-payment-btn .btn {
  width: 180px;
}
.payment-container .payment-gateway-wrapper .more-methods {
  margin: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.payment-container .payment-gateway-wrapper .more-methods .hr {
  width: 100px;
  border: 0.5px solid #D6C6F4;
}
.payment-container .payment-gateway-wrapper .more-methods div:nth-child(2) {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  font-family: volte_medium !important;
  text-align: center;
  color: #D6C6F4;
}
.payment-container .payment-gateway-wrapper .dummy-block {
  min-height: 70px;
}
.payment-container .payment-frame-block {
  width: 100%;
  height: 580px;
}

@media only screen and (max-width: 480px) {
  .payment-container {
    height: 100vh;
    padding: 0 !important;
    overflow: auto;
  }
  .payment-container h3 {
    font-size: 18px;
    width: 100%;
  }
  .payment-container .payment-gateway-wrapper {
    margin: 15px auto;
    margin-bottom: 100px;
    padding-bottom: env(safe-area-inset-bottom, 100px);
    height: 100%;
  }
  .payment-container .payment-gateway-wrapper .amount-wrapper {
    padding: 27px 0px;
    width: 100%;
  }
  .payment-container .payment-gateway-wrapper .amount-wrapper h3 {
    font-size: 22px;
  }
  .payment-container .payment-gateway-wrapper .amount-wrapper .coupon_code_text {
    font-size: 14px;
  }
  .payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount {
    justify-content: center;
  }
  .payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount .text {
    font-size: 20px;
  }
  .payment-container .payment-gateway-wrapper .amount-wrapper .payable-amount .amount {
    font-size: 20px;
  }
  .payment-container .payment-gateway-wrapper .balance-wrapper {
    padding: 18px 16px;
  }
  .payment-container .payment-gateway-wrapper .balance-wrapper p {
    font-size: 14px;
    /* or 19px */
    /* White */
  }
  .payment-container .payment-gateway-wrapper .balance-show {
    padding: 8px 17px;
    border-bottom: 1px solid #564372;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(1) {
    width: 18px;
    height: 16px;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(1) img {
    width: 100%;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) {
    padding-left: 13px;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) p:nth-child(1) {
    font-size: 16px;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) p:nth-child(2) {
    font-size: 14px;
    padding-top: 4px;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show p {
    font-size: 16px;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show .checkbox .checkbox-text {
    margin-right: 15px !important;
    font-size: 16px;
  }
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .amount-show .checkbox .unchecked {
    background-color: #564372;
  }
  .payment-container .payment-gateway-wrapper .more-methods {
    margin: 18px auto;
    margin-bottom: 9px;
    width: 90%;
  }
  .payment-container .payment-gateway-wrapper .more-methods .hr {
    width: 50px;
  }
  .payment-container .payment-gateway-wrapper .more-methods div:nth-child(2) {
    font-size: 16px;
  }
  .payment-container .payment-frame-block {
    height: 100%;
  }
}
@media only screen and (max-width: 350px) {
  .payment-container .payment-gateway-wrapper .balance-show .wallet-container .wallet-wrapper div:nth-child(2) p:nth-child(2) {
    font-size: 10px;
  }
  .payment-container .payment-frame-block {
    height: 40vh;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.sec-container {
  text-align: center;
  color: #fff;
  padding: 30px;
  width: fit-content;
  margin: auto;
  margin-bottom: 20px;
  padding-top: 15px;
}
.sec-container .title-sec {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 25px;
}
.sec-container .title-sec h2 {
  font-size: 32px;
  font-weight: 700;
  color: #fff;
  text-shadow: 2.56px 1.46px 0px rgb(225, 0, 146);
}
.sec-container .title-sec .arrow-app-download {
  width: 350px;
  height: auto;
  margin: 0 50px;
  font-size: initial;
  text-shadow: none;
  color: white;
}
.sec-container .features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  justify-content: center;
  gap: 20px;
  margin: 25px auto;
  max-width: 950px;
  font-size: 18px;
}
.sec-container .features-grid > :nth-child(5) {
  grid-column: 2/3;
  justify-self: center;
}
.sec-container .features-grid > :nth-child(6) {
  grid-column: 3/4;
  justify-self: center;
}
.sec-container .features-grid .feature-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
}
.sec-container .features-grid .feature-item .feature-icon {
  width: 50px;
  height: 50px;
}
.sec-container .features-grid .feature-item .feature-label {
  font-size: 18px;
  line-height: normal;
}
.sec-container .view-plans {
  font-family: volte_reg;
  width: 300px;
  height: 50px;
  background-color: transparent;
  border: 2px solid #f3cbe3;
  color: #f3cbe3;
  font-size: 22px;
  font-weight: 600;
  border-radius: 4px;
  cursor: pointer;
}

@media only screen and (min-width: 320px) and (max-width: 780px) {
  .sec-container {
    padding: unset;
    margin-bottom: 32px;
  }
  .sec-container .title-sec {
    margin-top: 35px;
  }
  .sec-container .title-sec .arrow-app-download {
    width: unset;
    margin: 0 auto;
  }
  .sec-container .title-sec h2 {
    font-size: 24px;
    text-shadow: 1.44px 0.83px 0px rgb(225, 0, 146);
  }
  .sec-container .features-grid {
    display: flex;
    flex-wrap: wrap;
    padding-left: 40px;
    padding-right: 40px;
    margin: 20px auto;
  }
  .sec-container .features-grid > * {
    flex: 1 1 calc(50% - 20px) !important;
  }
  .sec-container .features-grid .feature-item .feature-label {
    font-size: 14px;
  }
  .sec-container .view-plans {
    font-size: 16px;
  }
}
@media only screen and (min-width: 781px) and (max-width: 900px) {
  .sec-container .title-sec .arrow-app-download {
    width: 153px;
  }
  .sec-container .title-sec h2 {
    font-size: 21px;
  }
}
@media only screen and (min-width: 901px) and (max-width: 1000px) {
  .sec-container .title-sec .arrow-app-download {
    width: 210px;
  }
  .sec-container .title-sec h2 {
    font-size: 21px;
  }
}
@media only screen and (min-width: 1001px) and (max-width: 1100px) {
  .sec-container .title-sec .arrow-app-download {
    width: 210px;
  }
  .sec-container .title-sec h2 {
    font-size: 26px;
  }
}
@media only screen and (min-width: 1101px) and (max-width: 1200px) {
  .sec-container .title-sec .arrow-app-download {
    width: 260px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1300px) {
  .sec-container .title-sec .arrow-app-download {
    width: 310px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.ui-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 118px;
  padding: 20px 130px;
  border: 1.6px solid rgb(86, 67, 114);
  border-radius: 8px;
  width: fit-content;
  margin: auto;
}
.ui-container .playstore-item {
  display: flex;
  flex-direction: column;
  text-align: center;
}
.ui-container .playstore-item .playstore-rating-container {
  display: flex;
  align-items: center;
  gap: 4px;
}
.ui-container .playstore-item .playstore-rating-container .rating-icon-app-download {
  width: 115px;
  color: white;
}
.ui-container .playstore-item .playstore-text-main {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.ui-container .playstore-item .playstore-text-main .store-icon-app-download {
  width: 20px;
  color: white;
}
.ui-container .playstore-item .playstore-text-main .playstore-text {
  font-size: 18px;
  color: #fff;
  margin-left: 8px;
}
.ui-container .ui-divider {
  width: 1.5px;
  height: 100px;
  background-color: rgb(255, 255, 255);
}
.ui-container .downloads-item {
  display: flex;
  flex-direction: column;
}
.ui-container .downloads-item .downloads-number {
  font-size: 65px;
  font-weight: bold;
  color: rgb(246, 231, 1);
  text-shadow: 2.56px 1.46px 0px rgb(225, 0, 146);
}
.ui-container .downloads-item .downloads-number .download-icon-app-download {
  width: 144px;
  padding-top: 15px;
  font-size: initial;
  text-shadow: none;
  color: white;
}
.ui-container .downloads-item .downloads-text {
  font-size: 18px;
  text-align: center;
  color: #fff;
}

@media only screen and (min-width: 480px) and (max-width: 780px) {
  .ui-container {
    width: 420px !important;
    margin: 0 auto !important;
    margin-bottom: 20px !important;
  }
}
@media only screen and (min-width: 781px) and (max-width: 900px) {
  .ui-container {
    gap: 48px;
    padding: 20px 60px;
  }
}
@media only screen and (min-width: 901px) and (max-width: 1000px) {
  .ui-container {
    gap: 48px;
    padding: 20px 70px;
  }
}
@media only screen and (min-width: 1001px) and (max-width: 1100px) {
  .ui-container {
    gap: 57px;
    padding: 20px 80px;
  }
}
@media only screen and (min-width: 1101px) and (max-width: 1200px) {
  .ui-container {
    gap: 80px;
    padding: 20px 115px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1300px) {
  .ui-container {
    padding: 20px 90px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 780px) {
  .ui-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 30px;
    padding: 10px;
    margin: 10px 10px 30px 10px;
    border: 4px solid rgb(86, 67, 114);
    border-radius: 8px;
    width: fit-content;
  }
  .ui-container .playstore-item .playstore-rating-container {
    justify-content: center;
  }
  .ui-container .playstore-item .playstore-rating-container .rating-icon-app-download {
    width: 78px;
  }
  .ui-container .downloads-item .downloads-number {
    font-size: 42px;
  }
  .ui-container .downloads-item .downloads-number .download-icon-app-download {
    width: 95px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.binge-container {
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  color: white;
  text-align: center;
  border: 1.6px solid rgb(86, 67, 114);
  width: fit-content;
  margin: auto;
  border-radius: 13px;
  margin-top: 30px;
  margin-bottom: 20px;
  padding-top: 20px;
  padding-bottom: 30px;
  padding-left: 10px;
  padding-right: 20px;
}
.binge-container .binge-logo-app-download {
  width: 100px;
}
.binge-container .binge-subtitle {
  font-size: 24px;
  font-weight: 600;
  margin-bottom: 30px;
  margin-top: 10px;
}
.binge-container .binge-icons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 103px;
}
.binge-container .binge-icons img {
  width: 60px;
  height: 60px;
  object-fit: contain;
}

@media only screen and (min-width: 480px) and (max-width: 780px) {
  .binge-container {
    width: 420px !important;
    margin: 0 auto !important;
    margin-bottom: 20px !important;
  }
}
@media only screen and (min-width: 781px) and (max-width: 900px) {
  .binge-container {
    padding-left: 5px;
    padding-right: 5px;
  }
  .binge-container .binge-icons {
    gap: 23px;
  }
}
@media only screen and (min-width: 901px) and (max-width: 1000px) {
  .binge-container .binge-icons {
    gap: 22px;
  }
}
@media only screen and (min-width: 1001px) and (max-width: 1100px) {
  .binge-container .binge-icons {
    gap: 33.5px;
  }
}
@media only screen and (min-width: 1101px) and (max-width: 1200px) {
  .binge-container .binge-icons {
    gap: 66px;
  }
}
@media only screen and (min-width: 1201px) and (max-width: 1300px) {
  .binge-container .binge-icons {
    gap: 86px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 780px) {
  .binge-container {
    margin: 0 10px 30px 10px;
    padding: 27px 10px;
    width: auto;
  }
  .binge-container .binge-logo-app-download {
    display: flex;
    width: 48px;
    margin-left: 4px;
  }
  .binge-container .binge-subtitle {
    font-size: 16px;
    font-weight: 500;
    text-align: left;
    margin: 6px 0 16px 4px;
  }
  .binge-container .binge-icons {
    column-gap: 50px;
    row-gap: 10px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding-left: 5px;
  }
  .binge-container .binge-icons img {
    object-fit: contain;
    height: 35px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.auto-Suggestion-container {
  height: 360px;
  overflow: initial !important;
  width: 100%;
  white-space: unset !important;
}
.auto-Suggestion-container .content-container {
  display: flex;
  color: #8e81a1;
  font-size: 16px;
  font-family: volte_medium;
  font-weight: 500;
  padding-bottom: 16px;
  cursor: pointer;
}
.auto-Suggestion-container .content-container .content-wrapper {
  width: 63%;
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  text-align: -webkit-left;
}
.auto-Suggestion-container .content-container .content-wrapper .title-wrapper {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 16px;
  font-weight: 500;
  font-family: volte_medium;
}
.auto-Suggestion-container .content-container .content-wrapper .title-wrapper .highlight-text {
  font-weight: 600;
  float: unset;
  font-size: 16px;
  padding-top: 0px;
  color: #ffffff;
  display: unset;
}
.auto-Suggestion-container .content-container .content-wrapper .text-wrapper {
  flex-direction: row;
  display: flex;
  flex-wrap: wrap;
  justify-content: unset;
  width: 100%;
}
.auto-Suggestion-container .content-container .content-wrapper .text-wrapper .bottom-text {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
  font-weight: 500;
}
.auto-Suggestion-container .content-container .content-wrapper .text-wrapper .live-tag {
  color: #E56C6C;
  float: unset;
  font-size: 13px;
  display: unset;
  padding-top: 0;
}
.auto-Suggestion-container .content-container .content-wrapper .text-wrapper .live-tag::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 2px;
  border-radius: 8px;
  background-color: #E56C6C;
  margin-bottom: 2px;
}
.auto-Suggestion-container .content-container .genre-image {
  background: #564372;
  border: 1px solid #564372;
  border-radius: 8px;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}
.auto-Suggestion-container .content-container .genre-image .genre-action-image {
  max-width: 68px;
  max-height: 34.8px;
}
.auto-Suggestion-container .content-container .genre-image .genre-action-image img {
  position: unset;
  width: 100%;
  height: 92%;
  max-width: unset;
  max-height: unset;
  object-fit: cover;
  overflow: unset;
}
.auto-Suggestion-container .content-container .genre-image .genre-item-title {
  font-size: 10px;
  position: unset;
  width: unset;
  height: 0;
  display: block;
  margin-top: 0px;
  margin-bottom: 8px;
}
.auto-Suggestion-container .content-container .genre-image img {
  height: 100%;
  object-fit: cover;
}
.auto-Suggestion-container .content-container .image-wrapper {
  margin-right: 16px;
  width: 92px;
  height: 52px;
  border-radius: 8px;
  position: relative;
  display: flex;
}
.auto-Suggestion-container .content-container .image-wrapper.provider-image .content-image {
  border-radius: unset;
  width: 100%;
  height: 100%;
}
.auto-Suggestion-container .content-container .image-wrapper .content-image {
  width: 100%;
  border-radius: 8px;
  height: 100%;
}
.auto-Suggestion-container .content-container .image-wrapper .broken-image {
  display: none;
}
.auto-Suggestion-container .content-container .image-wrapper .language-symbol {
  position: absolute;
  width: 20px;
  height: 22px;
  transform: translate(35px, 16px);
}
.auto-Suggestion-container .content-container .image-wrapper .language-symbol .broken-symbol {
  display: none;
}
.auto-Suggestion-container .keyword {
  padding-left: 5px;
  padding-bottom: 18px;
}
.auto-Suggestion-container .keyword .content-icon {
  width: 24px;
  height: 24px;
  margin-right: 16px;
}
.auto-Suggestion-container .keyword .title-wrapper {
  margin-top: 3px;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.auto-Suggestion-container .keyword .title-wrapper .highlight-text {
  font-weight: 600;
  float: unset;
  font-size: 16px;
  padding-top: 0px;
  color: #ffffff;
  display: unset;
}

li.auto-Suggestion-container {
  font-size: 0px;
}

@media only screen and (max-width: 480px) {
  .auto-Suggestion-container {
    width: 91%;
    height: 100%;
    margin: auto;
    padding-top: 14.5px;
  }
  .auto-Suggestion-container .content-container {
    padding-bottom: 12px;
  }
  .auto-Suggestion-container .content-container .genre-image .genre-action-image {
    max-width: 56px;
    max-height: 28px;
  }
  .auto-Suggestion-container .content-container .genre-image .genre-action-image img {
    height: 100%;
  }
  .auto-Suggestion-container .content-container .genre-image .genre-item-title {
    margin-top: 2px;
  }
  .auto-Suggestion-container .content-container .content-wrapper {
    width: 70%;
  }
  .auto-Suggestion-container .keyword {
    padding-bottom: 18px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.copyright-text {
  display: inline-block;
  margin-top: 15px;
}
.copyright-text span {
  display: block;
  font-size: 10px;
  line-height: 120%;
  font-family: volte_reg;
  color: #D7C6F4;
}
.copyright-text span:first-child {
  font-size: 12px;
  margin-bottom: 8px;
  font-family: volte_medium;
  font-weight: 500;
}
@media only screen and (max-width: 480px) {
  .copyright-text {
    margin-top: 8px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.info-box {
  color: #a3a6c2;
  display: flex;
  flex-direction: column;
}
.info-box .footer-text-bottom {
  display: inline-block;
}
.info-box .footer-text-bottom span {
  display: block;
  font-size: 10px;
  font-family: volte_reg;
  line-height: 120%;
  color: #D7C6F4;
  font-weight: 400;
}
.info-box .footer-text-bottom span:first-child {
  font-size: 16px;
  margin-bottom: 8px;
  font-family: volte_medium;
  line-height: 120%;
  font-weight: 500;
  color: #D7C6F4;
}
.info-box .footer-text-top div {
  text-indent: -9999px;
  width: 100%;
  background: url(/df950e1ecde65bc295d781ef8a591ecc.svg) no-repeat;
  cursor: pointer;
  font-size: 2.143rem;
}
.info-box .footer-text-top div:active {
  cursor: pointer;
}
@media only screen and (max-width: 480px) {
  .info-box {
    margin-top: 25px;
    margin-right: 0px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.important-links {
  display: flex;
  width: 33%;
  margin: 0 40px;
  justify-content: space-evenly;
}
.important-links ul {
  display: flex;
  flex-direction: column;
}
.important-links ul a {
  text-decoration: none;
}
.important-links ul li {
  margin: 10px 10px;
}
.important-links ul li div {
  color: #F3CBE3;
  text-decoration: none;
  font-family: volte_medium;
  font-size: 16px;
  outline: none;
  cursor: pointer;
  font-weight: 500;
  line-height: 120%;
}
.important-links ul li:first-child {
  display: flex;
  align-items: center;
}
.important-links ul li:first-child:before {
  content: "";
  background-image: url(/d012b19f863808e37f8d0b99a7b43e83.svg);
  height: 24px;
  background-size: cover;
  display: inline-block;
  width: 24px;
  margin-right: 8px;
}
.important-links ul li:first-child div {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-top: 4px;
}
@media only screen and (max-width: 480px) {
  .important-links {
    width: 100%;
    flex-direction: row;
    justify-content: space-between;
    margin: 0 0 15px 0;
  }
  .important-links ul {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    justify-content: space-between;
    width: inherit;
    align-items: self-end;
  }
  .important-links ul li {
    margin: 0 0 14px 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.bread-crumb {
  display: flex;
  margin-right: 6px;
  margin-top: 2px;
}
.bread-crumb .first {
  padding-right: 10px;
}
.bread-crumb .first .icon-Path {
  font-size: 12px;
}
.bread-crumb .first .icon-Path:before {
  color: #a3a6c2;
}
.bread-crumb .fetch {
  text-decoration: none;
}
.bread-crumb .fetch .second {
  width: max-content;
  padding-right: 10px;
  color: #a3a6c2;
  cursor: pointer;
  font-family: volte_medium;
}
.bread-crumb .fetch .second:hover {
  color: #fff;
}

.change-colour {
  color: white !important;
  font-family: volte_medium;
}
.change-colour .icon-Path::before {
  color: #fff !important;
}

footer .footer-wrapper {
  margin-top: -20px;
  border-top: 1px solid #564372;
  padding: 20px 3.8% 30px 3.8%;
  z-index: 1;
}
footer .footer-wrapper .horizontal-line {
  width: 100%;
  border: 0.6px solid #564372;
  margin-top: 25px;
}
@media only screen and (max-width: 480px) {
  footer .footer-wrapper .horizontal-line {
    margin-bottom: 10px;
  }
}
footer .footer-top-wrapper {
  display: flex;
}
footer .footer-top-wrapper .icon-home {
  font-size: 18px;
  cursor: pointer;
}
footer .footer-top-wrapper .path-fetch {
  display: flex;
  margin-left: 21px;
}
footer .horizontal-line {
  content: " ";
  display: block;
  width: 100%;
  border: 0.6px solid #444764;
  margin-bottom: 25px;
  margin-top: 15px;
}
footer .footer-bottom-wrapper {
  display: flex;
  width: 100%;
}
footer .footer-bottom-wrapper .mobile-view {
  display: none;
}
footer .footer-bottom-wrapper .web-view {
  display: block;
  width: 33%;
}
footer .connection-details {
  color: #a3a6c2;
  display: flex;
  flex-direction: column;
  width: 33%;
}
@media only screen and (max-width: 480px) {
  footer .footer-wrapper {
    bottom: 33px;
    margin-top: 0;
    padding: 20px 4.8% 85px 4.8%;
  }
  footer .second {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  footer .second.shorttext {
    width: 160px;
  }
  footer .footer-bottom-wrapper {
    flex-direction: column;
  }
  footer .footer-bottom-wrapper .web-view {
    display: none;
  }
  footer .footer-bottom-wrapper .mobile-view {
    display: block;
  }
  footer .connection-details {
    width: 100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.footer-container {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-row-gap: 49px;
  grid-column-gap: 25px;
}
.footer-container .footer-card-container .title-wrapper p {
  font-family: volte_reg;
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  color: #ffffff;
}
.footer-container .footer-card-container .link-name {
  font-family: volte_reg;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  margin-top: 20px;
  color: #F3CBE3;
}
.footer-container .footer-card-container .link-name a {
  text-decoration: none;
  color: #F3CBE3;
}
.footer-container .ellipsis-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media only screen and (max-width: 480px) {
  .footer-container {
    display: block;
  }
  .footer-container .footer-card-container {
    padding-top: 10px;
  }
  .footer-container .footer-card-container .title-wrapper {
    display: flex;
    justify-content: space-between;
  }
  .footer-container .footer-card-container .title-wrapper p {
    font-size: 16px;
  }
  .footer-container .footer-card-container .title-wrapper figure .active {
    -webkit-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  .footer-container .footer-card-container .title-wrapper figure img {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
  }
  .footer-container .footer-card-container.active .link-wrapper {
    visibility: visible;
    -webkit-transition: height 0.5s ease;
    -o-transition: height 0.5s ease;
    transition: height 0.5s ease;
    margin-bottom: 10px;
  }
  .footer-container .footer-card-container.active .link-wrapper .link-name {
    visibility: visible;
    -webkit-transition: opacity 2s ease-out;
    -o-transition: opacity 2s ease-out;
    transition: opacity 2s ease-out;
    opacity: 1;
  }
  .footer-container .footer-card-container .link-wrapper {
    visibility: hidden;
    -webkit-transition: height 0.3s ease-out;
    -o-transition: height 0.3s ease-out;
    transition: height 0.3s ease-out;
  }
  .footer-container .footer-card-container .link-wrapper .link-name {
    visibility: hidden;
    font-size: 14px;
    margin: 10px 0px;
    opacity: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

@media only screen and (max-width: 480px) {
  .global-footer-container {
    margin-bottom: -20px;
  }
  .global-footer-container .global {
    margin: 8px 0 10px 0 !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

@media only screen and (max-width: 480px) {
  .page-footer-container .page-line {
    margin-bottom: 10px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.alert-modal.rm-overlay .popup_overlay {
  background: unset;
}
.alert-modal .popupSec {
  width: 554px;
  height: auto;
  overflow-y: auto;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%) !important;
}
.alert-modal .popupSec .modal-body {
  padding: 11% 10%;
}
.alert-modal .popupSec .modal-body .alert-icon {
  font-size: 82px;
  margin-bottom: 0px;
}
.alert-modal .popupSec .modal-body .alert-icon i {
  color: #a3a6c2;
}
.alert-modal .popupSec .modal-body .alert-icon i.icon-circle-copy {
  font-size: 79px;
}
.alert-modal .popupSec .modal-body .alert-icon i.icon-alert-upd::before {
  color: #A3A6C2;
}
.alert-modal .popupSec .modal-body h1 {
  color: #ffffff;
  text-align: center;
  font-family: volte_medium;
  font-size: 26px;
  margin-bottom: 20px;
}
.alert-modal .popupSec .modal-body .btn-group {
  width: 263px;
  margin: auto;
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
}
@media only screen and (max-width: 428px) {
  .alert-modal .popupSec .modal-body .btn-group {
    width: 100%;
  }
}
.alert-modal .popupSec .modal-body .btn-group .primary-btn {
  background-color: #e10092 !important;
}
.alert-modal .popupSec .modal-body .btn-group .btn {
  width: 100%;
  margin: 24px auto 15px;
  padding: 14.5px;
  font-size: 16px;
  font-family: volte_semiBold !important;
}
.alert-modal .popupSec .modal-body .btn-group .secondary-btn {
  margin-top: 0;
  color: #f3cbe3 !important;
  text-decoration: none !important;
}
.alert-modal .popupSec .modal-body .btn-group .sec-btn-link {
  margin-top: 20px;
}
.alert-modal .popupSec .modal-body .btn-group .sec-btn-link p {
  color: #f3cbe3;
  cursor: pointer;
  display: inline-block;
  margin: auto;
}
.alert-modal .popupSec .modal-body p.instructions-text, .alert-modal .popupSec .modal-body p.extra-instructions-text,
.alert-modal .popupSec .modal-body li.instructions-text,
.alert-modal .popupSec .modal-body li.extra-instructions-text {
  word-break: break-word;
  color: white;
  font-size: 20px;
  line-height: 1.2;
  font-family: volte_reg;
}
.alert-modal .popupSec .modal-body p.instructions-text.instructions-text-list, .alert-modal .popupSec .modal-body p.extra-instructions-text.instructions-text-list,
.alert-modal .popupSec .modal-body li.instructions-text.instructions-text-list,
.alert-modal .popupSec .modal-body li.extra-instructions-text.instructions-text-list {
  text-align: left;
}
.alert-modal .popupSec .modal-body p.instructions-text.instructions-text-list p, .alert-modal .popupSec .modal-body p.extra-instructions-text.instructions-text-list p,
.alert-modal .popupSec .modal-body li.instructions-text.instructions-text-list p,
.alert-modal .popupSec .modal-body li.extra-instructions-text.instructions-text-list p {
  display: inline;
  margin-left: -10px;
  -moz-margin-start: 0;
}
@supports (-webkit-touch-callout: none) {
  .alert-modal .popupSec .modal-body p.instructions-text.instructions-text-list p, .alert-modal .popupSec .modal-body p.extra-instructions-text.instructions-text-list p,
  .alert-modal .popupSec .modal-body li.instructions-text.instructions-text-list p,
  .alert-modal .popupSec .modal-body li.extra-instructions-text.instructions-text-list p {
    /* CSS specific to iOS devices */
    margin-left: 0;
  }
}
@media not all and (min-resolution: 0.001dpcm) {
  @supports (-webkit-appearance: none) and (stroke-color: transparent) {
    .alert-modal .popupSec .modal-body p.instructions-text.instructions-text-list p, .alert-modal .popupSec .modal-body p.extra-instructions-text.instructions-text-list p,
    .alert-modal .popupSec .modal-body li.instructions-text.instructions-text-list p,
    .alert-modal .popupSec .modal-body li.extra-instructions-text.instructions-text-list p {
      margin-left: 0;
    }
  }
}
@media only screen and (min-width: 320px) and (max-width: 520px) {
  .alert-modal .popupSec .modal-body p.instructions-text img, .alert-modal .popupSec .modal-body p.extra-instructions-text img,
  .alert-modal .popupSec .modal-body li.instructions-text img,
  .alert-modal .popupSec .modal-body li.extra-instructions-text img {
    width: 55%;
    height: auto;
  }
}
.alert-modal .popupSec .modal-body .app-store-btn {
  width: 100%;
  margin-top: 20px;
}
.alert-modal .popupSec .modal-body .app-store-btn a {
  width: 40%;
  margin-right: 10px;
  display: inline-block;
}
.alert-modal .popupSec .modal-body .app-store-btn a img {
  width: 100%;
  height: 28px;
}
@media only screen and (min-width: 320px) and (max-width: 520px) {
  .alert-modal .popupSec .modal-body .modal-body h1 {
    font-size: 16px;
  }
  .alert-modal .popupSec .modal-body .alert-icon {
    font-size: 50px;
  }
}
.alert-modal .popupSec i.icon-close {
  font-size: 15px;
}
.alert-modal .recharge-distribution {
  width: 80%;
  margin: auto;
}
.alert-modal .recharge-distribution li div {
  display: flex;
  flex-direction: row;
}
.alert-modal .recharge-distribution li div span {
  font-family: volte_medium, sans-serif;
  font-size: 22px;
  color: #ffffff;
  margin-bottom: 19px;
}
.alert-modal .recharge-distribution li div span:first-child {
  flex: 1;
  text-align: left;
  width: 60%;
  overflow-wrap: break-word;
}
.alert-modal .recharge-distribution li span {
  font-family: volte_medium, sans-serif;
  font-size: 22px;
  color: #ffffff;
  margin-bottom: 19px;
}
.alert-modal .recharge-distribution li span:first-child {
  flex: 1;
  text-align: left;
}
.alert-modal .recharge-distribution li:last-child {
  display: flex;
  flex-direction: row;
  padding-top: 17px;
  border-top: 1px solid #52547a;
}
@media only screen and (max-width: 768px) {
  .alert-modal .popupSec {
    width: 75%;
    height: auto;
    min-height: auto;
    overflow-y: auto;
  }
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .hotstar .popupSec {
    min-height: 365px;
  }
}
.hotstar .instructions-text {
  margin: 0 !important;
}
.hotstar .instructions-text .primary-hotstar-text {
  margin: 20px 12px 20px 0;
  object-fit: contain;
  font-size: 35px;
  color: #ffffff;
  font-family: volte_medium;
}
.hotstar .instructions-text .secondary-hotstar-text {
  font-size: 20px;
  color: #b6b7d4;
  line-height: 25px;
  font-family: volte_medium;
}
.hotstar .modal-body {
  padding: 37px 50px 60px !important;
  height: 450px;
}
.hotstar .btn {
  margin: 30px 0 0 !important;
}

.redirection-popup .instructions-text {
  margin: 0 !important;
}
.redirection-popup .instructions-text .primary-hotstar-text {
  margin: 20px 12px 20px 0;
  object-fit: contain;
  font-size: 35px;
  color: #ffffff;
  font-family: volte_medium;
}
.redirection-popup .instructions-text .secondary-hotstar-text {
  font-size: 20px;
  color: #b6b7d4;
  line-height: 25px;
  font-family: volte_medium;
}
.redirection-popup .modal-body {
  padding: 37px 50px 60px !important;
  max-height: 450px;
}
.redirection-popup .btn {
  margin: 30px 0 0 !important;
}

.sonyLiv .instructions-text {
  margin: 0 !important;
}
.sonyLiv .instructions-text img {
  width: 130px;
  height: 130px;
}
.sonyLiv .instructions-text .primary-sonyLiv-text {
  margin: 20px 12px 2px 0;
  font-size: 20px;
  color: #b6b7d4;
  line-height: 25px;
  font-family: volte_medium;
}
.sonyLiv .modal-body {
  padding: 37px 50px 60px !important;
  height: 400px;
}
.sonyLiv .btn {
  margin: 30px 0 0 !important;
}

.vootplay .secondary-btn {
  font-size: 16px;
  font-family: volte_medium;
  background-color: transparent;
  background-image: none;
  color: #5087c7;
  border: transparent;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
}

.recharge-popup .popupSec .instructions-text {
  font-family: volte_medium, sans-serif;
  margin-bottom: 30px;
  font-size: 23px;
}

.common-modal-css .popupSec i.icon-alert-upd {
  font-size: 82px;
}
.common-modal-css .popupSec .btn-group .btn.secondary-btn {
  margin: 0;
  background: inherit;
  border: 0;
  color: #f3cbe3;
  padding: 14.5px;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .common-modal-css .popupSec i.icon-alert-upd {
    font-size: 50px;
    margin-bottom: 19px;
  }
}

.inactive-alert.app-drop-alert .popupSec {
  width: 640px;
}
.inactive-alert.app-drop-alert .popupSec .modal-body {
  padding: 2% 10%;
}
.inactive-alert.app-drop-alert .popupSec .modal-body .instructions-text {
  color: #D6C6F4;
}
.inactive-alert.app-drop-alert .popupSec .modal-body .btn-group {
  width: 280px;
}
.inactive-alert.app-drop-alert .popupSec .modal-body .btn-group .btn.primary-btn {
  border-radius: 2px;
  padding: 11.5px;
  margin: 20px auto 10px;
}
@media only screen and (min-width: 320px) and (max-width: 768px) {
  .inactive-alert.app-drop-alert .popupSec {
    width: 90%;
    overflow-y: auto;
    height: auto;
  }
  .inactive-alert.app-drop-alert .popupSec .modal-body {
    padding: 20px 20px 30px;
  }
  .inactive-alert.app-drop-alert .popupSec .modal-body .alert-icon {
    margin-bottom: 5px;
  }
  .inactive-alert.app-drop-alert .popupSec .modal-body h1 {
    font-size: 22px;
    margin-bottom: 10px;
    line-height: 120%;
    /* 26.4px */
  }
  .inactive-alert.app-drop-alert .popupSec .modal-body .instructions-text {
    font-size: 16px;
    line-height: 19.2px;
    /* 19.2px */
  }
  .inactive-alert.app-drop-alert .popupSec .modal-body .btn-group {
    width: 100%;
  }
  .inactive-alert.app-drop-alert .popupSec .modal-body .btn-group .btn.primary-btn {
    width: 100%;
    margin: 20px auto;
    border-radius: 4px;
  }
}
.inactive-alert .popupSec {
  width: 554px;
  height: auto;
}
.inactive-alert .popupSec .modal-body {
  padding: 5% 10%;
}
.inactive-alert .popupSec .modal-body .btn-group .secondary-btn {
  background: transparent;
  border: transparent;
  margin: 0;
}
.inactive-alert .popupSec .modal-body .btn-group {
  margin-bottom: 0;
}
.inactive-alert .popupSec .modal-body .instructions-text {
  font-family: volte_medium, sans-serif;
}
.inactive-alert .popupSec h1 {
  font-family: volte_medium, sans-serif;
  font-size: 35px;
  line-height: 1;
  word-wrap: break-word;
}
.inactive-alert .icon-alert-upd,
.inactive-alert .icon-group-24 {
  font-size: 82px;
}
@media only screen and (max-width: 768px) {
  .inactive-alert .popupSec {
    width: 75%;
    overflow-y: auto;
    height: auto;
  }
}

.forget-alert .popupSec {
  width: 554px;
  height: 463px;
}
.forget-alert .popupSec .icon-close {
  display: none;
}
.forget-alert .popupSec .modal-body {
  padding: 79px 137px !important;
  /* width: 448px; */
  margin: unset;
}
.forget-alert .popupSec .modal-body .btn-group .btn {
  margin: 21px auto 15px;
}
.forget-alert .popupSec .modal-body h1 {
  font-size: 35px;
  font-family: volte_medium;
  line-height: 1.2;
}
.forget-alert .popupSec .modal-body p.instructions-text {
  color: #a3a6c2;
  font-family: volte_medium;
  font-size: 16px;
}
@media only screen and (max-width: 768px) {
  .forget-alert .popupSec {
    width: 75%;
    height: auto;
    overflow-y: auto;
  }
}

.fsEdition .popupSec {
  width: 421px;
  height: auto;
  overflow-y: auto;
  border-radius: 26.3125px;
}
.fsEdition .popupSec .modal-body .instructions-text {
  font-size: 18px !important;
  margin: 0;
  color: #A3A6C2;
}
.fsEdition .popupSec .modal-body .instructions-text img {
  width: 421px;
  height: 252px;
  margin-left: -2.8rem;
  margin-top: -3rem;
  margin-bottom: 30px;
}
@media only screen and (min-width: 320px) and (max-width: 768px) {
  .fsEdition .popupSec .modal-body .instructions-text img {
    width: 320px !important;
    height: auto;
  }
}
@media only screen and (max-width: 428px) {
  .fsEdition .popupSec .modal-body .instructions-text img {
    width: 320px !important;
    margin-top: -2rem;
  }
}
.fsEdition .popupSec .modal-body .extra-instructions-text {
  margin: 12px auto 0 auto;
  font-family: volte_reg;
  font-size: 16px;
  line-height: 1.38;
  letter-spacing: normal;
  text-align: center;
  color: #b6b7d4;
}
.fsEdition .popupSec .modal-body .btn-group {
  width: 263px;
  margin: auto;
}
.fsEdition .popupSec .modal-body .btn-group .primary-btn {
  width: 100%;
  font-family: volte_medium;
  font-size: 16px;
}
.fsEdition .popupSec .modal-body .btn-group .secondary-btn {
  font-size: 16px;
  font-family: volte_medium;
  background-color: transparent;
  background-image: none;
  color: #5087c7;
  border: transparent;
  padding: 0 !important;
  margin: 0 !important;
  width: auto !important;
}
@media only screen and (max-width: 768px) {
  .fsEdition .popupSec {
    width: 75%;
    overflow-y: auto;
    height: auto;
  }
}

.fs-install .instructions-text {
  line-height: 1.38 !important;
}

.fs-register-modal.alert-modal .popupOuter {
  position: fixed;
}
.fs-register-modal.alert-modal .popupOuter .popupSec {
  width: 554px;
  height: 430px;
  border-radius: 4px;
  box-shadow: 0 2px 30px 0 rgba(0, 0, 0, 0.3);
  background-color: #1d1e30;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body {
  padding: 0;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .alert-icon {
  font-size: 62px;
  margin: 40px 0 0px 0;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .alert-icon i {
  color: #a3a6c2;
  font-size: 45px;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .alert-icon .get-icon-success-tick {
  padding: 7.5px 18.5px;
  border-radius: 50%;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .alert-icon .get-icon-success-tick i:before {
  top: 0;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body h1 {
  font-size: 35px;
  font-family: volte_medium;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .instructions-text {
  font-family: volte_medium;
  margin: 12px 15px 20px 15px;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .btn-group .btn {
  width: 263px;
  height: 50px;
  font-family: volte_medium;
}
.fs-register-modal.alert-modal .popupOuter .popupSec .modal-body .secondary-btn {
  margin: 0;
  background: inherit;
  border: 0;
  color: #f3cbe3;
  padding: 14.5px;
}
@media only screen and (max-width: 768px) {
  .fs-register-modal.alert-modal .popupOuter .popupSec {
    width: 75%;
    height: auto;
    overflow-y: auto;
  }
}

.select-pack .popupSec .modal-body h1 {
  font-family: volte_medium, sans-serif;
  font-size: 35px;
  color: #ffffff;
  margin-bottom: 40px;
}
.select-pack .popupSec .modal-body ul.pack-cancel-list li {
  padding: 0 62px;
  display: flex;
  margin-bottom: 20px;
}
.select-pack .popupSec .modal-body ul.pack-cancel-list li span {
  display: inline-block;
  flex: 1;
  text-align: left;
  font-family: volte_medium, sans-serif;
  font-size: 28px;
  color: #ffffff;
}
.select-pack .popupSec .modal-body ul.pack-cancel-list li .checkbox {
  display: inline-block;
  width: 30px;
  height: 30px;
}

.for-web {
  display: block;
}

.for-mobile {
  display: none;
}

.balance-error .icon-alert-upd {
  font-size: 82px;
}

.subscription-change-modal.alert-modal .popupSec .modal-body {
  padding-top: 17%;
}
.subscription-change-modal.alert-modal .popupSec .modal-body .alert-modal {
  margin-bottom: 18px;
}
.subscription-change-modal.alert-modal .popupSec .modal-body h1 {
  font-family: volte_medium, sans-serif;
  font-size: 35px;
  line-height: 1;
}
.subscription-change-modal.alert-modal .popupSec .modal-body i.icon-alert-upd {
  font-size: 82px;
}
.subscription-change-modal.alert-modal .popupSec .modal-body p.instructions-text {
  margin-bottom: 0;
}
.subscription-change-modal.alert-modal .popupSec .modal-body .btn-group .secondary-btn {
  background: transparent;
  border: transparent;
  margin: 0;
}
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .subscription-change-modal.alert-modal .popupSec .modal-body h1 {
    font-size: 20px;
  }
  .subscription-change-modal.alert-modal .popupSec .modal-body i.icon-alert-upd {
    font-size: 50px;
    margin-bottom: 19px;
  }
}

.language-selection-container .popupOuter {
  background-color: transparent;
}
.language-selection-container .popupOuter .popupSec {
  /* FTV Card */
  width: 760px;
  max-height: 533px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 20px;
  overflow: hidden;
}
@media only screen and (max-height: 900px) {
  .language-selection-container .popupOuter .popupSec {
    overflow: auto;
  }
}
.language-selection-container .popupOuter .popupSec .modal-body {
  padding: 0 60px;
}
.language-selection-container .popupOuter .popupSec .movie-series-height {
  padding: 0 15%;
  height: auto;
  width: 640px;
}
.language-selection-container .popupOuter .popupSec .modal-header {
  padding: 20px 0 0 0;
  background: inherit;
}
.language-selection-container .popupOuter .popupSec .modal-header h3 {
  font-family: volte_medium;
  text-align: center;
  color: white;
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
}
.language-selection-container .popupOuter .popupSec .modal-body .selected-language-btn {
  width: 280px;
  height: 46px;
  background: #e10092;
  border-radius: 22px;
  outline: none;
  margin: 22px 0 20px 0;
  border: none;
  cursor: pointer;
  color: #ffffff;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}

.movie-container .popupOuter .popupSec {
  height: auto;
  overflow-x: hidden;
  width: 640px;
}

.apple-activate-popup .popupSec {
  width: 640px;
  min-height: 400px;
  max-height: 90%;
}
.apple-activate-popup .popupSec i.icon-close {
  font-size: 23px;
  position: absolute;
  right: 58px;
  top: 30px;
}
@media only screen and (max-width: 480px) {
  .apple-activate-popup .popupSec i.icon-close {
    top: 15px;
    right: 20px;
  }
}
.apple-activate-popup .popupSec .modal-body {
  padding: 30px 60px;
}
.apple-activate-popup .popupSec .modal-body .alert-icon {
  font-size: 0px;
  margin-bottom: 14px;
}
.apple-activate-popup .popupSec .modal-body .alert-icon img {
  width: 60px;
  height: 60px;
}
.apple-activate-popup .popupSec .modal-body h1 {
  color: #ffffff;
  text-align: center;
  font-size: 26px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  /* 28.8px */
  font-family: volte_reg;
}
.apple-activate-popup .popupSec .modal-body .video-thumbnail {
  width: 100%;
  height: 293px;
  margin: 10px 0 30px 0;
  cursor: pointer;
  position: relative;
}
.apple-activate-popup .popupSec .modal-body .video-thumbnail img {
  width: 100%;
  height: 100%;
}
.apple-activate-popup .popupSec .modal-body img.apple_play_image {
  position: absolute;
  width: 60px;
  height: 60px;
  top: 116px;
  left: 210px;
}
.apple-activate-popup .popupSec .modal-body .steps-list .steps {
  display: flex;
  margin-bottom: 12px;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  /* 24px */
  width: 100%;
}
.apple-activate-popup .popupSec .modal-body .steps-list .steps > div {
  color: #ffffff;
  margin-right: 16px;
  width: 12%;
  text-align: left;
  font-family: volte_medium;
}
.apple-activate-popup .popupSec .modal-body .steps-list .steps .step-info {
  color: #d6c6f4;
  text-align: left;
  width: 82%;
}
.apple-activate-popup .popupSec .modal-body .instructions {
  margin: 12px 0 20px 0;
  color: #ffffff;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
  /* 19.2px */
  text-align: left;
}
.apple-activate-popup .popupSec .modal-body .apple-know-more-block {
  text-align: left;
}
.apple-activate-popup .popupSec .modal-body .btn-group {
  margin-bottom: 0;
}
.apple-activate-popup .popupSec .modal-body .btn-group .btn {
  margin-bottom: 0;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  font-family: volte_medium !important;
}

.apple-know-more-popup .popupSec .modal-body .instructions {
  margin: 12px 0 30px 0;
}
.apple-know-more-popup .popupSec .modal-body .btn-group .btn {
  margin-top: 0;
}

.alert-modal.amazon_popup .popupSec {
  width: 650px;
  height: 283px;
}
.alert-modal.amazon_popup .popupSec i.icon-close {
  font-size: 24px;
  top: 30px;
  right: 8.8%;
}
.alert-modal.amazon_popup .popupSec .modal-body {
  padding: 30px 60px;
}
.alert-modal.amazon_popup .popupSec .modal-body h1 {
  font-size: 24px;
  line-height: 120%;
  margin-bottom: 12px;
}
.alert-modal.amazon_popup .popupSec .modal-body p.instructions-text {
  font-size: 18px;
  color: #d6c6f4;
}
.alert-modal.amazon_popup .popupSec .modal-body .alert-icon {
  font-size: 0px;
  margin-bottom: 12px;
}
.alert-modal.amazon_popup .popupSec .modal-body .alert-icon img {
  width: 60px;
  height: 60px;
}
.alert-modal.amazon_popup .popupSec .modal-body .btn-group {
  margin-bottom: 0px;
  width: 280px;
}
.alert-modal.amazon_popup .popupSec .modal-body .btn-group .btn {
  margin: 19.5px auto 0px;
  padding: 13.4px;
  border-radius: 4px;
  border: none;
  width: 100%;
}

.alert-modal.amazon_popup.web_large .popupSec {
  width: 570px;
  height: 260px;
}

.alert-modal.delete-login .popupSec i.icon-close {
  font-size: 16px;
  top: 12%;
  right: 5%;
}
.alert-modal.delete-login .popupSec .modal-body {
  padding: 5% 10%;
}
.alert-modal.delete-login .popupSec .modal-body h1 {
  margin-bottom: unset;
}
.alert-modal.delete-login .popupSec .modal-body .btn-group {
  display: none;
}

.alert-modal.activate_combo_popup .popupSec {
  width: 640px;
  height: 349px;
}
.alert-modal.activate_combo_popup .popupSec i.icon-close {
  font-size: 24px;
  top: 30px;
  right: 8.8%;
}
.alert-modal.activate_combo_popup .popupSec .modal-body {
  padding: 30px 60px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body h1 {
  font-size: 24px;
  line-height: 28.8px;
  font-weight: 500;
  margin-bottom: 12px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body p.instructions-text {
  font-size: 18px;
  line-height: 21.6px;
  color: #D6C6F4;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .alert-icon {
  font-size: 40px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .alert-icon img {
  width: 60px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .alert-icon .image_2 {
  margin-left: 12px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .btn-group {
  margin-bottom: 0px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .btn-group .btn {
  margin: 20px auto 15px;
  padding: 13px;
  border-radius: 4px;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .btn-group .btn:hover {
  border: 2px solid #e10092;
  transition: unset;
  background-image: unset;
}
.alert-modal.activate_combo_popup .popupSec .modal-body .btn-group .secondary-btn {
  background-color: #e10092;
  color: #ffffff !important;
  margin: 0;
  border: solid 2px #e10092;
}

.alert-modal.activate_combo_popup.activate_partner_popup .popupSec {
  width: 640px;
  height: 283px;
}

.alert-modal.reactivation_popup .popupSec {
  width: 640px;
  height: fit-content;
}
.alert-modal.reactivation_popup .popupSec .modal-body {
  padding: 30px 60px;
}
.alert-modal.reactivation_popup .popupSec .modal-body .alert-icon {
  font-size: 0px;
}
.alert-modal.reactivation_popup .popupSec .modal-body .alert-icon img {
  width: 60px;
  margin-bottom: 10px;
}
.alert-modal.reactivation_popup .popupSec .modal-body h1 {
  font-size: 24px;
  margin-bottom: 12px;
}
.alert-modal.reactivation_popup .popupSec .modal-body p.instructions-text {
  font-size: 18px;
  color: #D6C6F4;
}
.alert-modal.reactivation_popup .popupSec .modal-body .btn-group {
  margin-bottom: unset;
  width: 90%;
}
.alert-modal.reactivation_popup .popupSec .modal-body .btn-group .btn {
  margin: 20px auto 0px;
  padding: 11px;
  font-size: 20px;
  border-radius: 4px;
  width: fit-content;
  min-width: 286px;
}
.alert-modal.reactivation_popup .popupSec i.icon-close {
  font-size: 24px;
  right: 10%;
  top: 10%;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .alert-modal .popupSec,
  .fsEdition .popupSec {
    width: 84%;
    height: fit-content;
    overflow-y: auto;
  }
  .alert-modal .popupSec .modal-body .alert-icon .get-icon-success-tick,
  .fsEdition .popupSec .modal-body .alert-icon .get-icon-success-tick {
    padding: 3px 8px;
  }
  .alert-modal .popupSec .modal-body .alert-icon .get-icon-success-tick i:before,
  .fsEdition .popupSec .modal-body .alert-icon .get-icon-success-tick i:before {
    top: 3px;
    font-size: 42px;
  }
  .alert-modal .popupSec .modal-body .btn-group,
  .fsEdition .popupSec .modal-body .btn-group {
    width: 100%;
  }
  .for-web {
    display: none;
  }
  .for-mobile {
    display: block;
  }
  .balance-error .popupSec {
    position: fixed !important;
    top: 50% !important;
  }
  .balance-error .btn-group {
    width: auto !important;
  }
  .balance-error h1 {
    font-size: 35px;
  }
  .downgrade .popupOuter {
    position: fixed;
  }
  .downgrade .popupOuter .popupSec {
    width: 80%;
    height: auto;
    box-shadow: 0 2px 20px 0 rgba(0, 0, 0, 0.5);
    background-color: #33354d;
    border-radius: 4px;
  }
  .downgrade .popupOuter .popupSec .modal-body h1 {
    font-size: 20px;
  }
  .downgrade .popupOuter .popupSec .modal-body .instructions-text {
    color: #cdcfe3;
  }
  .downgrade .popupOuter .popupSec .modal-body .btn-group {
    width: 100%;
  }
  .downgrade .popupOuter .popupSec .modal-body .btn-group .btn {
    padding: 12px;
  }
  .billing-popup .popupSec .modal-body .btn-group,
  .recharge-popup .popupSec .modal-body .btn-group {
    width: auto;
  }
  .billing-popup .popupSec .modal-body .alert-icon i.icon-circle-copy,
  .recharge-popup .popupSec .modal-body .alert-icon i.icon-circle-copy {
    font-size: 48px;
  }
  .billing-popup .popupSec .instructions-text,
  .recharge-popup .popupSec .instructions-text {
    font-size: 16px !important;
  }
  .billing-popup .recharge-distribution li div span,
  .recharge-popup .recharge-distribution li div span {
    font-size: 18px;
  }
  .billing-popup .recharge-distribution li div span:last-child,
  .recharge-popup .recharge-distribution li div span:last-child {
    font-size: 16px;
  }
  .billing-popup .recharge-distribution li:last-child span,
  .recharge-popup .recharge-distribution li:last-child span {
    font-size: 16px;
  }
  .billing-popup .popupSec {
    top: 49% !important;
  }
  .billing-popup .popupSec .modal-body h1 {
    font-size: 20px;
  }
  .billing-popup .popupSec .modal-body .alert-icon {
    margin-bottom: 5px;
  }
  .billing-popup .popupSec .modal-body .icon-info {
    font-size: 49px;
  }
  .billing-popup .popupSec .modal-body .btn-group {
    width: 210px;
  }
  .inactive-alert .popupSec {
    width: 300px;
    height: auto;
    top: 50% !important;
  }
  .inactive-alert .popupSec .modal-body .btn-group {
    width: auto;
  }
  .inactive-alert .popupSec .modal-body .btn-group .primary-btn {
    cursor: pointer;
    width: 209px;
  }
  .inactive-alert .popupSec .modal-body .btn-group .secondary-btn {
    padding: 0;
  }
  .inactive-alert .popupSec .modal-body .instructions-text {
    font-size: 16px;
  }
  .inactive-alert .popupSec h1 {
    font-size: 25px;
  }
  .inactive-alert .icon-alert-upd,
  .inactive-alert .icon-group-24 {
    font-size: 52px;
  }
  .select-pack .popupSec .modal-body ul.pack-cancel-list li {
    padding: 0 12px;
  }
  .select-pack .popupSec .modal-body ul.pack-cancel-list li span {
    font-size: 18px;
  }
  .select-pack .popupSec .modal-body .primary-btn {
    margin: 0 !important;
  }
  .select-pack .popupSec .modal-body .secondary-btn {
    margin-top: 20px !important;
    background: transparent;
    border: none;
    display: inline;
    width: auto !important;
    padding: 0 !important;
    border-radius: inherit;
    border-bottom: 1px solid #5087c7;
  }
  .hotstar .popupSec {
    width: 326px !important;
  }
  .hotstar .modal-body {
    padding: 17px 20px 0 20px !important;
    height: 326px;
  }
  .hotstar .modal-body .btn-group .btn {
    padding: 10px !important;
    font-size: 16px !important;
  }
  .hotstar .modal-body .btn-group .primary-btn {
    margin: 20px 0 10px 0 !important;
  }
  .hotstar .modal-body .btn-group .secondary-btn {
    background: transparent;
    box-shadow: none;
    border: unset;
    margin: 0 !important;
  }
  .hotstar .instructions-text img {
    width: 60px !important;
    height: 60px !important;
  }
  .hotstar .instructions-text .primary-hotstar-text {
    font-size: 22px;
    margin: 10px 12px 10px 0;
  }
  .hotstar .instructions-text .secondary-hotstar-text {
    line-height: 20px;
    font-size: 16px;
  }
  .redirection-popup .popupSec {
    width: 326px !important;
  }
  .redirection-popup .modal-body {
    padding: 17px 20px 0 20px !important;
    max-height: 326px;
  }
  .redirection-popup .modal-body .btn-group .btn {
    padding: 10px !important;
    font-size: 16px !important;
  }
  .redirection-popup .modal-body .btn-group .primary-btn {
    margin: 20px 0 10px 0 !important;
  }
  .redirection-popup .modal-body .btn-group .secondary-btn {
    background: transparent;
    box-shadow: none;
    border: unset;
    margin: 0 !important;
  }
  .redirection-popup .instructions-text img {
    width: 60px !important;
    height: 45.687px !important;
  }
  .redirection-popup .instructions-text .primary-hotstar-text {
    font-size: 22px;
    margin: 10px 12px 10px 0;
  }
  .redirection-popup .instructions-text .secondary-hotstar-text {
    line-height: 20px;
    font-size: 16px;
  }
  .sonyLiv .modal-body {
    padding: 17px 20px 0 20px !important;
    height: 350px;
  }
  .sonyLiv .modal-body p.instructions-text {
    margin-top: 10px !important;
  }
  .sonyLiv .modal-body p.instructions-text img {
    width: 37% !important;
  }
  .sonyLiv .modal-body p.instructions-text .primary-sonyLiv-text {
    font-size: 15px;
    margin: 10px 3px 6px 0px;
  }
  .sonyLiv .modal-body .btn-group .btn {
    padding: 10px !important;
    font-size: 14px !important;
    margin: 3px 0px 10px 0px !important;
  }
  .sonyLiv .modal-body .btn-group .secondary-btn {
    border: none;
    background: none;
  }
  .alert-modal.amazon_popup .popupSec {
    width: 320px;
    height: auto;
  }
  .alert-modal.amazon_popup .popupSec i.icon-close {
    font-size: 20px;
    top: 20px;
    right: 6%;
  }
  .alert-modal.amazon_popup .popupSec i.icon-close::before {
    font-size: 20px;
  }
  .alert-modal.amazon_popup .popupSec .modal-body {
    padding: 20px 20px;
  }
  .alert-modal.amazon_popup .popupSec .modal-body h1 {
    font-size: 22px;
    margin-bottom: 12px;
  }
  .alert-modal.amazon_popup .popupSec .modal-body p.instructions-text {
    font-size: 16px;
  }
  .alert-modal.amazon_popup .popupSec .modal-body .alert-icon img {
    width: 50px;
    height: 50px;
  }
  .alert-modal.amazon_popup .popupSec .modal-body .btn-group .btn {
    margin: 12px auto 0px;
  }
  .alert-modal.amazon_popup .popupSec .modal-body .btn-group .secondary-btn {
    background: none;
    border: none;
    font-size: 16px;
    font-weight: 600;
    font-family: volte_medium !important;
    margin-top: 0px;
  }
  .alert-modal.delete-login .popupSec i.icon-close {
    top: 10%;
    font-size: 16px;
  }
  .alert-modal.delete-login .popupSec .modal-body {
    padding: 8% 12%;
  }
  .alert-modal.delete-login .popupSec .modal-body h1 {
    font-size: 16px;
  }
  .alert-modal.activate_combo_popup .popupSec {
    width: 320px;
    height: 320px;
  }
  .alert-modal.activate_combo_popup .popupSec i.icon-close {
    font-size: 20px;
    top: 20px;
    right: 9%;
  }
  .alert-modal.activate_combo_popup .popupSec i.icon-close::before {
    font-size: 20px;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body {
    padding: 20px 20px;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body h1 {
    font-size: 22px;
    line-height: 26.4px;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body p.instructions-text {
    font-size: 16px;
    line-height: 19.2px;
    color: #D6C6F4;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body .alert-icon img {
    width: 50px;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body .btn-group {
    margin-bottom: 0px;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body .btn-group .btn {
    margin: 12px auto;
    border: solid 1px #e10092;
    padding: 12px;
  }
  .alert-modal.activate_combo_popup .popupSec .modal-body .btn-group .secondary-btn {
    background-color: #e10092;
    color: #ffffff;
    margin: 0;
    border: solid 1px #e10092;
  }
  .alert-modal.activate_combo_popup.activate_partner_popup .popupSec {
    width: 300px;
    height: 281px;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec {
    width: 320px;
    height: fit-content;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body {
    padding: 20px 20px;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body .alert-icon {
    font-size: 0px;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body .alert-icon img {
    width: 50px;
    margin-bottom: 12px;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body h1 {
    font-size: 22px;
    margin-bottom: 12px;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body p.instructions-text {
    font-size: 16px;
    color: #D6C6F4;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body .btn-group {
    margin-bottom: unset;
    width: 100%;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec .modal-body .btn-group .btn {
    margin: 20px auto 0px;
    padding: 14px;
    font-size: 16px;
    border-radius: 4px;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec i.icon-close {
    right: 10%;
    top: 7.7%;
  }
  .alert-modal.reactivation_popup .popupOuter .popupSec i.icon-close::before {
    font-size: 20px;
  }
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
  .popupSec {
    width: 65%;
  }
}
@media only screen and (max-width: 320px) {
  .alert-modal .popupSec .modal-body .btn-group {
    width: 100%;
  }
}
.logout-modal-container .popupSec {
  height: 302px;
  box-sizing: border-box;
  width: 599px;
  text-align: center;
  border-radius: 16px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
}
.logout-modal-container .popupSec .modal-body {
  padding: 35px 45px 30px;
}
.logout-modal-container .popupSec .modal-body h1 {
  font-style: normal;
  font-weight: normal;
  font-family: volte_medium;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  margin: 15px 0px 10px;
}
.logout-modal-container .popupSec .modal-body p {
  width: 515px;
  font-style: normal;
  font-weight: normal;
  font-family: volte_medium;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #a3a6c2;
  padding: 0px 25px;
}
.logout-modal-container .popupSec .modal-body .alert-icon {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 100%;
  height: 30px;
}
.logout-modal-container .popupSec .modal-body .alert-icon img {
  width: 30px;
  height: 100%;
}
.logout-modal-container .popupSec .modal-body .btn-group {
  width: 100%;
  margin: 0px auto;
}
.logout-modal-container .popupSec .modal-body .primary-btn {
  width: 280px;
  height: 44px;
  font-size: 16px;
  font-family: volte_semiBold;
  margin: 20px 0px;
}
.logout-modal-container .popupSec .modal-body .secondary-btn {
  width: 280px;
  color: #f3cbe3;
  font-size: 16px;
  border: none;
  background: none;
  font-family: volte_medium;
  margin: 0px;
  padding: 0px;
}
.logout-modal-container .popupSec .modal-body .btn :hover {
  cursor: pointer;
}
@media (max-width: 768px) {
  .logout-modal-container .popupSec {
    border-radius: 50%;
  }
  .logout-modal-container .popupOuter .popupSec {
    width: 320px;
    height: 292px;
    border-radius: 20px;
  }
  .logout-modal-container .popupOuter .popupSec .modal-body {
    padding: 35px 20px 30px;
  }
  .logout-modal-container .popupOuter .popupSec .modal-body p {
    width: 280px;
    padding: 0px;
  }
  .logout-modal-container .popupOuter .popupSec h1 {
    font-size: 20px;
  }
  .logout-modal-container .popupOuter .popupSec p {
    font-size: 16px;
  }
}

.fire-tv-edition-mode .popupSec {
  width: 421px;
  height: auto;
  border-radius: 26px;
}
.fire-tv-edition-mode .popupSec .modal-body {
  padding: 0px;
}
.fire-tv-edition-mode .popupSec .modal-body .alert-icon {
  margin: 0px;
  width: 421px;
  height: 252px;
  margin-bottom: 26px;
}
.fire-tv-edition-mode .popupSec .modal-body .alert-icon img {
  width: 100%;
  height: 100%;
}

.silent-login-success .popupSec {
  height: 260px;
}
.silent-login-success .popupSec .modal-body {
  padding: 20px 60px;
}
.silent-login-success .popupSec .modal-body h1 {
  margin-bottom: 0;
}
.silent-login-success .popupSec .modal-body .btn-group {
  margin-bottom: 0;
}

.device-limit-popup .popupSec {
  box-sizing: border-box;
  width: 640px;
  text-align: center;
  border-radius: 16px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
}
.device-limit-popup .popupSec .modal-body {
  padding: 30px 62px;
}
.device-limit-popup .popupSec .modal-body h1 {
  font-style: normal;
  font-weight: normal;
  font-family: volte_medium;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  margin: 10px auto;
}
.device-limit-popup .popupSec .modal-body p {
  width: 515px;
  font-style: normal;
  font-weight: normal;
  font-family: volte_medium;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #a3a6c2;
}
.device-limit-popup .popupSec .modal-body .alert-icon {
  display: flex;
  justify-content: center;
  align-content: center;
  width: 100%;
  height: 40px;
}
.device-limit-popup .popupSec .modal-body .alert-icon .icon-mobile-upd::before {
  font-size: 40px;
}
.device-limit-popup .popupSec .modal-body .btn-group {
  width: 100%;
  margin: 0px auto;
}
.device-limit-popup .popupSec .modal-body .primary-btn {
  width: 280px;
  height: 44px;
  font-size: 16px;
  font-family: volte_semiBold;
  margin: 20px 0px;
}
.device-limit-popup .popupSec .modal-body .secondary-btn {
  width: 280px;
  color: #f3cbe3;
  font-size: 16px;
  border: none;
  background: none;
  font-family: volte_medium;
  margin: 0px;
  padding: 0px;
}
.device-limit-popup .popupSec .modal-body .btn :hover {
  cursor: pointer;
}
@media (max-width: 768px) {
  .device-limit-popup .popupSec {
    border-radius: 50%;
  }
  .device-limit-popup .popupOuter .popupSec {
    width: 320px;
    border-radius: 20px;
  }
  .device-limit-popup .popupOuter .popupSec .modal-body {
    padding: 35px 20px 30px;
  }
  .device-limit-popup .popupOuter .popupSec .modal-body p {
    width: 280px;
    padding: 0px;
  }
  .device-limit-popup .popupOuter .popupSec h1 {
    font-size: 20px;
  }
  .device-limit-popup .popupOuter .popupSec p {
    font-size: 16px;
  }
}

.device-listing-popup .popupOuter .popupSec {
  width: 640px;
  height: auto;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 1px solid #564372;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 20px;
  overflow-y: auto;
}
.device-listing-popup .popupOuter .popupSec .modal-body {
  overflow-y: auto;
  height: auto;
  padding: 30px 60px 30px 60px;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container {
  margin-top: 0px;
  width: 100%;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-management-heading h2 {
  display: none;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-management-sub-heading-section .logged-in h2 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-management-sub-heading-section .logged-in p {
  font-style: normal;
  font-weight: 400;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #D6C6F4;
  width: 100%;
  font-family: volte_medium;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-container {
  display: flex;
  gap: 0;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-container .device {
  border: 1px solid #564372;
  box-sizing: border-box;
  border-radius: 10px;
  width: 100%;
  padding: 16px 12px;
  margin: 0px 0px 12px;
  background: #020005;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-container .device .device-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-container .device .last-activity {
  font-size: 14px;
  font-weight: 500;
  line-height: 16.8px;
  color: #8E81A1;
  margin-top: 6px;
  text-align: left;
  font-family: volte_medium;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-container .device .last-activity b {
  font-family: volte_semiBold;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-container .device .device-left .device-name {
  width: auto;
  margin-left: 12px;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-count {
  display: flex;
  justify-content: end;
  width: 100% !important;
  margin-top: 0px;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .device-section .device-count .float-right {
  width: 100%;
  text-align: end;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .button-container {
  margin-top: 20px;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .button-container .btn {
  padding: 11px 0px;
  width: 280px;
}
.device-listing-popup .popupOuter .popupSec .modal-body .device-management-container .not-now {
  cursor: pointer;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  color: #f3cbe3;
  margin-top: 10px;
}

.alert-modal.apple-modal .popupSec {
  width: 640px;
  height: 376px;
}
.alert-modal.apple-modal .popupSec .icon-close {
  font-size: 23px;
  position: absolute;
  right: 58px;
  top: 30px;
}
@media only screen and (max-width: 480px) {
  .alert-modal.apple-modal .popupSec .icon-close {
    top: 15px;
    right: 20px;
  }
}
.alert-modal.apple-modal .popupSec .modal-body {
  padding: 30px 60px;
}
.alert-modal.apple-modal .popupSec .modal-body .btn-group {
  margin-bottom: 0;
}
.alert-modal.apple-modal .popupSec .modal-body .btn-group .secondary-btn {
  background: none;
  margin: 0;
  border: 2px solid #f3cbe3;
  padding: 13px;
}
.alert-modal.apple-modal .popupSec .modal-body .btn-group .primary-btn {
  margin: 20px auto 20px;
  padding: 13px;
  height: 46px;
  width: 280px;
  font-family: volte_medium !important;
}
.alert-modal.apple-modal .popupSec .modal-body .btn-group .sec-btn-link {
  margin-top: 0px;
  font-size: 16px;
  font-family: volte_medium;
}
.alert-modal.apple-modal .popupSec .modal-body h1 {
  margin-top: 5px;
  margin-bottom: 20px;
  font-family: volte_reg;
}
.alert-modal.apple-modal .popupSec .modal-body .extra-instructions-text,
.alert-modal.apple-modal .popupSec .modal-body .instructions-text {
  font-family: volte_reg !important;
  color: #D6C6F4;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  /* 24px */
  margin-bottom: 30px;
}
.alert-modal.apple-modal .popupSec .modal-body .instructions-text {
  font-size: 16px;
  margin-bottom: 0px;
}
.alert-modal.apple-modal .popupSec .alert-icon {
  font-size: unset;
}
.alert-modal.apple-modal .popupSec .alert-icon img {
  width: 60px;
  height: 60px;
}

.alert-modal.upgrade-modal.apple-modal .popupSec {
  height: 266px;
}
.alert-modal.upgrade-modal.apple-modal .popupSec > div {
  height: 100%;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .icon-close {
  font-size: 23px;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body {
  padding: 30px;
  height: 100%;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .btn-group .secondary-btn {
  border: none;
  padding: 0;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .alert-icon {
  margin-bottom: 10px;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .alert-icon img {
  width: 50px;
  height: 50px;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body h1 {
  font-size: 22px;
  margin-bottom: 10px;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .instructions-text {
  font-size: 18px;
}
.alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .btn-group .primary-btn {
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 100%;
  font-family: volte_medium !important;
}

.fibre-restrict-popup .popupSec .modal-body .alert-icon i.icon-alert-upd::before {
  color: #e56c6c;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .alert-modal.apple-modal .popupSec {
    width: 320px;
    height: 322px;
  }
  .alert-modal.apple-modal .popupSec .icon-close::before {
    font-size: 20px;
  }
  .alert-modal.apple-modal .popupSec .modal-body {
    padding: 20px;
  }
  .alert-modal.apple-modal .popupSec .modal-body h1 {
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 10px;
  }
  .alert-modal.apple-modal .popupSec .modal-body .extra-instructions-text {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .alert-modal.apple-modal .popupSec .modal-body .instructions-text {
    font-size: 12px;
  }
  .alert-modal.apple-modal .popupSec .modal-body .alert-icon {
    margin-bottom: 0;
    height: 43px;
  }
  .alert-modal.apple-modal .popupSec .modal-body .alert-icon img {
    width: 50px;
    height: 50px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec {
    height: 285px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec .icon-close::before {
    font-size: 19px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec .modal-body {
    padding: 20px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .alert-icon {
    margin-bottom: 20px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .alert-icon img {
    width: 40px;
    height: 40px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .instructions-text {
    font-size: 16px;
  }
  .alert-modal.upgrade-modal.apple-modal .popupSec .modal-body .btn-group .primary-btn {
    width: 280px;
  }
  .apple-activate-popup .popupSec {
    width: 320px !important;
    min-height: 456px;
  }
  .apple-activate-popup .popupSec .icon-close::before {
    font-size: 20px !important;
  }
  .apple-activate-popup .popupSec .modal-body {
    padding: 20px;
  }
  .apple-activate-popup .popupSec .modal-body .alert-icon {
    margin-bottom: 15.26px;
  }
  .apple-activate-popup .popupSec .modal-body .alert-icon img {
    width: 50px;
    height: 50px;
  }
  .apple-activate-popup .popupSec .modal-body h1 {
    font-size: 22px;
    margin-bottom: 12px;
  }
  .apple-activate-popup .popupSec .modal-body .video-thumbnail {
    width: 278px;
    margin: 10px 0 10px 0;
    height: 190px;
  }
  .apple-activate-popup .popupSec .modal-body .video-thumbnail img {
    width: 100%;
    height: 100%;
  }
  .apple-activate-popup .popupSec .modal-body img.apple_play_image {
    width: 40px;
    height: 40px;
    top: 75px;
    left: 114px;
  }
  .apple-activate-popup .popupSec .modal-body .steps-list .steps {
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 90%;
  }
  .apple-activate-popup .popupSec .modal-body .steps-list .steps > div {
    width: 15%;
    font-weight: 600;
    line-height: 110%;
  }
  .apple-activate-popup .popupSec .modal-body .steps-list .steps .step-info {
    width: 75%;
  }
  .apple-activate-popup .popupSec .modal-body .instructions {
    font-size: 12px;
    margin: 12px 0 12px 0;
  }
  .apple-activate-popup .popupSec .modal-body .apple-know-more-block .text-block {
    padding: 6px 10px;
  }
  .apple-activate-popup .popupSec .modal-body .apple-know-more-block .text-block div:first-child {
    font-family: volte_medium;
  }
  .apple-activate-popup .popupSec .modal-body .btn-group .btn {
    padding: 13px 0 15px 0;
    height: 46px;
  }
  .alert-modal.amazon-try-again-popup .popupSec {
    width: 320px;
  }
  .alert-modal.amazon-try-again-popup .popupSec .modal-body {
    padding: 30px 20px;
  }
  .alert-modal.amazon-try-again-popup .popupSec .alert-icon img {
    width: 40px;
    height: 40px;
  }
  .alert-modal.amazon-try-again-popup .popupSec h1 {
    font-size: 22px;
    margin-bottom: 10px;
  }
  .alert-modal.amazon-try-again-popup .popupSec p.instructions-text {
    color: #D6C6F4;
    font-size: 16px;
  }
  .alert-modal.amazon-try-again-popup .popupSec .btn-group {
    margin-bottom: 0;
  }
  .alert-modal.amazon-try-again-popup .popupSec .btn-group .btn {
    margin-top: 20px;
    margin-bottom: 0;
    border-radius: 4px;
    padding: 13.5px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.fiber.alert-modal .popupSec {
  position: absolute;
  width: 640px;
  border: 2px solid #564372;
  height: 611px;
  background: linear-gradient(294.65deg, #020005 0.69%, #220046 100%) !important;
  box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.5);
  padding: 30px 35px;
}
.fiber.alert-modal .modal-body {
  text-align: center;
  padding: 0px;
}

.congratulation-msg-wrapper {
  display: flex;
  align-items: center;
  flex-direction: column;
}
.congratulation-msg-wrapper .logo img {
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3.2px;
}
.congratulation-msg-wrapper .heading {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  margin-top: 12px;
  color: #ffffff;
}
.congratulation-msg-wrapper .text {
  margin-top: 10px;
}
.congratulation-msg-wrapper .text span {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #c7c0cf;
}
.congratulation-msg-wrapper .text .second-text {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #c7c0cf;
  margin-top: 18px;
}
.congratulation-msg-wrapper .img-partner {
  width: 450px;
  border-radius: 10px;
  display: unset;
  margin-top: 20px;
}
.congratulation-msg-wrapper .img-partner ul {
  display: flex;
  align-items: center;
  justify-content: center;
}
.congratulation-msg-wrapper .img-partner ul li {
  width: 80px;
  height: 80px;
  margin-right: 6px;
  margin: 0px 10px 6px 0px;
}
.congratulation-msg-wrapper .img-partner ul li:last-child {
  margin-right: 0;
}
.congratulation-msg-wrapper .img-partner ul li img {
  width: 100%;
  width: 80px;
  height: 80px;
  border-radius: 42px;
}
.congratulation-msg-wrapper .img-partner p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #c7c0cf;
}
.congratulation-msg-wrapper .do-later {
  margin-top: 20px;
  border-radius: 100px;
  box-sizing: border-box;
}
.congratulation-msg-wrapper .do-later .btn {
  margin-right: 0px;
  margin-bottom: 0px;
  width: 280px;
  height: 44px;
}
.congratulation-msg-wrapper .do-later .btn .button-text {
  font-weight: 600;
  font-size: 16px;
  line-height: 16px;
  text-align: center;
  color: #ffffff;
}
.congratulation-msg-wrapper .expiry {
  margin-top: 20px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 110%;
  display: flex;
  align-items: center;
  text-align: center;
  color: #ffffff;
}

@media only screen and (max-width: 480px) {
  .fiber.alert-modal .popupSec {
    position: absolute;
    width: 320px;
    height: 525px;
    padding: 30px 15px;
  }
  .fiber.alert-modal .modal-body {
    text-align: center;
    padding: 0px;
  }
  .congratulation-msg-wrapper .logo img {
    width: 50px;
    height: 50px;
  }
  .congratulation-msg-wrapper .heading {
    font-size: 22px;
    margin-top: 12px;
  }
  .congratulation-msg-wrapper .text span:nth-child(1) {
    font-size: 16px;
  }
  .congratulation-msg-wrapper .text .second-text {
    font-size: 16px;
    margin-top: 15px;
    padding: 0 30px;
  }
  .congratulation-msg-wrapper .img-partner {
    width: 300px;
  }
  .congratulation-msg-wrapper .img-partner ul li {
    width: 50px;
    height: 50px;
  }
  .congratulation-msg-wrapper .img-partner ul li img {
    width: 50px;
    height: 50px;
  }
  .congratulation-msg-wrapper .img-partner p {
    font-size: 16px;
  }
  .congratulation-msg-wrapper .expiry {
    font-size: 16px;
  }
  .congratulation-msg-wrapper .do-later .btn {
    width: 280px;
    height: 45px;
  }
  .congratulation-msg-wrapper .do-later .btn .button-text {
    font-weight: 100;
    font-family: volte_medium;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.popupOuter {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  height: 100%;
  z-index: 9999;
  overflow: hidden;
}
.popupOuter .tick-tick-background-img {
  position: absolute;
  width: 100%;
  height: auto;
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%);
  opacity: 0.55;
  overflow-y: hidden;
}
.popupOuter .tick-tick-background-img img {
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100%;
  object-fit: cover;
  object-position: 0%;
}

.modal-lg .popupSec {
  width: 80%;
}

.modal-md .popupSec {
  width: 60%;
}

.modal-sm .popupSec {
  width: 40%;
}

.modal-xsm .popupSec {
  width: 35%;
}

.modal-xs .popupSec {
  /* width: 30%;*/
  width: 410px;
}

.popup_overlay {
  background-size: cover;
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  opacity: 0.94;
  overflow: hidden;
  transition: opacity 500ms;
  z-index: 9997;
}

.popup_overlay.black_overlay {
  background: rgba(2, 0, 5, 0.75);
}

.popupSec {
  /* FTV Card */
  background: #33354d;
  /* FTV CTA */
  border: 1px solid #564372;
  box-sizing: border-box;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5);
  border-radius: 16px;
  position: relative;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: #ffffff;
  max-height: 90%;
  overflow: hidden;
  z-index: 2;
  -webkit-overflow-scrolling: touch;
  pointer-events: all;
}
.popupSec .error-style {
  color: #e56c6c;
  margin: 10px 0;
  font-weight: 600;
}
.popupSec .cross {
  position: absolute;
  right: 30px;
  top: 30px;
  cursor: pointer;
  width: 26px;
  height: 26px;
  z-index: 1;
  font-size: 1.143rem;
  font-weight: bold;
}
.popupSec h3 {
  color: #737373;
  font: 35px/45px;
  padding-bottom: 15px;
  background-size: 556px 2px;
  margin-bottom: 30px;
}

.modal-header {
  padding: 15px 25px;
  border-radius: 5px;
  position: relative;
}
.modal-header h3 {
  font-family: volte_medium;
  font-size: 1.714em;
  font-weight: 400;
  margin-bottom: 0px;
  padding-bottom: 0px;
}
.modal-header p {
  font-weight: 600;
  color: #999999;
}

.icon-close {
  top: 15px;
  right: 20px;
  margin: auto;
  cursor: pointer;
  position: absolute;
  font-size: 15px;
  z-index: 2;
}

.modal-body {
  padding: 40px 30px;
  text-align: center;
}

.popover .icon-close {
  top: 21px;
  position: absolute;
}
.popover .popupSec {
  max-width: 725px;
  padding: 40px 30px;
}

@media only screen and (min-width: 768px) and (max-width: 1170px) {
  .media-modal .popupSec .cross {
    top: 3px;
    font-size: 0.8em;
  }
  .modal-xsm .popupSec {
    width: 73%;
  }
}
.modal-xsm .popupSec .card-image > img {
  width: 100%;
}

.verify-otp-modal {
  text-align: center;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .modal-lg .popupSec,
  .modal-md .popupSec,
  .modal-sm .popupSec,
  .modal-xs .popupSec {
    width: 85%;
  }
  .modal-xsm .popupSec {
    width: 73%;
  }
}
@media only screen and (min-width: 320px) and (max-width: 812px) and (orientation: landscape), (max-device-width: 892px) and (orientation: landscape) {
  .modal-xs .popupSec {
    width: 50%;
  }
  .modal-xsm .popupSec {
    width: 45%;
  }
}
.for-web {
  display: block;
}

.for-mobile {
  display: none;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .for-web {
    display: none;
  }
  .for-mobile {
    display: block;
  }
  .popupOuter {
    position: fixed;
  }
  .popupOuter .popupSec {
    width: 300px;
    height: fit-content;
    /* top: 36%;*/
    /*  width: 80%;*/
    background-color: #33354d;
    border: 1px solid #564372;
    box-sizing: border-box;
    box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.5);
    border-radius: 20px;
  }
  .popupOuter .popupSec .icon-close:before {
    font-size: 12px;
  }
  .popup_overlay.black_overlay {
    opacity: 0.9;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.comment-modal-popup .popupOuter .popupSec {
  transform: none;
  border: none;
  background: none;
}
.comment-modal-popup .modal-body-container {
  width: 100%;
  position: fixed;
  bottom: 0;
  height: 100vh;
  display: flex;
  justify-content: center;
  overflow: hidden;
  z-index: 10001;
  text-align: center;
  left: 0;
  animation: fadeInDown 0.8s;
  background: none;
}
.comment-modal-popup .popup-body {
  position: fixed;
  border-radius: 5px;
  width: 498px;
  line-height: 1.4;
  background: #fff;
  border-radius: 0.3rem;
  overflow: hidden;
  animation: fadeInDown 1s;
  margin: 15px;
  padding-bottom: 20px;
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
.comment-modal-popup .popup-fullbody {
  padding: 0 15px 0 20px;
}
.comment-modal-popup .modal-header.ticketinfo {
  height: 38px;
  width: 230px;
  border-radius: 0 0 70px 0;
  background: rgb(19, 0, 40);
  background: linear-gradient(90deg, rgb(19, 0, 40) 0%, rgb(34, 0, 70) 100%);
  color: #fff;
  display: flex;
  align-items: center;
  padding: 12px 22px 12px 20px;
}
.comment-modal-popup .hovering {
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  width: 171px;
  height: 22px;
}
.comment-modal-popup .requestId {
  white-space: nowrap;
  display: inline-block;
  width: 171px;
}
.comment-modal-popup .requestId:not(:hover) {
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 3px;
}
.comment-modal-popup .requestId:hover {
  overflow: initial;
  animation-name: marqee;
  animation-duration: 4s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  margin-top: 3px;
}
.comment-modal-popup .ticketpara {
  line-height: 60px;
  font-size: 17px;
  display: flex;
}
.comment-modal-popup .comment {
  display: flex;
  color: #1d1e30;
  font-weight: 1000;
}
.comment-modal-popup .form-control {
  width: 100%;
  height: 20px;
  padding: 5px 5px 5px 12px;
  line-height: 18px;
  background-color: transparent;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  box-sizing: border-box;
  height: auto;
  font-size: 16px;
}
.comment-modal-popup textarea {
  height: 100px !important;
}
.comment-modal-popup textarea:focus {
  outline: none !important;
  border: 1px solid #80bdff;
  box-shadow: 0 0 10px #80bdff;
}
.comment-modal-popup .error {
  display: flex;
  font-size: 12px;
  color: #e56c6c;
}
.comment-modal-popup .suggestion {
  display: flex;
  font-size: 12px;
}
.comment-modal-popup .btns {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
}
.comment-modal-popup .btn-contr {
  min-width: calc(40% - 14px);
  height: 44px;
  line-height: 37px;
  margin: 6px;
  cursor: pointer;
  border-radius: 20px;
  border: 1px solid #e10092;
  font-size: 19px;
  font-family: volte_reg;
}
.comment-modal-popup .btn-contr.reopen {
  background: #e10092 !important;
  color: #fff;
}
.comment-modal-popup .btn-contr.close {
  color: #e10092;
  background-color: #fff;
}
.comment-modal-popup .btn-contr.close:hover {
  background: #e10092 !important;
  color: #fff;
}
@media screen and (max-width: 530px) {
  .comment-modal-popup .popup-body {
    border-radius: 5px;
    width: 100%;
    margin: 0 auto;
    animation: animatebottom 1s;
    bottom: 0;
  }
  @keyframes animatebottom {
    from {
      bottom: -300px;
      opacity: 0;
    }
    to {
      bottom: 0;
      opacity: 1;
    }
  }
  .comment-modal-popup .btn-contr {
    width: calc(100% - 24px);
  }
  .comment-modal-popup p {
    line-height: 18px;
  }
  .comment-modal-popup .ticketpara {
    line-height: 18px;
    margin: 10px 0 10px 0px;
  }
  .comment-modal-popup .form-control {
    font-size: 14px;
  }
  .comment-modal-popup .btns {
    display: block;
  }
  .comment-modal-popup .modal-header.ticketinfo {
    padding: 15px 0 10px 22px;
  }
  .comment-modal-popup .error {
    display: flex;
  }
}
@media screen and (max-width: 365px) {
  .comment-modal-popup .ticketpara {
    line-height: 18px;
    font-size: 13px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.watchlist-container.form-container {
  padding: 0;
  margin: 0 auto;
}
.watchlist-container .grid-view .listing-block {
  display: inline-flex;
  position: relative;
  padding: 0px !important;
}
.watchlist-container .empty-heading {
  padding: 35px 12.9% 0 2.8%;
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  /* or 31px */
  /* White */
  color: #ffffff;
}
.watchlist-container .empty-watchlist {
  text-align: center;
  padding-top: 46px;
}
.watchlist-container .empty-watchlist .bottom-margin {
  margin-bottom: 374px;
}
.watchlist-container .empty-watchlist .icon-watchlist {
  width: 32px;
  height: 29.18px;
}
.watchlist-container .empty-watchlist .icon-watchlist img {
  width: 100%;
}
.watchlist-container .empty-watchlist .discover-button {
  width: 367.03px;
  height: 57.68px;
  margin-bottom: 30px;
  margin-top: 61.5px;
  border: none;
  outline: none;
  background: #e10092;
  border-radius: 50px;
  cursor: pointer;
}
.watchlist-container .empty-watchlist .discover-button .button-text {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: normal;
  font-size: 20.973px;
  line-height: 24px;
  text-align: center;
  color: #ffffff;
}
.watchlist-container .empty-watchlist h1 {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 26px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
  margin: 7px 0 10px 0;
}
.watchlist-container .empty-watchlist p {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #8e81a1;
}
.watchlist-container .watchlist-heading {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.watchlist-container .watchlist-heading .left-heading {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 26px;
  line-height: 120%;
  color: #ffffff;
}
.watchlist-container .watchlist-heading .right-heading {
  display: flex;
}
.watchlist-container .watchlist-heading .right-heading p {
  color: #f3cbe3;
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
  cursor: pointer;
}
.watchlist-container .watchlist-heading .right-heading p span {
  font-size: 20px;
  color: #f3cbe3;
  padding-left: 3px;
}
.watchlist-container .watchlist-heading .right-heading p:not(:last-child) {
  margin-right: 57px;
}
.watchlist-container .watchlist-heading .right-heading .right-inner-text {
  padding-right: 6px;
}
.watchlist-container .watchlist-content {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  top: 7px;
  padding: 18px 2.8% 77px 2.8%;
}
.watchlist-container .watchlist-content h3 {
  color: #ffffff;
  font-size: 45px;
  width: 100%;
}
.watchlist-container .watchlist-content .watchlist {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  top: 24px;
  width: 100%;
  padding: 0px;
}
.watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv {
  width: 100%;
}
.watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 20px;
  width: 100%;
}
.watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  display: block;
}
.watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}
.watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover {
  width: 110%;
}
.watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover {
  width: 100%;
  margin-left: 11.2px;
}
.watchlist-container .watchlist-content .watchlist li img {
  width: 100%;
  height: 100%;
}
.watchlist-container .watchlist-content .watchlist li img.broken-image {
  height: auto;
}
.watchlist-container .watchlist-content .watchlist li img.crown-image {
  width: 24px;
  height: 24px;
}
.watchlist-container .watchlist-content .watchlist.listing-landscape li {
  width: 310px;
  height: 208px;
  margin-right: 20px;
}
.watchlist-container .watchlist-content .watchlist.listing-landscape li .episode-free {
  border-radius: 0px 0px 6px 0px;
  padding: 6px;
  width: auto;
  right: 0px;
  bottom: 0px;
  font-size: 12px;
}
.watchlist-container .watchlist-content .watchlist.listing-landscape .select-content {
  position: absolute !important;
  right: 45px;
  top: 9px;
  left: auto !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 11px;
  background: #8E81A1;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}
.watchlist-container .watchlist-content .watchlist.listing-landscape .tick {
  background-color: #e10092;
  border-radius: 55px !important;
  border: 1px solid #e10092;
  padding: 1px;
}
.watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape li, .watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape.card-image, .watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape.place-holder-image {
  height: 100%;
  padding-bottom: 54.6%;
}
.watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape li .card-image,
.watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape li .place-holder-image, .watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape.card-image .card-image,
.watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape.card-image .place-holder-image, .watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape.place-holder-image .card-image,
.watchlist-container .watchlist-content .watchlist.listing-landscape.listing-landscape.place-holder-image .place-holder-image {
  width: 100%;
  height: 100%;
  display: inline-block;
  transform: translateZ(0);
}
.watchlist-container .watchlist-content .watchlist.listing-portrait li {
  width: 167px;
  height: 306px;
  margin-right: 20px;
}

.toast-wrapperr {
  display: flex;
  align-items: center;
}
.toast-wrapperr img {
  width: 40px;
  height: 40px;
}
.toast-wrapperr p {
  padding-left: 30px;
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  font-size: 20px;
  line-height: 120%;
}

.Toastify__toast-container {
  width: 640px;
  height: 66px;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  border: 2px solid #5F4372;
  box-sizing: border-box;
  border-radius: 6px;
  font-family: volte_medium !important;
}

.Toastify__toast-container--bottom-center {
  bottom: 32% !important;
  border: none;
  font-family: volte_medium !important;
}

.Toastify__close-button {
  opacity: 1;
  width: 35px;
  height: 26px;
  padding-top: 1.8%;
  font-family: volte_medium !important;
}

.Toastify__close-button > svg {
  height: 30px;
  width: 22px;
}

.set-watchlist-hover {
  margin-top: -1px !important;
  width: 321px !important;
}
.set-watchlist-hover .image-top img {
  height: 173px !important;
}

@media only screen and (max-width: 480px) {
  .watchlist-container .empty-watchlist {
    text-align: center;
    padding-top: 65px;
    padding-bottom: 347px;
  }
  .watchlist-container .empty-watchlist h1 {
    font-size: 22px;
  }
  .watchlist-container .empty-watchlist p {
    font-size: 16px;
    padding: 0 20px;
  }
  .watchlist-container .empty-watchlist .discover-button {
    width: 320px;
    height: 44px;
    margin-top: 20px;
  }
  .watchlist-container .empty-watchlist .discover-button .button-text {
    font-size: 16px;
  }
  .watchlist-container .empty-heading {
    padding: 0 12.9% 0 2.8%;
    font-size: 22px;
  }
  .watchlist-container .watchlist-content {
    padding: 0% 0 0 5%;
  }
  .watchlist-container .watchlist-content .watchlist {
    top: 27px;
  }
  .watchlist-container .watchlist-content .watchlist-heading .left-heading {
    font-size: 22px;
  }
  .watchlist-container .watchlist-content .watchlist-heading .right-heading {
    display: flex;
  }
  .watchlist-container .watchlist-content .watchlist-heading .right-heading .right-inner-text {
    padding-right: 0;
  }
  .watchlist-container .watchlist-content .watchlist-heading .right-heading .remove-button {
    padding-right: 0;
  }
  .watchlist-container .watchlist-content .watchlist-heading .right-heading p {
    color: #f3cbe3;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 120%;
    cursor: pointer;
  }
  .watchlist-container .watchlist-content .watchlist-heading .right-heading p span {
    font-size: 16px;
    color: #f3cbe3;
    padding-left: 3px;
  }
  .watchlist-container .watchlist-content .watchlist-heading .right-heading p:not(:last-child) {
    margin-right: 16px;
  }
  .watchlist-container .watchlist-content .watchlist.listing-landscape li {
    width: 47%;
    height: 112px;
    margin-right: 12px;
    margin-bottom: 0px;
  }
  .watchlist-container .watchlist-content .watchlist.listing-landscape li .select-content {
    position: absolute;
    right: 35px;
    top: 8px;
    width: 18px;
    height: 18px;
    border-radius: 11px;
    background: #444764;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .watchlist-container .watchlist-content .watchlist.listing-landscape li .tick {
    width: 15px;
    height: 15px;
    background-color: #e10092;
    border-radius: 55px !important;
    border: 1px solid #e10092;
    padding: 1px;
  }
  .watchlist-container .watchlist-content .watchlist.listing-landscape li .active {
    background: #e10092;
    height: 18px !important;
    width: 18px !important;
    padding-left: 2px !important;
  }
  .Toastify__toast-container {
    width: 340px;
    height: 48px;
  }
  .Toastify__toast-container--bottom-center {
    bottom: 15% !important;
  }
  .toast-wrapperr {
    display: flex;
    align-items: center;
  }
  .toast-wrapperr img {
    width: 24px;
    height: 24px;
  }
  .toast-wrapperr p {
    padding-left: 15px;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 120%;
  }
  .Toastify__close-button {
    opacity: 1;
    padding-top: 0.8%;
  }
  .Toastify__toast {
    width: 87%;
    margin: 10px auto;
  }
  .bottom-margin {
    margin-bottom: 50px;
  }
}
@media only screen and (max-device-width: 320px) {
  .watchlist-container .watchlist-content {
    padding: 11.5% 0 0 5%;
  }
  .watchlist-container .watchlist-content .watchlist.listing-landscape li {
    width: 140px;
    height: 112px;
  }
  .watchlist-container .watchlist-content .watchlist-heading {
    padding: 1px 5% 0 0;
  }
  .watchlist-container .empty-watchlist .discover-button {
    width: 285px;
    height: 42px;
  }
  .watchlist-container .empty-watchlist .discover-button .button-text {
    font-size: 16px;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1920px) {
  .watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media only screen and (min-width: 941px) and (max-width: 1170px) {
  .watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 940px) {
  .watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
  .watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .watchlist-container .watchlist-content {
    padding: 0% 2.8%;
  }
  .watchlist-container .watchlist-content .watchlist .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.listing-item {
  height: 100px;
  display: inline-block;
  cursor: pointer;
  position: relative;
  border-radius: 2px;
  overflow: hidden;
}
.listing-item .broken-image {
  display: none;
}
.listing-item.seasons-list .know-more-tip {
  padding-bottom: 10px;
}
.listing-item img {
  width: 100%;
  height: 100%;
  position: absolute;
}
.listing-item img.crown-image {
  margin: 8px !important;
  height: 24px;
  top: 0%;
  left: 0%;
  width: 24px;
}
.listing-item img.crown-image.mg-right {
  top: 4px;
  left: 50px;
  margin: 0 !important;
}
.listing-item .img-overlay {
  position: absolute;
  z-index: 1;
}
.listing-item .icon-play-icon {
  position: absolute;
  left: 38%;
  top: 31px;
  z-index: 99;
}
.listing-item .icon-play-icon .path1:before {
  font-size: 58px;
}
.listing-item .icon-play-icon .path2:before {
  font-size: 58px;
}
.listing-item .continue-watching-range {
  position: absolute;
  height: 3px;
  width: 100%;
  z-index: 1;
}
.listing-item .continue-watching-range .range-background {
  position: absolute;
  top: -2px;
  height: 3px;
  margin-left: 0;
  background-color: #e5007d;
}
.listing-item .sports-rail-item .gradient-overlay {
  display: none;
  position: absolute;
  height: 34px;
  width: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  border-radius: 6px 6px 0px 0px;
}
.listing-item .sports-rail-item .sports-duration-detail {
  font-family: volte_reg;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 15px;
  color: #ffffff;
  position: relative;
  margin: 0 0 0 8px;
}
.listing-item .sports-rail-item .sport-rail-detail {
  display: flex;
  position: absolute;
  bottom: 0;
  align-items: end;
  padding: 8px 6px;
  width: 100%;
  height: 59px;
  justify-content: space-between;
}
.listing-item .sports-rail-item .sport-rail-detail .play {
  width: 10%;
  position: relative;
  bottom: 0;
}
.listing-item .sports-rail-item .sport-rail-detail .play-video-icon {
  width: 20px;
  height: 20px;
}
.listing-item .sports-rail-item .sport-rail-detail .three-dots {
  width: 5%;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}
.listing-item .sports-rail-item .sport-rail-detail .three-dots-icon {
  width: 3px;
  height: 13px;
}
.listing-item .sports-rail-item .sport-rail-detail .sports-video-title {
  width: 90%;
  margin-left: 4px;
  color: #ffffff;
  font-family: volte_medium;
  font-size: 12px;
  letter-spacing: 1px;
  z-index: 1;
  line-height: normal;
  font-style: normal;
  font-weight: 400;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  bottom: 0 !important;
  margin-top: 1.7px;
}
.listing-item .sports-rail-item .sport-rail-detail:before {
  content: "";
  z-index: 0;
  position: absolute;
  min-height: 24px;
  left: 0px;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: inline-block;
  border-radius: 0px 0px 6px 6px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0.26%, rgba(0, 0, 0, 0.74) 49.26%, #000000 100.26%);
}
.listing-item .sports-rail-item .sport-rail-detail.title-banner-gradient:before {
  display: none;
}
.listing-item .sports-rail-item .bottom-desc-padding {
  padding: 7px 5px;
  bottom: 31px;
}
.listing-item .item-detail {
  position: absolute;
  bottom: 2px;
  left: 0;
  width: 100%;
  padding: 4px 0;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.listing-item .item-detail span {
  white-space: nowrap;
  text-overflow: ellipsis;
  font-size: 18px;
  font-family: volte_medium;
  display: block;
}
.listing-item .item-detail img.crown-image {
  width: 24px;
  height: 24px;
}
.listing-item .card-provider-logo {
  position: absolute;
  right: 0%;
  top: 0%;
  width: 28px;
  height: 28px;
  margin: 8px;
  border-radius: 2px;
}
.listing-item .card-provider-logo img {
  height: 100% !important;
  width: 100% !important;
  border-radius: 2px !important;
}

.listing-item div span img {
  width: 36px;
  height: 20px;
  margin: inherit;
  position: relative;
}

.listing-portrait img {
  width: 200px;
  height: 266px;
  position: absolute;
  border-radius: 6px !important;
}
.listing-portrait .listing-item .tvod-item {
  height: 76px !important;
}
.listing-portrait p {
  padding: 7px 3px 13px 12px !important;
  height: 63px;
}
.listing-portrait p span {
  padding-left: 0 !important;
}

.listing-top_portrait .listing-item {
  cursor: unset;
}
.listing-top_portrait p {
  padding: 7px 3px 13px 12px !important;
  height: 63px;
}
.listing-top_portrait p span {
  padding-left: 0 !important;
}

.listing-landscape img {
  width: 100%;
  height: 171px;
  position: absolute;
  border-radius: 8px;
}
.listing-landscape .listing-square .card-image {
  height: 156px;
  width: 156px;
  border-radius: 12px !important;
}
.listing-landscape .listing-square .crown-image {
  width: 24px;
  height: 24px;
}
.listing-landscape .listing-square .game-detail {
  bottom: 2px;
}
.listing-landscape .listing-square .games-favorite {
  width: 30px;
  height: 30px;
  right: 5px;
  bottom: 48px;
}
.listing-landscape .listing-mid-banner-games img {
  width: 420px;
  height: 173px;
}
.listing-landscape .listing-mid-banner-games .game-detail {
  display: none;
}
.listing-landscape .listing-mid-banner-games .games-favorite {
  display: none;
}
.listing-landscape .game-detail {
  position: absolute;
  bottom: -3px;
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  line-height: 19.8px;
  font-family: volte_reg;
  width: 156px;
}
.listing-landscape .game-detail .game-detail-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.listing-landscape .game-detail .play-count {
  font-weight: 500;
  font-size: 12px;
  line-height: 15px;
  color: #8e81a1;
}
.listing-landscape .browse-by-genre-listing img {
  height: 90px;
}
.listing-landscape .browse-by-lang-listing .language-rail-item {
  height: 96px;
  width: 96px;
  border-radius: 65px;
  border: 2px solid #564372;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  background: linear-gradient(339.81deg, #220046 59.34%, #E10092 134.97%);
}
.listing-landscape .browse-by-lang-listing .language-rail-item img {
  height: 28px;
  width: 28px;
}
.listing-landscape .browse-by-lang-listing .language-rail-item:hover {
  border: 2px solid #ffffff;
}
.listing-landscape .listing-item .tvod-item {
  height: 75px !important;
}

.listing-live-rail li img {
  height: 90px;
}

.listing-vertical .listing-circular li p {
  bottom: 0;
}
.listing-vertical .listing-circular li p span {
  text-align: center;
  padding: 0;
  line-height: 1.2;
  color: #a3a6c2;
}

.listing-vertical .listing-top-ten-games li .game-detail {
  position: absolute;
  bottom: 15px;
  color: #ffffff;
  font-size: 20.89px;
  font-weight: 500;
  line-height: 21px;
  font-family: volte_reg;
  width: 156px;
  right: 0;
}
.listing-vertical .listing-top-ten-games li .game-detail .game-detail-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.expires {
  font-weight: 400;
  font-size: 10px !important;
  line-height: 120%;
  margin-top: 4px;
  color: #E56C6C;
  font-family: volte_medium;
}

.gradient_overlay_bottom {
  position: absolute;
  bottom: 0%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 50%, #000000 100%);
  width: 100%;
  height: 28px;
  border-radius: 0px 0px 6px 6px;
}

.gradient_overlay_top {
  position: absolute;
  top: -1%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  width: 100%;
  height: 34px;
  border-radius: 6px 6px 0px 0px;
}

.overBottomContent {
  display: flex;
  justify-content: space-between;
  position: absolute;
  bottom: 28%;
  align-items: center;
  left: 5px;
  right: 0;
}
.overBottomContent .three-dots {
  display: inline-block;
  width: 30px;
  height: 19px;
  object-fit: contain;
  position: relative;
  right: 0px;
  padding-bottom: 3px;
}
.overBottomContent .overBottomContentLeft {
  display: flex;
  align-items: center;
  width: calc(100% - 22px);
}
.overBottomContent .overBottomContentLeft p {
  font-size: 12px;
  color: #fff;
  margin-left: 5px;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-family: volte_reg;
  line-height: 14.4px;
  letter-spacing: 1px;
  overflow: hidden;
  min-width: 84%;
  font-weight: 500;
}
.overBottomContent .botmIcon {
  width: 18px;
  height: 18px;
  object-fit: contain;
  position: relative;
}

.time-line {
  position: relative;
  z-index: 99;
  height: 4px;
  border-bottom-left-radius: 3px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 3px;
  width: 99%;
  margin: auto;
  margin-top: 108px;
  overflow: hidden;
}
.time-line span {
  background-color: #e5007d;
  height: 100%;
  display: block;
}

.cardTime {
  font-size: 12px;
  color: #fff;
  position: absolute;
  font-family: volte_reg;
  right: 8px;
  top: 5px;
}

.listing-block {
  position: relative;
}
.listing-block .episode-free {
  position: absolute;
  bottom: 33px;
  font-size: 18px;
  background-color: #6B00DD;
  color: #fff;
  border-radius: 0px 2px 2px 5px;
  padding: 1px 4px;
  font-family: volte_reg;
  font-weight: 400;
  width: 77%;
  letter-spacing: -0.2px;
  z-index: 1;
}
.listing-block .sports-live-tag {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: right;
  padding: 8px;
  position: absolute;
  border-radius: 2px;
  width: auto;
  height: 16px;
  background: #6B00DD;
  font-family: volte_semiBold;
  font-style: normal;
  font-size: 10px;
  font-weight: 600;
  line-height: 32px;
  color: #FFFFFF;
  top: 8px;
  left: 8px;
}
.listing-block .sports-live-tag::before {
  content: "";
  -webkit-border-radius: 0.375rem;
  border-radius: 50%;
  height: 5px;
  width: 5px;
  margin-right: 4px;
  background: #FF224A;
}

@media only screen and (max-width: 480px) {
  .time-line {
    margin-top: 116px;
  }
  .listing-block {
    position: relative;
  }
  .listing-block .seasons-list {
    height: 120px !important;
    width: 212px !important;
  }
  .listing-block .seasons-list .season-img {
    height: 120px;
    width: 212px;
    margin-right: 0;
  }
  .listing-block .seasons-list .overBottomContent {
    bottom: 5px;
  }
  .listing-block .episode-free {
    position: absolute;
    bottom: 17px;
    font-size: 8px;
    background-color: #6B00DD;
    color: #fff;
    padding: 1px 4px;
    font-family: volte_reg;
    font-weight: 400;
    width: 52%;
  }
  .listing-block .sports-live-tag {
    padding: 2px 3px;
    height: 16px;
    font-size: 10px;
  }
  .listing-item .sports-rail-item .sports-duration-detail {
    font-size: 8px;
  }
  .listing-item .sports-rail-item .duration-season {
    font-size: 12px;
  }
  .listing-item .sports-rail-item .sport-rail-detail {
    bottom: 0px;
  }
  .listing-item .sports-rail-item .sport-rail-detail .play-video-icon {
    width: 13.33px;
    height: 13.33px;
    margin-top: 0;
  }
  .listing-item .sports-rail-item .sport-rail-detail .sports-video-title {
    font-size: 12px;
    font-weight: 500;
    line-height: normal;
    letter-spacing: 0.2142857015px;
    -webkit-line-clamp: 2;
    margin-top: 0;
    margin-bottom: 5px;
  }
  .listing-item .sports-rail-item .sport-rail-detail::before {
    bottom: unset;
  }
  .listing-item .sports-rail-item .sport-rail-detail .season-title {
    line-height: 12px;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
  }
  .listing-item .sports-rail-item .sport-rail-detail:after {
    bottom: -1px;
  }
  .listing-item img.crown-image {
    height: 20px !important;
    width: 20px !important;
    margin: 4px !important;
  }
  .listing-item img.crown-image.mg-right {
    left: 47px;
    top: 6px;
  }
  .listing-item .card-provider-logo {
    width: 20px;
    height: 20px;
  }
  .listing-portrait .episode-free {
    width: 77%;
  }
  .listing-portrait img {
    width: 100px;
    height: 150px;
    border-radius: 6px;
  }
  .listing-portrait p {
    padding: 7px 4px 7px 4px !important;
    height: 30px;
  }
  .listing-portrait .listing-item .item-detail span img.crown-image {
    width: 12px;
    height: 12px;
  }
  .listing-vertical .listing-top-ten-games li .game-detail {
    bottom: 1px;
    font-size: 12.89px;
    line-height: 13px;
    width: 96px;
    right: 30px;
  }
  .listing-top_portrait p {
    padding: 7px 4px 7px 4px !important;
    height: 30px;
  }
  .listing-landscape img {
    height: 100%;
    width: 100%;
    border-radius: 6px;
  }
  .listing-landscape .browse-by-lang-listing .language-rail-item {
    height: 88px;
    width: 88px;
  }
  .listing-landscape .browse-by-lang-listing .language-rail-item img {
    height: 24px;
    width: 24px;
  }
  .listing-landscape .listing-square .card-image {
    height: 120px;
    width: 120px;
  }
  .listing-landscape .listing-square .games-favorite {
    width: 22px;
    height: 22px;
    bottom: 30px;
  }
  .listing-landscape .game-detail {
    bottom: -3px;
    font-size: 12px;
    font-weight: 500;
    line-height: 12px;
    width: 120px;
  }
  .listing-landscape .game-detail .play-count {
    font-weight: 500;
    font-size: 9px;
    line-height: 9px;
    position: relative;
    top: 1px;
  }
  .listing-landscape .listing-mid-banner-games img {
    height: 150px;
    width: 310px;
  }
  .listing-landscape .listing-mid-scroll-banner img {
    height: 100%;
    width: 100%;
  }
  .listing-landscape .browse-by-genre-listing img {
    height: 64px;
    width: 64px;
  }
  .listing-landscape .listing-item .item-detail span img.crown-image {
    width: 20px;
    height: 20px;
    top: -2.67em;
    margin-left: 4px;
  }
  .listing-live-rail li img {
    height: 64px;
    width: 64px;
  }
  .overBottomContent {
    bottom: 30%;
  }
  .overBottomContent .three-dots {
    display: inline-block;
    width: 15px;
    height: 13px;
    object-fit: contain;
    position: relative;
    margin-top: -2px;
    right: -1px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1, h2, h3, h4, h5, h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active, select:focus, select:active, button.btn:focus, button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.language-filter .slick-next,
.genre-filter .slick-next {
  right: 18px !important;
  background-color: rgba(29, 30, 48, 0.8);
}
.language-filter .slick-prev,
.genre-filter .slick-prev {
  left: -50px;
  background-color: rgba(29, 30, 48, 0.8);
}

.search-container {
  /*
    TBD
  */
}
.search-container .seo-description-container {
  padding-left: 0;
}
.search-container.empty-view {
  width: 100%;
}
.search-container .listing-vertical h2 {
  padding-left: 0;
}
.search-container .listing-vertical .sports-rail-wrapper.genre-container {
  margin-left: 0%;
  margin-top: 14px;
  margin-bottom: 4px;
}
.search-container .listing-vertical .sports-rail-wrapper.genre-container .genre-rail {
  padding-left: 133px;
}
.search-container .listing-vertical .sports-rail-wrapper.genre-container .genre-rail .listing-genre {
  padding-left: 43px !important;
}
.search-container .container-top .grid-view .listing-block {
  display: inline-flex;
}
.search-container .horizontal-gutter, .search-container .rails-container, .search-container .trending-section, .search-container .search-no-result .list-heading,
.search-container .search-list .list-heading, .search-container .filter-container, .search-container .container-top .grid-view, .search-container .container-top .search-result-header {
  padding: 0 2.8% 0 2.8%;
}
.search-container .no-horizontal-padding, .search-container .rails-container .listing-circular,
.search-container .rails-container .listing-small-landscape, .search-container .rails-container h3 {
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.search-container .mb20 {
  margin-bottom: 20px !important;
}
.search-container .pt20 {
  padding-top: 20px !important;
}
.search-container .top50 {
  top: 50px !important;
}
.search-container .top0, .search-container .rails-container .listing-container, .search-container .container-top.search-result-list {
  top: 0px !important;
}
.search-container .paddingTop40 {
  padding-top: 40px !important;
}
.search-container .marginTop30 {
  margin-top: 30px !important;
}
.search-container .marginTop60 {
  margin-top: 60px !important;
}
.search-container .marginTop90 {
  margin-top: 90px !important;
}
.search-container .marginTop110 {
  margin-top: 110px !important;
}
.search-container .marginLeft10 {
  margin-left: 10px;
  color: #f3cbe3;
}
.search-container .marginLeft10 i {
  position: inherit;
}
.search-container .marginLeft10 i::before {
  color: #f3cbe3;
}
.search-container .filter-container {
  display: none;
}
.search-container .filter-container.expanded {
  display: block;
}
.search-container .filter-container .form-group {
  margin: 22px auto;
}
.search-container .language-filter {
  margin-top: 16px;
  overflow: hidden;
  white-space: nowrap;
  margin-bottom: 10px;
  width: 100%;
}
.search-container .language-filter i {
  position: absolute;
  /*top: 20px;*/
  width: 34px;
  height: 34px;
  border: solid 1px #ffffff;
  background-color: #e10092;
  border-radius: 100%;
  cursor: pointer;
}
.search-container .language-filter i:after {
  color: #fff;
  top: 7px;
  display: inline-block;
  position: relative;
  left: 11px;
}
.search-container .language-filter .left-icon {
  /*margin-top: 12px;*/
}
.search-container .language-filter .left-icon:after {
  content: "<";
}
.search-container .language-filter .right-icon {
  /*margin-top: 12px;*/
  right: 15px;
}
.search-container .language-filter .right-icon:after {
  content: ">";
}
.search-container .language-filter li {
  cursor: pointer;
  display: inline-block;
  padding: 9px 18px;
  border-radius: 24.5px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.11), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  border: 1px solid #ffffff;
  font-size: 14px;
  color: #f3cbe3;
  line-height: 1.29;
  margin-right: 7px;
}
.search-container .language-filter li.active {
  background-color: #e5007d;
  border: none;
}
.search-container .search-no-result {
  margin-bottom: 0px;
  padding-bottom: 30px;
  display: flex;
  flex-direction: row;
  justify-content: center;
}
.search-container .search-no-result .icon-icon-search {
  font-size: 45px;
}
.search-container .search-no-result .icon-icon-search::before {
  color: #A3A6C2;
}
.search-container .horizontal-scroll {
  display: flex;
  overflow-x: hidden;
  scrollbar-width: none;
}
.search-container .horizontal-scroll::-webkit-scrollbar {
  width: 0;
  display: none;
}
.search-container .horizontal-scroll::-webkit-scrollbar-thumb {
  display: none;
}
.search-container .horizontal-scroll .list-item-style, .search-container .horizontal-scroll .filter-container .filter-item, .search-container .filter-container .horizontal-scroll .filter-item, .search-container .horizontal-scroll .explore-similar-list ul li, .search-container .explore-similar-list ul .horizontal-scroll li {
  overflow: initial;
}
.search-container .rails-container .listing-horizontal {
  padding-left: 0%;
}
.search-container .slick-prev {
  left: auto;
}
.search-container .container-top.search-result-list {
  padding-bottom: 40px;
}
.search-container .container-top .list-heading {
  font-size: 22px;
  color: #EEEEFF;
  line-height: 26px;
  font-family: volte_medium;
  top: 0;
}
.search-container .container-top .browse-language-div {
  margin-top: 25px;
  width: 100%;
  padding-left: 5.2%;
}
.search-container .container-top .search-result-header {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  margin-top: 12px;
}
.search-container .container-top .search-result-header .list-heading {
  padding-left: 0px;
}
.search-container .container-top .search-result-header .search-filter-toggle {
  color: #f3cbe3;
  padding-right: 0;
  font-family: volte_semiBold !important;
  cursor: pointer;
}
.search-container .container-top .search-result-header .search-filter-toggle .icon {
  transform: rotate(-180deg);
}
.search-container .container-top .search-result-header .search-filter-toggle .icon-down {
  font-size: 14px;
  padding-left: 8px;
}
.search-container .container-top .search-result-header .search-filter-toggle .icon-down.expanded::before {
  transform: rotate(180deg);
}
.search-container .container-top .search-result-header .search-filter-toggle .icon-down::before {
  color: #f3cbe3;
  display: inline-block;
}
.search-container .container-top .search-result-header.filter {
  justify-content: flex-end;
}
.search-container .container-top .grid-view {
  margin-top: 20px;
  min-height: 200px;
}
.search-container .container-top .grid-view.listing-landscape li, .search-container .container-top .grid-view.listing-landscape.card-image, .search-container .container-top .grid-view.listing-landscape.place-holder-image {
  width: 200px;
  height: auto;
  margin-bottom: 20px;
  padding-bottom: 55%;
}
.search-container .container-top .grid-view.listing-landscape li .card-image,
.search-container .container-top .grid-view.listing-landscape li .place-holder-image, .search-container .container-top .grid-view.listing-landscape.card-image .card-image,
.search-container .container-top .grid-view.listing-landscape.card-image .place-holder-image, .search-container .container-top .grid-view.listing-landscape.place-holder-image .card-image,
.search-container .container-top .grid-view.listing-landscape.place-holder-image .place-holder-image {
  width: 100%;
  height: 100%;
  display: inline-block;
  transform: translateZ(0);
}
.search-container .container-top .grid-view.listing-landscape .listing-search-games {
  cursor: auto;
}
.search-container .container-top .grid-view.listing-landscape .listing-search-games img {
  cursor: pointer;
}
.search-container .container-top h4 {
  color: #a3a6c2;
  font-family: volte_medium;
  font-size: 12px;
  margin-bottom: 8px;
  top: 0;
}
.search-container .container-top .language-filter .slick-list,
.search-container .container-top .genre-filter .slick-list {
  overflow: visible;
}
.search-container .container-top .language-filter .slick-list .slick-track .slick-slide,
.search-container .container-top .genre-filter .slick-list .slick-track .slick-slide {
  line-height: 41px;
}
.search-container .container-top .language-filter .slick-list .slick-track .slick-slide.slick-active,
.search-container .container-top .genre-filter .slick-list .slick-track .slick-slide.slick-active {
  opacity: 1;
}
.search-container .container-top .language-filter i,
.search-container .container-top .genre-filter i {
  position: absolute;
  top: 20px;
  width: 34px;
  height: 34px;
  border: solid 1px #ffffff;
  background-color: #e10092;
  border-radius: 100%;
  cursor: pointer;
}
.search-container .container-top .language-filter i:after,
.search-container .container-top .genre-filter i:after {
  color: #ffffff;
  top: 7px;
  display: inline-block;
  position: relative;
  left: 11px;
}
.search-container .container-top .language-filter .left-icon,
.search-container .container-top .genre-filter .left-icon {
  left: 41px;
}
.search-container .container-top .language-filter .left-icon:after,
.search-container .container-top .genre-filter .left-icon:after {
  content: "<";
}
.search-container .container-top .language-filter .right-icon,
.search-container .container-top .genre-filter .right-icon {
  right: 0;
}
.search-container .container-top .language-filter .right-icon:after,
.search-container .container-top .genre-filter .right-icon:after {
  content: ">";
}
.search-container .list-item-style, .search-container .filter-container .filter-item, .search-container .explore-similar-list ul li {
  display: flex !important;
  padding: 12px 25px;
  font-size: 22px;
  border-radius: 55px;
  border: 1px solid #F3CBE3;
  font-family: volte_reg !important;
  box-sizing: border-box;
  color: #f3cbe3;
  text-overflow: ellipsis;
  text-align: center;
  cursor: pointer;
}
.search-container .list-item-style.active, .search-container .filter-container .active.filter-item, .search-container .explore-similar-list ul li.active {
  background-color: #e10092;
  color: #ffffff;
  border: 1px solid #e5007d;
}
.search-container .list-item-style.active span, .search-container .filter-container .active.filter-item span, .search-container .explore-similar-list ul li.active span {
  margin-left: 10px;
  color: #ffffff;
  position: unset;
}
.search-container .explore-similar-list {
  padding: 10px 5.4% 0 5.2%;
  margin-bottom: 20px;
}
.search-container .explore-similar-list ul li {
  margin-right: 10px;
  display: inline-block !important;
  margin-bottom: 10px;
}
.search-container .explore-similar-list ul li:hover {
  background-color: #e10092;
}
.search-container .filter-container.expanded {
  display: block;
  margin-bottom: 20px;
}
.search-container .filter-container.expanded h4 {
  margin-top: 10px;
  padding-left: 0px;
}
.search-container .filter-container .slick-slider {
  max-width: 98%;
  margin: 5px 0px;
}
.search-container .filter-container .filter-item {
  display: initial !important;
  margin-right: 7px;
  margin-bottom: 2px;
}
.search-container .filter-container .filter-item:hover {
  color: #ffffff;
  border: 1px solid #ffffff;
}
.search-container .filter-container .slick-track {
  margin-left: 0;
}
.search-container .search-no-result > p,
.search-container .search-list > p {
  font-size: 22px;
  line-height: 28px;
  font-family: volte_semiBold;
  color: #ffffff;
  text-align: center;
  margin: 0px;
}
.search-container .search-no-result h4,
.search-container .search-list h4 {
  font-size: 22px;
  line-height: 28px;
  font-family: volte_medium;
  color: #eeeeff;
}
.search-container .search-no-result .genre-filter li:hover,
.search-container .search-list .genre-filter li:hover {
  transition: all 0.15s ease-out;
  transform: scale(1.12);
  border-radius: 2.4px;
  border: solid 1.8px #ffffff;
  background-color: #33354d;
  z-index: 4;
}
.search-container .search-no-result .language-filter li:hover,
.search-container .search-list .language-filter li:hover {
  transform: scale(1.13);
  border: none;
}
.search-container .search-no-result .language-filter .slick-next,
.search-container .search-no-result .genre-filter .slick-next,
.search-container .search-list .language-filter .slick-next,
.search-container .search-list .genre-filter .slick-next {
  display: block;
  right: 18px;
  background-color: rgba(29, 30, 48, 0.8);
}
.search-container .search-no-result .language-filter .slick-prev,
.search-container .search-no-result .genre-filter .slick-prev,
.search-container .search-list .language-filter .slick-prev,
.search-container .search-list .genre-filter .slick-prev {
  left: -50px;
  background-color: rgba(29, 30, 48, 0.8);
}
.search-container .search-no-result .language-filter .slick-disabled,
.search-container .search-no-result .genre-filter .slick-disabled,
.search-container .search-list .language-filter .slick-disabled,
.search-container .search-list .genre-filter .slick-disabled {
  display: none !important;
}
.search-container .search-no-result .language-filter li,
.search-container .search-no-result .genre-filter li,
.search-container .search-list .language-filter li,
.search-container .search-list .genre-filter li {
  box-shadow: none;
  width: 92px;
  margin-right: 20px;
  overflow: hidden;
  background-color: transparent;
  height: auto;
  margin-bottom: 10px;
}
.search-container .search-no-result .language-filter li.browse-by-genre-listing,
.search-container .search-no-result .genre-filter li.browse-by-genre-listing,
.search-container .search-list .language-filter li.browse-by-genre-listing,
.search-container .search-list .genre-filter li.browse-by-genre-listing {
  height: 90px;
  margin-right: 26px;
}
.search-container .search-no-result .language-filter li.browse-by-genre-listing .genre-item-title,
.search-container .search-no-result .genre-filter li.browse-by-genre-listing .genre-item-title,
.search-container .search-list .language-filter li.browse-by-genre-listing .genre-item-title,
.search-container .search-list .genre-filter li.browse-by-genre-listing .genre-item-title {
  position: absolute;
  bottom: 5px;
  height: 20px;
  line-height: 19px;
  letter-spacing: normal;
  color: #ffffff;
  font-size: 16px;
  left: 10px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.search-container .search-no-result .language-filter li.browse-by-genre-listing .image-blend,
.search-container .search-no-result .genre-filter li.browse-by-genre-listing .image-blend,
.search-container .search-list .language-filter li.browse-by-genre-listing .image-blend,
.search-container .search-list .genre-filter li.browse-by-genre-listing .image-blend {
  background-color: rgba(0, 0, 0, 0.5);
  content: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==");
}
.search-container .search-no-result .language-filter li.browse-by-genre-listing img,
.search-container .search-no-result .genre-filter li.browse-by-genre-listing img,
.search-container .search-list .language-filter li.browse-by-genre-listing img,
.search-container .search-list .genre-filter li.browse-by-genre-listing img {
  height: 100%;
  border-radius: 0;
}
.search-container .search-no-result .language-filter li.browse-by-genre-listing,
.search-container .search-no-result .genre-filter li.browse-by-genre-listing,
.search-container .search-list .language-filter li.browse-by-genre-listing,
.search-container .search-list .genre-filter li.browse-by-genre-listing {
  border-radius: 7px;
}
.search-container .search-no-result .language-filter li.browse-by-lang-listing:hover,
.search-container .search-no-result .genre-filter li.browse-by-lang-listing:hover,
.search-container .search-list .language-filter li.browse-by-lang-listing:hover,
.search-container .search-list .genre-filter li.browse-by-lang-listing:hover {
  transform: scale(1.1);
}
.search-container .search-no-result .language-filter li.browse-by-lang-listing:hover .place-holder-image,
.search-container .search-no-result .genre-filter li.browse-by-lang-listing:hover .place-holder-image,
.search-container .search-list .language-filter li.browse-by-lang-listing:hover .place-holder-image,
.search-container .search-list .genre-filter li.browse-by-lang-listing:hover .place-holder-image {
  border: 1.5px solid #fff;
  border-radius: 50% !important;
  object-fit: none;
}
.search-container .search-no-result .language-filter li img,
.search-container .search-no-result .genre-filter li img,
.search-container .search-list .language-filter li img,
.search-container .search-list .genre-filter li img {
  border-radius: 100%;
  background-color: transparent;
}
.search-container .search-no-result .language-filter li img.broken-image, .search-container .search-no-result .language-filter li img.place-holder-image,
.search-container .search-no-result .genre-filter li img.broken-image,
.search-container .search-no-result .genre-filter li img.place-holder-image,
.search-container .search-list .language-filter li img.broken-image,
.search-container .search-list .language-filter li img.place-holder-image,
.search-container .search-list .genre-filter li img.broken-image,
.search-container .search-list .genre-filter li img.place-holder-image {
  box-shadow: none !important;
  background-color: transparent !important;
  border-radius: unset !important;
}
.search-container .search-no-result .language-filter li p,
.search-container .search-no-result .genre-filter li p,
.search-container .search-list .language-filter li p,
.search-container .search-list .genre-filter li p {
  background: transparent;
  bottom: 0;
}
.search-container .search-no-result .language-filter li img.browseBy,
.search-container .search-no-result .genre-filter li img.browseBy,
.search-container .search-list .language-filter li img.browseBy,
.search-container .search-list .genre-filter li img.browseBy {
  width: 60px;
  height: 60px;
  top: 15%;
  left: 20%;
  box-shadow: none;
  border-radius: 0;
}
.search-container .listing-landscape .listing-block {
  position: relative;
}
.search-container .browse-by-listing .language-filter,
.search-container .browse-by-listing .genre-filter {
  margin-left: 0;
}
.search-container .browse-by-listing .language-filter .listing-block,
.search-container .browse-by-listing .genre-filter .listing-block {
  text-align: inherit;
  color: inherit;
  line-height: inherit;
}
.search-container .browse-by-listing .slick-arrow {
  top: 50px;
}
.search-container .browse-by-listing span {
  text-align: center;
  padding: 0 !important;
  line-height: 1.2;
  color: #a3a6c2;
}
.search-container .browse-by-listing span.lang-item-title {
  margin-top: 6px;
}
.search-container .search-no-result > p {
  width: auto;
  padding: 0 25px;
  font-family: volte_semiBold;
  font-size: 24px;
  line-height: 26.4px;
  font-weight: 700;
  letter-spacing: 0.1px;
  align-self: center;
}
.search-container .heading-line .hide-icon:after {
  transform: rotate(90deg);
}
.search-container .listing-vertical .divider-title-section {
  margin-bottom: 10px;
  margin-top: 14px;
}
.search-container .search-list .heading-line:before {
  margin-right: 0;
  width: 96%;
}
.search-container .btn-clear {
  position: absolute;
  margin-top: 14px;
  margin-left: -30px;
  cursor: pointer;
}
.search-container .search-no-result .genre-filter li img.browseBy,
.search-container .search-list .genre-filter li img.browseBy {
  width: 50px;
  height: 50px;
  top: 18%;
  left: 26%;
}
.search-container .set-hover-search {
  margin-top: -20px;
}
@media only screen and (max-width: 680px) {
  .search-container .search-no-result > p {
    width: auto;
    padding: 0 10px;
    margin-bottom: 20px;
  }
  .search-container .search-no-result > p:after {
    content: none;
  }
  .search-container .filter-item {
    padding: 8px 10px !important;
    font-size: 16px !important;
    white-space: nowrap;
  }
  .search-container .trending-section .trending-heading {
    display: flex;
  }
  .search-container .trending-section ul li {
    margin-right: 7px !important;
  }
}
@media only screen and (max-width: 768px) {
  .search-container .language-filter .slick-initialized .slick-prev,
  .search-container .genre-filter .slick-initialized .slick-prev {
    left: 16px;
    z-index: 1;
  }
  .search-container .horizontal-scroll {
    overflow-x: scroll !important;
  }
}
.search-container .trending-section {
  margin-top: 10px;
  margin-bottom: 62px;
}
.search-container .trending-section .trending-heading {
  display: flex;
}
.search-container .trending-section .trending-heading .trending-img {
  margin-right: 7px;
  height: 24px;
  width: 24px;
}
.search-container .notification-icon {
  display: flex !important;
  align-items: center;
}
.search-container .mobile-view-search {
  background-color: #1d1e30;
  padding: 15px;
  z-index: 999;
  display: flex;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
}
.search-container .mobile-view-search .backarrow {
  position: relative;
  top: 10px;
}
.search-container .mobile-view-search ::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-size: 14px;
}
.search-container .mobile-view-search .icon-icon-search {
  z-index: 10;
  position: relative;
  left: 25px;
  top: 13px;
}
.search-container .mobile-view-search input {
  width: 100%;
  font-size: 16px;
  font-family: inherit;
  -webkit-appearance: none;
  background-color: #33354d;
  border-radius: 5px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12);
  border: none;
  color: #a3a6c2;
  padding: 5px 38px 5px 30px;
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border: 2px solid #a3a6c2;
}
.search-container .mobile-view-search .right-icon {
  z-index: 10;
  position: relative;
  top: 10px;
  right: 32px;
}
.search-container .mobile-view-search .right-icon.close {
  top: 12px;
}
.search-container li.browse-by-genre-listing {
  margin-right: 20px !important;
}
.search-container .rails-container .listing-vertical {
  margin-bottom: 0px !important;
}
.search-container .no-search-result {
  margin-top: 30px !important;
  width: 100%;
}
.search-container .no-search-result .rails-container {
  padding: 0;
  width: 100%;
  padding-right: 0% !important;
}
.search-container .no-search-result .rails-container .listing-circular {
  width: 100%;
}
.search-container .no-search-result .rails-container .listing-circular .list-heading {
  padding-left: 5.2% !important;
}
.search-container .no-search-result .rails-container .listing-container {
  width: 100%;
  padding-left: 2.8% !important;
  display: block;
}
.search-container .no-search-result .rails-container .listing-container .listing-circular {
  width: 100%;
}
.search-container .no-search-result .rails-container .listing-container .listing-circular .slick-slider {
  max-width: 100% !important;
  width: 100%;
}
.search-container .no-search-result .rails-container .listing-container.partner .slick-slider {
  max-width: 100%;
}
.search-container .no-search-result .rails-container .app-provider-container {
  width: 100%;
}
.search-container .no-search-result .rails-container .app-provider-container .listing-circular {
  width: 100%;
}
.search-container .no-search-result .rails-container .app-provider-container .listing-circular .slick-slider {
  max-width: 98%;
}
.search-container .no-search-result .rails-container .app-provider-container .listing-circular .slick-prev {
  left: -3% !important;
}
@media only screen and (min-width: 320px) and (max-width: 520px) {
  .search-container .search-no-result > p {
    width: auto;
    padding: 0 10px;
    text-align: left;
    font-family: volte_reg;
    margin-bottom: 20px;
  }
  .search-container .search-no-result > p:after {
    content: none;
  }
  .search-container .list-heading {
    font-size: 16px !important;
    line-height: 16px !important;
  }
  .search-container .search-result-header .search-filter-toggle {
    margin-top: 10px;
  }
  .search-container .btn-clear {
    margin-top: 10px;
  }
  .search-container .explore-similar-list ul li {
    padding: 5.5px 15px !important;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 120%;
    align-items: center;
    text-align: center;
  }
  .search-container .explore-similar-list ul li img {
    height: 10px;
  }
  .search-container .explore-similar-list ul li i {
    font-size: 10px;
  }
  .search-container .listing-circular li {
    width: 64px !important;
    height: 64px !important;
  }
}
@media only screen and (max-width: 480px) {
  .search-container .language-filter .slick-slider,
  .search-container .genre-filter .slick-slider {
    margin: 0 !important;
  }
  .search-container .language-filter .slick-list .slick-track .slick-slide,
  .search-container .genre-filter .slick-list .slick-track .slick-slide {
    line-height: 33px !important;
  }
  .search-container .search-result-list {
    padding-top: 20px !important;
  }
  .search-container .paddingTop0 {
    padding-top: 0 !important;
  }
  .search-container .explore-similar-list {
    margin-bottom: 0;
    padding: 10px 2.8% 0 2.8%;
  }
  .search-container .listing-landscape .browse-by-genre-listing {
    margin-right: 7px !important;
  }
  .search-container .listing-landscape .browse-by-genre-listing .genre-item-title {
    font-size: 11px !important;
    line-height: 16px !important;
  }
  .search-container .listing-landscape .browse-by-genre-listing img {
    width: 100%;
  }
  .search-container .listing-landscape .browse-by-lang-listing .lang-item-title {
    font-size: 12px !important;
    line-height: 16px !important;
  }
  .search-container .search-container .container-top .grid-view {
    margin-top: 20px !important;
  }
  .search-container .genre-filter .listing-item img {
    width: 70px;
  }
  .search-container .language-filter .listing-item,
  .search-container .genre-filter .listing-item {
    margin-right: 0 !important;
    width: 78px !important;
    height: 65px !important;
  }
  .search-container .search-result-header .list-heading {
    width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 20px;
  }
  .search-container .search-result-header .search-filter-toggle {
    max-width: 120px;
    margin-top: 0px !important;
    position: relative;
    bottom: 4px;
    font-size: 16px;
  }
  .search-container .provider-listing {
    margin-right: 8px !important;
  }
  .search-container .trending-section {
    margin-bottom: 0;
    width: 100%;
  }
  .search-container .trending-section .trending-heading .trending-img {
    height: 20px;
    width: 20px;
  }
  .search-container .trending-section img.trending-img {
    position: relative;
    bottom: 3px;
    margin-right: 6px;
  }
  .search-container .trending-section .grid-view {
    width: 90%;
    margin: 10px auto;
  }
  .search-container .trending-section .grid-view .infinite-scroll-component__outerdiv {
    width: 100%;
  }
  .search-container .trending-section .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    justify-content: center;
    width: 100%;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
  }
  .search-container .search-no-result > p {
    width: auto;
    padding: 0 20px;
    font-family: volte_semiBold;
    font-size: 16px;
    line-height: 17.6px;
    margin-bottom: 20px;
    margin-top: 0px;
  }
  .search-container .search-no-result > p:after {
    content: none;
  }
  .search-container .container-top .filter-container {
    margin-top: 0px;
    padding-right: 0px;
  }
  .search-container .rails-container .search-result-header {
    margin-bottom: 0px !important;
  }
  .search-container .search-no-result {
    padding: 15px 0 0;
    position: relative;
  }
  .search-container .search-container .search-no-result {
    padding-top: 70px;
  }
}
.search-container .provider-listing {
  margin-right: 20px;
  height: 90px;
  width: 90px;
}
.search-container .listing-circular .slick-slider {
  float: left;
}
.search-container .listing-circular li {
  box-shadow: none;
  overflow: hidden;
  background-color: transparent;
}
.search-container .listing-circular li.provider-listing {
  height: 90px;
  border: 1px solid #564372;
  border-radius: 8px;
}
.search-container .listing-circular li.provider-listing .card-image {
  border-radius: unset;
}
.search-container .listing-circular li img {
  border-radius: 100%;
  background-color: transparent;
}
.search-container .listing-circular li img.broken-image, .search-container .listing-circular li img.place-holder-image {
  box-shadow: none !important;
  background-color: transparent !important;
  border-radius: unset !important;
  outline: none;
}
.search-container .listing-circular li img.broken-image:focus, .search-container .listing-circular li img.broken-image:hover, .search-container .listing-circular li img.place-holder-image:focus, .search-container .listing-circular li img.place-holder-image:hover {
  outline: none;
}
.search-container .listing-circular li p {
  background: transparent;
  bottom: 0px;
}
.search-container span.lang-item-title {
  font-size: 12px;
  line-height: 13px;
  margin-top: 6px;
  color: #A3A6C2;
}
.search-container .slick-slider {
  display: flex;
}
.search-container .app-provider-container {
  display: inline-block;
  width: 100%;
}
.search-container .app-provider-container .see-all-margin {
  display: none;
}

.search-container {
  margin-top: -10px;
}
.search-container .grid-view .infinite-scroll-component__outerdiv {
  width: 100%;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 20px;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  display: block;
  width: 100%;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  height: 100%;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .episode-free {
  border-radius: 0px 0px 8px 0px;
  padding: 6px;
  width: auto;
  right: 0px;
  bottom: 0px;
  font-size: 12px;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover {
  height: 100%;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover {
  height: fit-content;
  width: 110%;
  margin-left: -11px;
  margin-top: -14px;
  padding-bottom: 5px;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .image-top {
  height: 67%;
}
.search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .image-top img {
  height: 100%;
}
.search-container.for-mobile-view .grid-view {
  min-height: 150px;
  width: 100%;
}
.search-container .search-no-result {
  padding-left: 5.2%;
  padding-right: 5.4%;
}
@media only screen and (max-width: 480px) {
  .search-container .no-search-result {
    margin-top: 0px !important;
  }
  .search-container .search-result-list {
    padding-bottom: 0px !important;
    overflow: hidden;
  }
  .search-container .filter-container .form-group {
    margin: 17.5px auto;
  }
  .search-container .filter-container .form-data {
    width: 144px;
    height: 19px;
  }
}

@media only screen and (max-width: 480px) {
  .search-container .listing-vertical .sports-rail-wrapper.genre-container {
    margin-bottom: 0;
  }
  .search-container .listing-vertical .sports-rail-wrapper.genre-container .genre-rail {
    padding-left: 66px;
  }
  .search-container .listing-vertical .sports-rail-wrapper.genre-container .genre-rail .listing-horizontal {
    padding-left: 0% !important;
  }
  .search-container .listing-vertical .sports-rail-wrapper.genre-container .listing-block:nth-child(1) {
    padding-left: 45px;
  }
  .page-cls-search .bottom-margin {
    margin-bottom: 0;
  }
  .page-cls-search .search-header-icon {
    display: none;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1920px) {
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, 1fr);
  }
}
@media only screen and (min-width: 1341px) and (max-width: 1599px) {
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media only screen and (min-width: 1171px) and (max-width: 1340px) {
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media only screen and (min-width: 941px) and (max-width: 1170px) {
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 940px) {
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (max-width: 480px) {
  .search-container .listing-landscape .listing-block .browse-by-lang-listing,
  .search-container .listing-landscape .listing-block .browse-by-genre-listing {
    padding-bottom: 0 !important;
    width: 88px !important;
  }
  .search-container .listing-landscape .listing-block .browse-by-genre-listing {
    width: 82px !important;
  }
  .search-container .listing-landscape .listing-block .browse-by-category-listing {
    padding-bottom: 0 !important;
    width: 100px !important;
  }
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
  }
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
    height: auto;
    padding-bottom: 56.5%;
  }
  .search-container .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .episode-free {
    padding: 4px;
    font-size: 10px;
    border-radius: 0px 0px 6px 0px;
  }
  .search-container .trending-section .grid-view .infinite-scroll-component__outerdiv .infinite-scroll-component {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
  }
}
@media only screen and (min-width: 481px) and (max-width: 1920px) {
  .search-container .listing-landscape .listing-block .browse-by-lang-listing,
  .search-container .listing-landscape .listing-block .browse-by-genre-listing {
    width: 96px !important;
  }
  .search-container .listing-landscape .listing-block .browse-by-genre-listing {
    width: 140px !important;
  }
  .search-container .listing-landscape .listing-block .browse-by-category-listing {
    width: 200px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.listing-container {
  position: relative;
  top: 0;
  overflow: hidden;
}
.listing-container .slick-list {
  overflow: visible;
}
.listing-container .slick-list .slick-track {
  margin-left: unset;
}
.listing-container .slick-list .slick-track .slick-slide {
  opacity: 0.5;
  position: relative;
}
.listing-container .slick-list .slick-track .slick-slide.slick-active {
  opacity: 1;
  margin-bottom: 17px;
}
.listing-container .listing-newset-game-rail {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
.listing-container .listing-game-of-the-rail {
  margin-left: 5%;
  margin-bottom: 20px;
}
.listing-container.language-nudge {
  top: 10px;
}

.margin-top-30 {
  top: 30px;
}

.set-portrait-hover {
  margin-top: -303px !important;
  width: 96% !important;
}

.provider-container {
  background: #33354d;
}

.language-nudge .listing-vertical:last-child {
  margin-bottom: 31px;
}

.listing-vertical {
  margin-bottom: 33px;
}
.listing-vertical:first-child.background-banner-rail {
  margin-top: 16px;
}
.listing-vertical:first-child.special-banner-container {
  margin-top: 35px;
}
.listing-vertical.background-banner-rail .banner-shadow {
  width: 2.8%;
  position: absolute;
  z-index: 2;
  height: 159px;
  background: #020005;
}
.listing-vertical.background-banner-rail .banner-shadow.multi-shadow {
  height: 187px;
}
.listing-vertical.series-banner-container .series-banner-rail {
  height: 203px;
  background: #000;
  margin-left: 0;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner {
  width: 392px;
  height: 100%;
  position: absolute;
  z-index: 10;
  background: #000;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner img {
  width: 100%;
  height: 100%;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner .provider-image-wrapper {
  width: 36px;
  height: 36px;
  position: absolute;
  left: 16px;
  top: 16px;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner .banner-shadow {
  content: ".";
  position: absolute;
  right: 0%;
  top: 0%;
  width: 7.84%;
  height: 100%;
  background: linear-gradient(to right, rgb(2, 0, 5), transparent 0%, transparent 0%, rgb(2, 0, 5));
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail {
  width: 100%;
  top: 16px;
  position: absolute;
  padding-left: 392.5px;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .divider-title-section.series-rail-title {
  display: none;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal {
  padding-left: unset;
  z-index: 4;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .m-fadeOut {
  opacity: 0;
  visibility: hidden;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .disable-click {
  pointer-events: none;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .ov-hidden {
  overflow: hidden;
  pointer-events: none;
  visibility: hidden;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info {
  background: rgba(0, 0, 0, 0.3215686275);
  height: 32px;
  width: 100%;
  color: #FFFFFF;
  position: absolute;
  display: flex;
  align-items: center;
  bottom: 0px;
  font-size: 16px;
  font-weight: 500;
  backdrop-filter: blur(64px);
  padding: 6px;
  line-height: 19.2px;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info .play {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info .play img {
  width: 100%;
  height: 100%;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info .special-series-title {
  padding-top: 3px;
}
.listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .card-provider-logo {
  display: none;
}
.listing-vertical .seo-description-container {
  padding-top: 0px;
  padding-bottom: 10px;
  margin-top: -4px;
}
.listing-vertical .seo-description-container p {
  color: #D6C6F4;
  font-size: 16px;
}
.listing-vertical.binge-top-rail {
  margin-bottom: 0;
}
.listing-vertical:last-child {
  margin-bottom: 62px;
}
.listing-vertical h2 {
  padding-left: 2.8%;
  font-size: 22px;
  font-family: volte_medium;
  color: #eeeeff;
  line-height: 120%;
  position: relative;
  top: 4px;
  font-weight: 500;
}
.listing-vertical h2.rail-clickable-Title {
  padding-left: 0;
  left: 2.8%;
}
.listing-vertical h2.rail-clickable-Title a {
  text-decoration: none;
  color: inherit;
}
.listing-vertical .seo-provider-railtitle {
  display: none;
}
.listing-vertical .rail-title {
  padding-left: 2.8%;
  position: relative;
  top: 4px;
  display: flex;
  align-items: center;
}
.listing-vertical .rail-title h2 {
  padding-left: 0%;
  font-size: 22px;
  font-family: volte_medium;
  color: #eeeeff;
  line-height: 120%;
  font-weight: 500;
}
.listing-vertical .divider-title-section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 11px;
}
.listing-vertical .divider-title-section .rail-image-title-wrapper {
  position: relative;
  left: 2.8%;
  display: flex;
  align-items: center;
}
.listing-vertical .divider-title-section .rail-image-title-wrapper .provider-wrapper {
  width: 48px;
  height: 48px;
  cursor: pointer;
  margin-right: 12px;
  border: 1px solid #564372;
  border-radius: 5px;
}
.listing-vertical .divider-title-section .rail-image-title-wrapper .provider-wrapper img {
  width: 100%;
  height: 100%;
}
.listing-vertical .divider-title-section .rail-image-title-wrapper .broken-image {
  display: none;
  margin: 0;
  height: 0;
}
.listing-vertical .divider-title-section .rail-image-title-wrapper .headings h2 {
  left: 0;
  font-size: 18px;
  line-height: 21.6px;
  color: #FFFFFF;
}
.listing-vertical .divider-title-section .rail-image-title-wrapper .headings .sub-heading {
  color: #C7C0CF;
  font-family: volte_reg;
  font-weight: 500;
  font-size: 12px;
  line-height: 14.4px;
  letter-spacing: 0px;
  margin-top: 4px;
  margin-left: 0;
  cursor: pointer;
}
.listing-vertical .divider-title-section .sports-rail-header-image {
  height: 30px;
}
.listing-vertical .divider-title-section .trending-img {
  margin-right: 7px;
  margin-bottom: -3px;
  height: 24px;
  width: 24px;
}
.listing-vertical .mid-banner-game-title {
  display: none;
}
.listing-vertical .game-top-ten-title {
  margin-bottom: 15px;
}
.listing-vertical .game-title {
  margin-bottom: 4px;
}
.listing-vertical .live-rail-title .divider-title-section {
  margin-bottom: 20px;
  position: relative;
  z-index: 2;
}
.listing-vertical .live-rail-title .divider-title-section .rail-title {
  z-index: 1;
}
.listing-vertical .live-rail-title .divider-title-section .rail-title .rail-clickable-Title {
  left: 0;
}
.listing-vertical .live-rail-title .divider-title-section .see-all-link::after {
  top: 8px;
}
.listing-vertical .browe-app-tittle {
  justify-content: center;
}
.listing-vertical .hide-divider {
  margin-bottom: 24px;
  padding-left: 90px;
}
.listing-vertical .see-all-link {
  padding-right: 3.4%;
  text-decoration: none;
  cursor: pointer;
  font-family: volte_medium;
  color: #ffffff;
}
.listing-vertical .see-all-link.image-link:after {
  top: 4px;
}
.listing-vertical .see-all-link:after {
  content: "";
  display: inline-block;
  width: 21px;
  height: 20px;
  background: url(/a0cddd7a10dfb536a81663c840ad9818.png) no-repeat;
  position: relative;
  top: 0px;
  left: 7px;
}
.listing-vertical h2.see-all-margin {
  margin-bottom: 31px;
  margin-right: 40px;
}
.listing-vertical .genre-container h2 {
  position: absolute;
  padding: 0;
  text-align: center;
  top: 16%;
  left: 25px;
  width: 110px;
  font-size: 24px;
  z-index: 11;
  backface-visibility: hidden;
}
.listing-vertical .genre-container .divider-title-section {
  margin: 0;
}
.listing-vertical .genre-container .browse-by-genre-listing {
  height: 96px;
}
.listing-vertical .genre-container .browse-by-genre-listing img {
  height: 96px;
}
.listing-vertical .genre-container .genre-reel {
  position: absolute;
  z-index: 10;
  left: 0;
  height: inherit;
  top: 0;
}
.listing-vertical .genre-container .rotate {
  -webkit-animation: spin 2s linear infinite;
  -moz-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
@-moz-keyframes spin {
  100% {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transition: all 0.3s ease;
  }
}
@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
.listing-vertical .genre-container .reverse {
  -webkit-animation: spinR 2s linear infinite;
  -moz-animation: spinR 2s linear infinite;
  animation: spinR 2s linear infinite;
}
@keyframes spinR {
  from {
    transform: rotate(360deg);
  }
  to {
    transform: rotate(0deg);
    transition: all 0.3s ease;
  }
}
.listing-vertical .genre-container .genre-wrapper {
  position: relative;
  width: 100%;
  height: 150px;
  display: flex;
}
.listing-vertical .genre-container .genre-wrapper::before {
  content: "";
  background: #020005;
  width: 140px;
  height: 143px;
  position: absolute;
  border-radius: 100%;
  z-index: 1;
}
.listing-vertical .genre-container .genre-wrapper img {
  height: 100%;
}
.listing-vertical .genre-container .genre-wrapper .reel-wrapper {
  height: inherit;
  z-index: 2;
}
.listing-vertical .genre-container .genre-wrapper .reel-wrapper img {
  border-radius: 100%;
}
.listing-vertical .genre-container .genre-wrapper .reel-tp-wrapper {
  margin-left: -58px;
}
.listing-vertical .genre-container .listing-landscape li .browse-by-genre-listing {
  width: 140px;
  height: 96px;
}
.listing-vertical .sports-rail-wrapper {
  position: relative;
  padding-left: 0;
}
.listing-vertical .sports-rail-wrapper.genre-container {
  margin-left: 2.8%;
}
.listing-vertical .sports-rail-wrapper.genre-container .m-fadeOut {
  opacity: 0;
  visibility: hidden;
}
.listing-vertical .sports-rail-wrapper.genre-container .genre-scroll {
  overflow-x: scroll;
  white-space: nowrap;
  scrollbar-width: none;
}
.listing-vertical .sports-rail-wrapper.genre-container .genre-scroll::-webkit-scrollbar {
  display: none;
}
.listing-vertical .sports-rail-wrapper.genre-container .ov-hidden {
  overflow: hidden;
  pointer-events: none;
}
.listing-vertical .sports-rail-wrapper.genre-container .browse-by-genre-listing {
  width: 140px;
  height: 96px;
  background: #564372;
  border: 1.71429px solid #8E81A1;
  border-radius: 13.7143px;
}
.listing-vertical .sports-rail-wrapper.genre-container .genre-rail {
  position: absolute;
  top: 28px;
  padding-left: 134px;
  width: 100%;
}
.listing-vertical .sports-rail-wrapper.genre-container .genre-rail .slick-active {
  margin: 0;
}
.listing-vertical .sports-rail-wrapper.genre-container .genre-rail .slick-slide {
  opacity: 1;
}
.listing-vertical .sports-rail-wrapper.genre-container .listing-horizontal {
  padding-left: 47px;
  overflow: hidden;
  z-index: unset;
}
.listing-vertical .sports-rail-wrapper.genre-container .listing-horizontal .slick-prev {
  left: -3%;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container {
  height: 159px;
  margin-left: 2.8%;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail {
  width: 100%;
  position: absolute;
  top: 16%;
  padding-left: 280px;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal {
  padding-left: 30px;
  z-index: unset;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .slick-list .slick-track .slick-slide {
  margin-bottom: 0;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .disable-click {
  pointer-events: none;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .slick-prev {
  left: 1.3%;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .slick-arrow {
  top: 48%;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item {
  width: 200px;
  height: 111px;
  margin-right: 20px;
  border-radius: 6px;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .episode-free {
  border-radius: 0px 0px 6px 0px;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .card-image {
  height: 111px;
  border-radius: 6px;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .crown-image {
  width: 30px;
  height: 30px;
  margin: 5px !important;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .crown-image.mg-right {
  margin: 0 !important;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .sports-rail-item .sports-video-title {
  width: 65%;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .sports-rail-item .sports-duration-detail {
  position: relative;
  margin: 0 0 0 10px;
}
.listing-vertical .sports-rail-wrapper.banner-revamp-container .divider-title-section {
  display: none;
}
.listing-vertical .sports-rail-wrapper .background-banner-revamp {
  width: 280.77px;
  height: 100%;
  position: absolute;
  z-index: 1;
  background: #020005;
}
.listing-vertical .sports-rail-wrapper .background-banner-revamp .banner-shadow {
  content: ".";
  position: absolute;
  right: 0%;
  top: 0%;
  width: 7.84%;
  height: 100%;
}
.listing-vertical .sports-rail-wrapper .background-banner-revamp img {
  width: 100%;
  height: 100%;
}
.listing-vertical .sports-rail-wrapper .background-banner-revamp .provider-image-wrapper {
  width: 44px;
  height: 44px;
  position: absolute;
  left: 24px;
  top: 24px;
}
.listing-vertical .sports-rail-wrapper .background-banner-revamp .provider-image-wrapper img {
  border-radius: 1.83px;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail {
  margin-left: 0;
  height: 299px;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: white;
  width: 415px;
  height: 100%;
  font-family: volte_medium;
  position: absolute;
  z-index: 1;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-banner-title {
  max-width: 265px;
  display: inline-block;
  padding: 8px 20px 8px 10px;
  background-color: #6B00DD;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  clip-path: polygon(0 0, 95% 0, 100% 100%, 0% 100%);
  position: relative;
  margin-top: 75.5px;
  margin-bottom: 30px;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-banner-title span {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  white-space: normal;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description {
  margin-left: 25px;
  width: 215px;
  text-align: left;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description .festive-description-title {
  font-size: 24px;
  font-weight: 500;
  line-height: 28.8px;
  margin-bottom: 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  white-space: normal;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description .festive-description {
  font-size: 16px;
  font-weight: 500;
  line-height: 19.2px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  white-space: normal;
}
@media only screen and (max-width: 480px) {
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description .festive-description {
    -webkit-line-clamp: 3;
  }
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .special-image-wrapper {
  position: absolute;
  right: 0px;
  top: 0;
  width: 150px;
  height: 100%;
  display: flex;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .special-image-wrapper .tree-image {
  width: 100%;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail {
  width: 100%;
  position: absolute;
  top: 5%;
  padding-left: 420px;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .special-rail-title {
  display: none;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal {
  padding-left: 1.5%;
  z-index: 0;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait .slick-initialized .slick-slide {
  width: 194px !important;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait .slick-initialized .slick-slide.disable-click {
  pointer-events: none;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait .listing-item .card-image {
  height: 267px;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait li {
  width: 178px;
  height: 267px;
  margin-right: 16px;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait li .crown-image {
  margin: 8px !important;
}
.listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait li .crown-image.mg-right {
  margin: 0 !important;
}
.listing-vertical .sports-rail-wrapper .sports-rail-background {
  height: 621px;
  position: relative;
}
.listing-vertical .sports-rail-wrapper .sports-rail-background::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(90deg, rgba(2, 0, 5, 0.5) 0%, rgba(2, 0, 5, 0) 50.8%, rgba(2, 0, 5, 0.5) 100%), linear-gradient(360deg, #020005 0%, #020005 19.89%, rgba(2, 0, 5, 0) 57%);
  width: 100%;
  height: 100%;
}
.listing-vertical .sports-rail-wrapper .sports-rail-background img {
  width: 100%;
  height: 621px;
}
.listing-vertical .sports-rail-wrapper .sports-rail {
  width: 100%;
}
.listing-vertical .sports-rail-wrapper .sports-rail .divider-title-section h2 {
  padding-left: 0;
}
.listing-vertical .sports-rail-wrapper .sports-rail .provider-logo {
  padding-left: 0;
}
.listing-vertical .sports-rail-wrapper .sports-rail ul {
  padding-left: 0;
}
.listing-vertical .listing-portrait {
  position: relative;
  z-index: 3;
}
.listing-vertical .listing-portrait.medium li {
  width: 220px;
  height: 330px;
}
.listing-vertical .listing-portrait.medium .slick-initialized .slick-slide {
  width: 236px !important;
}
.listing-vertical .listing-portrait.medium .set-portrait-hover {
  margin-top: -337px !important;
}
.listing-vertical .listing-portrait.medium .set-portrait-hover .image-top img {
  height: 300px;
}
.listing-vertical .listing-portrait.large li {
  width: 260px;
  height: 390px;
}
.listing-vertical .listing-portrait.large .slick-initialized .slick-slide {
  width: 276px !important;
}
.listing-vertical .listing-portrait.large .hover-popup .popover {
  left: -4px;
}
.listing-vertical .listing-portrait.large .set-portrait-hover {
  margin-top: -395px !important;
}
.listing-vertical .listing-portrait.large .set-portrait-hover .image-top img {
  height: 360px;
}
.listing-vertical .listing-portrait li {
  width: 178px;
  height: 267px;
  margin-right: 20px;
}
.listing-vertical .listing-portrait li .card-image {
  border-radius: 8px !important;
  height: 100%;
}
.listing-vertical .listing-portrait li .broken-image {
  height: 100%;
}
.listing-vertical .listing-portrait li .episode-free {
  font-size: 12px;
  padding: 6px;
  bottom: 0;
  right: 0;
  border-radius: unset;
  width: auto;
}
.listing-vertical .listing-portrait .slick-initialized .slick-slide {
  width: 194px !important;
}
.listing-vertical .listing-portrait .hover-popup .popover {
  left: -6px;
}
.listing-vertical .listing-portrait .set-portrait-hover {
  margin-top: -275px !important;
}
.listing-vertical .listing-portrait img.freemium-image {
  width: 18px;
  height: 15px;
  bottom: 35px;
}
.listing-vertical .listing-portrait .tvod-listing-item {
  height: 319px !important;
}
.listing-vertical .listing-top-ten-games .listing-double-number {
  width: 250px;
}
.listing-vertical .listing-top-ten-games .slick-slide:first-child li .top-ten-image img {
  left: -5%;
}
.listing-vertical .listing-top-ten-games li {
  width: 220px;
  height: 198px;
}
.listing-vertical .listing-top-ten-games li .card-image {
  width: 157px;
  height: 157px;
  border-radius: 20.893px;
  right: 0;
  z-index: 2;
}
.listing-vertical .listing-top-ten-games li .games-favorite {
  width: 30px;
  height: 30px;
  right: 5px;
  bottom: 48px;
  z-index: 3;
}
.listing-vertical .listing-top-ten-games li .top-ten-image img {
  width: 84px;
  height: 104px;
  bottom: 55px;
}
.listing-vertical .listing-top-ten-games li .top-ten-image img.double-number-image {
  width: 140px !important;
}
.listing-vertical .listing-top_portrait li {
  width: 293px;
  height: 350px;
  margin-right: 16px;
  border-radius: 6px;
}
.listing-vertical .listing-top_portrait li div:nth-child(1) {
  width: 75.087%;
  position: relative;
  height: 94.286%;
  right: -25%;
  z-index: 2;
  border-radius: 8px;
}
.listing-vertical .listing-top_portrait li div:nth-child(1) .card-image {
  width: 100%;
  height: 100%;
  border-radius: 8px;
}
.listing-vertical .listing-top_portrait li .top-portrait-episode-free {
  width: 34.5%;
  left: 66%;
  bottom: 20px;
  font-size: 12px;
  z-index: 2;
  border-radius: 0 0 8px 0px;
  height: 20px;
  padding: 6px;
  font-size: 12px;
  font-weight: 500;
  display: flex;
  align-items: center;
  text-align: center;
}
.listing-vertical .listing-top_portrait li .top-ten-image {
  position: absolute;
  bottom: 0%;
  left: 0%;
  width: auto;
  height: 130px;
  z-index: 2;
}
.listing-vertical .listing-top_portrait li .top-ten-image.img-hover {
  bottom: 20px;
}
.listing-vertical .listing-top_portrait li .top-ten-image img {
  width: 100%;
  height: 100%;
  position: relative;
}
.listing-vertical .listing-landscape li {
  width: 304px;
  height: 171px;
  margin-right: 16px;
  border-radius: 8px;
}
.listing-vertical .listing-landscape li .episode-free {
  border-radius: 0px 0px 8px 0px;
  padding: 6px;
  width: auto;
  right: 0px;
  bottom: 0px;
  font-size: 12px;
}
.listing-vertical .listing-landscape li.listing-square {
  width: 156px;
  height: 198px;
  margin-right: 20px;
}
.listing-vertical .listing-landscape li.listing-mid-banner-games {
  width: 420px;
  height: 173px;
  margin-right: 20px;
}
.listing-vertical .listing-landscape li.listing-mid-scroll-banner {
  width: 420px;
  height: 236px;
  margin-right: 20px;
  border-radius: 6px;
  z-index: unset;
}
.listing-vertical .listing-landscape li.listing-mid-scroll-banner img {
  width: 420px;
  height: 236px;
  border-radius: 6px;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing {
  width: 90px;
  height: 90px;
  margin-right: 20px;
  border-radius: 8px;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .genre-action-image {
  display: flex;
  justify-content: center;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .genre-action-image.image-handling img {
  max-width: 97px;
  max-height: 44px;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .genre-action-image img {
  max-width: 50px;
  max-height: 42px;
  position: absolute;
  top: 13px;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .genre-item-title {
  position: absolute;
  bottom: 9px;
  height: 20px;
  font-family: volte_medium;
  line-height: 1.25;
  letter-spacing: normal;
  color: #ffffff;
  font-size: 16px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 80%;
  font-family: "sky_reg";
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .genre-item-title.isGenre {
  font-size: 20px;
  width: 100%;
  overflow: unset;
  bottom: 13px;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .genre-item-title.isGenre h1 {
  font-size: 20px;
  width: 100%;
  overflow: unset;
  bottom: 13px;
}
.listing-vertical .listing-landscape li.browse-by-genre-listing .image-blend {
  background-color: rgba(0, 0, 0, 0.5);
  content: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==");
}
.listing-vertical .listing-landscape li.browse-by-lang-listing {
  width: 96px;
  height: 96px;
  margin-right: 20px;
  border-radius: 7px;
}
.listing-vertical .listing-landscape li.browse-by-lang-listing .lang-item-title {
  width: 72px;
  height: 16px;
  font-family: volte_medium;
  color: #ffffff;
  font-size: 13px;
  line-height: 15px;
  text-align: center;
  letter-spacing: 0.188173px;
  margin-top: 8px;
}
.listing-vertical .listing-landscape li.browse-by-lang-listing .image-blend {
  background-color: rgba(0, 0, 0, 0.5);
  content: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==");
}
.listing-vertical .listing-landscape li.browse-by-category-listing {
  width: 200px;
  height: 111px;
  left: 0px;
  top: 0px;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
  border-radius: 6px;
  margin-right: 20px;
}
.listing-vertical .listing-landscape li.browse-by-category-listing .genre-item-title {
  z-index: 9;
  position: absolute;
  bottom: 9px;
  height: 20px;
  font-family: volte_medium;
  line-height: 120%;
  color: #ffffff;
  font-size: 16px;
  left: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 80%;
  text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.7);
}
.listing-vertical .listing-landscape li.browse-by-category-listing::after {
  position: absolute;
  left: 0%;
  right: 0%;
  top: 42.34%;
  bottom: -0.9%;
  width: 200px;
  height: 58%;
  background: linear-gradient(180deg, rgba(2, 0, 5, 0) 19.32%, #220046 75.57%);
  border-radius: 0px 0px 6px 6px;
  content: "";
}
.listing-vertical .listing-landscape li.browse-by-category-listing .card-image {
  height: 100%;
  border-radius: 6px;
}
.listing-vertical .listing-landscape li.browse-by-category-listing.browse-by-sports::after {
  content: none;
  all: unset;
}
.listing-vertical .listing-landscape.large li {
  width: 368px;
  height: 207px;
}
.listing-vertical .listing-landscape.large li .card-image {
  height: 100%;
}
.listing-vertical .listing-landscape.large .slick-initialized .slick-slide {
  width: 384px !important;
}
.listing-vertical .listing-landscape.large .hover-popup .popover {
  margin-top: -210px;
}
.listing-vertical .listing-landscape.large .hover-popup .popover .image-top img {
  height: 207px;
}
.listing-vertical .listing-landscape .tvod-listing-item {
  height: 196px !important;
}
.listing-vertical .listing-live-rail li {
  width: 90px;
  height: 90px;
  margin-right: 20px;
  border-radius: 4px;
}
.listing-vertical .listing-circular li {
  box-shadow: none;
  width: 90px;
  height: 90px;
  margin-right: 24px;
  overflow: hidden;
  background-color: transparent;
}
.listing-vertical .listing-circular li.provider-listing {
  height: 90px;
  margin-right: 20px;
  border: 1px solid #564372;
  border-radius: 8px;
}
.listing-vertical .listing-circular li.provider-listing img {
  border-radius: unset;
}
.listing-vertical .listing-circular li.provider-listing:hover .place-holder-image,
.listing-vertical .listing-circular li.provider-listing:hover .broken-image {
  border: 1.5px solid #fff;
  border-radius: 50% !important;
  object-fit: none;
}
.listing-vertical .listing-circular li img {
  border-radius: 100%;
  height: 78%;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.25);
  background-color: transparent;
}
.listing-vertical .listing-circular li img.broken-image, .listing-vertical .listing-circular li img.place-holder-image {
  box-shadow: none !important;
  background-color: transparent !important;
  outline: none;
}
.listing-vertical .listing-circular li img.broken-image:focus, .listing-vertical .listing-circular li img.broken-image:hover, .listing-vertical .listing-circular li img.place-holder-image:focus, .listing-vertical .listing-circular li img.place-holder-image:hover {
  outline: none;
}
.listing-vertical .listing-circular li p {
  background: transparent;
  bottom: 0;
}
.listing-vertical .provider-logo {
  display: flex;
  align-items: center;
  padding-left: 2.8%;
}
.listing-vertical .provider-logo img {
  width: 35px;
  border-radius: 50%;
}
.listing-vertical .provider-logo .divider-title-section h2,
.listing-vertical .provider-logo .divider-title-section .see-all-link {
  padding-left: 1%;
}

.listing-horizontal {
  display: block;
  padding-left: 2.8%;
  position: relative;
  z-index: 3;
}
.listing-horizontal.provider-margin {
  margin-bottom: -33px;
}
.listing-horizontal.listing-small-landscape button.slick-arrow.slick-prev, .listing-horizontal.listing-small-landscape button.slick-arrow.slick-next {
  top: 50% !important;
}
.listing-horizontal.browse-by-language button.slick-arrow.slick-prev, .listing-horizontal.browse-by-language button.slick-arrow.slick-next {
  top: 42% !important;
}
.listing-horizontal.listing-portrait button.slick-arrow.slick-prev, .listing-horizontal.listing-portrait button.slick-arrow.slick-next {
  top: 46%;
}
.listing-horizontal.listing-top_portrait button.slick-arrow.slick-prev, .listing-horizontal.listing-top_portrait button.slick-arrow.slick-next, .listing-horizontal.listing-landscape button.slick-arrow.slick-prev, .listing-horizontal.listing-landscape button.slick-arrow.slick-next {
  top: 40%;
}
.listing-horizontal .slick-next {
  right: 2%;
  z-index: 2;
}
.listing-horizontal .slick-disabled {
  opacity: 0;
  cursor: default;
}
.listing-horizontal .slick-prev {
  left: 0%;
  z-index: 2;
}

.listing-vertical .listing-top-ten-games button.slick-arrow.slick-prev, .listing-vertical .listing-top-ten-games button.slick-arrow.slick-next {
  top: 40%;
}
.listing-vertical .listing-top-ten-games button.slick-arrow.slick-next {
  right: 35px;
}
.listing-vertical .listing-top-ten-games button.slick-arrow.slick-prev {
  left: 0%;
}

.listing-vertical .live-rail-title .divider-title-section .red-dot {
  border-radius: 50%;
  height: 5px;
  width: 5px;
  margin: 7px 0px 0 12px;
  background-color: #E56C6C;
}

.listing-vertical.promo-banner-rail .promo-banner-background {
  height: 340px;
  padding: 0 2.8%;
  position: relative;
  text-align: center;
  cursor: pointer;
}
.listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper img {
  height: 64px;
  width: auto;
}
.listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper p {
  font-family: "volte_reg";
  font-size: 48px;
  font-weight: 600;
  line-height: 58px;
  letter-spacing: 0px;
  text-align: center;
  color: #FFFFFF;
  white-space: pre-line;
}
.listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper .primary-btn {
  margin: 30px 0px 0px 0px;
  border-radius: 4px;
  font-family: "volte_reg";
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  letter-spacing: 0px;
  text-align: center;
  padding: 13px;
  height: 46px;
  border: none;
}
.listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper .prime_icon {
  height: 64px;
  width: 192px;
}
.listing-vertical.promo-banner-rail .promo-banner-background .background-image {
  height: 340px;
  width: 100%;
  background: linear-gradient(279.84deg, #8E81A1 -0.12%, #564372 19.16%, #220046 50.22%, #030106 99.48%);
}

.listing-vertical.game-rail {
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%);
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.6);
  height: 268px;
  padding-top: 18px;
}
.listing-vertical.game-rail .see-all-link::after {
  top: 6px;
}

.listing-vertical .listing-circular li img {
  width: 90px;
  height: 90px;
  position: absolute;
  background: #1d1e30;
}
.listing-vertical .listing-circular li img.placeholderImage {
  box-shadow: none !important;
}
.listing-vertical .listing-circular li img.subscribed {
  width: 28px;
  height: 28px;
  position: absolute;
  top: 62px;
  right: 0;
  z-index: 1;
}

.listing-top_portrait,
.listing-portrait img {
  width: 100%;
}

.listing-vertical .listing-horizontal.listing-top-ten-games {
  padding-left: 2.5%;
}
.listing-vertical .listing-horizontal.listing-top-ten-games .slick-initialized .slick-slide {
  width: 276px !important;
}

.listing-vertical .divider-title-section.remove-pointer-from-title span {
  cursor: unset !important;
}
.listing-vertical .listing-landscape.listing-browse-sports-rail li {
  width: 120px;
  height: 120px;
  margin-right: 16px;
  border-radius: 10.67px;
}
.listing-vertical .listing-landscape.listing-browse-sports-rail li:hover {
  border: 2px solid #FFFFFF;
  border-radius: 10.67px;
}
.listing-vertical .listing-landscape.listing-browse-sports-rail li img {
  width: 100%;
  height: 100%;
  border-radius: 10.67px;
}
@media only screen and (max-width: 480px) {
  .listing-vertical .listing-landscape.listing-browse-sports-rail li {
    width: 90px;
    height: 90px;
    margin-right: 8px;
    border-radius: 4px;
  }
  .listing-vertical .listing-landscape.listing-browse-sports-rail li:hover {
    border: unset;
    border-radius: unset;
  }
}

@media (min-width: 1300px) {
  .listing-horizontal.listing-top-ten-games {
    padding-left: 4.4%;
  }
  .listing-horizontal.listing-top-ten-games .slick-initialized .slick-slide {
    width: 230px !important;
  }
  .listing-horizontal.listing-landscape .slick-initialized .slick-slide {
    width: 320px !important;
  }
  .listing-horizontal.listing-landscape.seasons-block .slick-initialized .slick-slide, .listing-horizontal.listing-landscape.listing-background-banner .slick-initialized .slick-slide, .listing-horizontal.listing-landscape.listing-category-rail .slick-initialized .slick-slide {
    width: 220px !important;
  }
  .listing-horizontal.listing-landscape.listing-language .slick-initialized .slick-slide {
    width: 215px !important;
  }
  .listing-horizontal.listing-landscape.listing-small-landscape .slick-initialized .slick-slide {
    width: 110px !important;
  }
  .listing-horizontal.listing-landscape.listing-small-landscape.listing-genre .slick-initialized .slick-slide {
    width: 156px !important;
    margin: 0;
  }
  .listing-horizontal.listing-landscape.listing-square .slick-initialized .slick-slide {
    width: 176px !important;
  }
  .listing-horizontal.listing-landscape.listing-square.listing-mid-banner-games .slick-initialized .slick-slide {
    width: 440px !important;
  }
  .listing-horizontal.listing-landscape.listing-mid-scroll-banner .slick-initialized .slick-slide {
    width: 440px !important;
  }
  .listing-horizontal.listing-landscape.listing-browse-sports-rail .slick-initialized .slick-slide {
    width: 136px !important;
  }
  .listing-horizontal.listing-live-rail .slick-initialized .slick-slide {
    width: 110px !important;
  }
  .listing-horizontal.listing-top_portrait .slick-initialized .slick-slide {
    width: 309px !important;
  }
}
.listing-vertical.binge-top-games-rail {
  margin-bottom: 22px;
}

@media (min-width: 1350px) and (max-width: 1450px) {
  .listing-vertical h2 + .see-all-link.browse-by:before {
    width: 91%;
  }
}
@media (min-width: 1600px) {
  .listing-vertical h2 + .see-all-link.browse-by:before {
    width: 90.2%;
  }
}
@media (min-width: 1900px) {
  .listing-vertical h2 + .see-all-link.browse-by:before {
    width: 89.5%;
  }
}
@media only screen and (max-width: 480px) {
  .listing-container .slick-list .slick-track .slick-slide {
    opacity: 1;
  }
  .listing-container .listing-game-of-the-rail {
    margin: 0px;
  }
  .listing-container.language-nudge {
    top: 27px;
  }
  .listing-vertical.game-rail {
    height: 190px;
    padding-top: 0px;
  }
  .listing-vertical.game-rail .game-title {
    padding-top: 0px;
    margin-bottom: 11px;
  }
  .listing-vertical.game-rail .see-all-link::after {
    top: 11px;
  }
  .listing-horizontal.seasons-block {
    padding-left: 0;
  }
  .listing-horizontal.seasons-block .listing-block:first-child {
    padding-left: 2.8%;
  }
  .listing-horizontal,
  .swipe-wrapper {
    display: flex;
  }
  .horizontal-rail {
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    display: flex;
    scrollbar-width: none;
  }
  .horizontal-rail::-webkit-scrollbar {
    display: none;
  }
  .listing-vertical .slick-prev,
  .listing-circular .slick-prev {
    left: 16px;
    z-index: 1;
  }
  .listing-vertical .listing-circular li img {
    width: 64px;
    height: 64px;
  }
  .listing-vertical .listing-circular li img.subscribed {
    width: 18px;
    height: 18px;
    top: 45px;
    right: 0;
  }
  .listing-vertical .sports-rail-wrapper .sports-rail ul {
    margin-right: 14.1%;
    overflow: overlay;
  }
  .listing-vertical {
    margin-bottom: 5px;
  }
  .listing-vertical .seo-description-container {
    padding-bottom: 4px;
    margin-top: 1px;
  }
  .listing-vertical .seo-description-container p {
    font-size: 12px;
  }
  .listing-vertical .divider-title-section.game-top-ten-title {
    margin-bottom: 9px;
  }
  .listing-vertical:last-child {
    margin-bottom: 0;
  }
  .listing-vertical.binge-top-rail {
    bottom: 0;
    margin-top: 0;
  }
  .listing-vertical.background-banner-rail {
    margin-top: 16px;
  }
  .listing-vertical.special-banner-container {
    margin-top: 16px !important;
    margin-bottom: 25px;
  }
  .listing-vertical.promo-banner-rail .promo-banner-background {
    height: 120px;
    padding: 0;
  }
  .listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper img {
    height: 32px;
  }
  .listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper p {
    font-size: 16px;
    font-weight: 600;
    line-height: 26px;
    letter-spacing: 0px;
  }
  .listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper .primary-btn {
    margin: 10px 0px 0px 0px;
    font-size: 12px;
    font-weight: 600;
    line-height: 14px;
    letter-spacing: 0px;
    text-align: center;
    padding: 7px 12px;
    height: 26px;
  }
  .listing-vertical.promo-banner-rail .promo-banner-background .promo-text-wrapper .prime_icon {
    height: 96px;
    width: 32px;
  }
  .listing-vertical.promo-banner-rail .promo-banner-background .background-image {
    height: 120px;
  }
  .listing-vertical .provider-logo img {
    width: 21px;
  }
  .listing-vertical h2 {
    font-size: 16px;
    font-weight: 500;
    line-height: 16px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .listing-vertical .rail-title h2 {
    font-size: 16px;
    font-weight: 500;
    line-height: 16px;
  }
  .listing-vertical .see-all-link {
    font-size: 14px;
  }
  .listing-vertical .see-all-link.image-link:after {
    top: 6px;
  }
  .listing-vertical .see-all-link::after {
    background: url(/344c946809cfe83838e84e52ac0de0a7.png) no-repeat;
    top: 11px;
    left: 12px;
  }
  .listing-vertical .genre-container h2 {
    position: absolute;
    z-index: 4;
    padding: 0;
    top: 26%;
    left: -4px;
    width: 100px;
    text-align: center;
    font-size: 14px;
  }
  .listing-vertical .genre-container .divider-title-section {
    margin: 0;
  }
  .listing-vertical .genre-container .browse-by-genre-listing {
    height: 96px;
  }
  .listing-vertical .genre-container .browse-by-genre-listing img {
    height: 100%;
    width: 100%;
  }
  .listing-vertical .genre-container .reel-container {
    z-index: 9999;
    top: -1px;
    position: absolute;
    width: 161px;
  }
  .listing-vertical .genre-container .genre-wrapper {
    position: relative;
    width: 100%;
    height: 90px;
  }
  .listing-vertical .genre-container .genre-wrapper::before {
    content: "";
    width: 85px;
    height: 88px;
  }
  .listing-vertical .genre-container .genre-wrapper .reel-container {
    z-index: 9999;
    top: -1px;
    position: absolute;
    width: 161px;
  }
  .listing-vertical .genre-container .genre-wrapper .reel-tp-wrapper {
    height: inherit;
  }
  .listing-vertical .genre-container .genre-wrapper .reel-tp-wrapper img {
    height: 100%;
  }
  .listing-vertical .genre-container .genre-wrapper img {
    height: 100%;
  }
  .listing-vertical .genre-container .listing-landscape li .browse-by-genre-listing {
    width: 82px;
    height: 56px;
  }
  .listing-vertical .sports-rail-wrapper {
    position: relative;
    padding: 0 2.8%;
  }
  .listing-vertical .sports-rail-wrapper.genre-container {
    margin-left: 2.8%;
    padding: 0;
  }
  .listing-vertical .sports-rail-wrapper.genre-container .browse-by-genre-listing {
    width: 82px;
    height: 56px;
    border: 1px solid #8E81A1;
    border-radius: 8px;
  }
  .listing-vertical .sports-rail-wrapper.genre-container .genre-rail {
    position: absolute;
    top: 13px;
    padding-left: 67px;
    width: 100%;
  }
  .listing-vertical .sports-rail-wrapper.genre-container .listing-block:nth-child(1) {
    padding-left: 40px;
  }
  .listing-vertical .sports-rail-wrapper.genre-container .listing-horizontal {
    padding-left: 0%;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container {
    margin-left: 0;
    height: 215px;
    padding: 0;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .background-banner-revamp {
    width: 100%;
    z-index: unset;
    height: 155.49px;
    background: unset;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .background-banner-revamp::before {
    content: ".";
    position: absolute;
    left: 0%;
    width: 0%;
    height: 0%;
    background: #020005;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .background-banner-revamp .banner-shadow {
    right: unset;
    top: unset;
    width: 100%;
    height: 40%;
    bottom: -1px;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .background-banner-revamp .provider-image-wrapper {
    width: 32px;
    height: 32px;
    left: 10px;
    top: 10px;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail {
    padding-left: 0;
    top: unset;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal {
    padding-left: 10px;
    margin-right: 0;
    z-index: 2;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item {
    width: 164px;
    height: 94px;
    margin-right: 8px;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .crown-image {
    width: 16px !important;
    height: 16px !important;
    margin-top: 4px !important;
    margin-left: 6px !important;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .card-image {
    width: 164px;
    height: 94px;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .sports-rail-item .sports-duration-detail {
    font-size: 10px;
    margin: 4px 4px;
  }
  .listing-vertical .sports-rail-wrapper.banner-revamp-container .sports-rail .listing-horizontal .listing-item .sports-rail-item .sports-video-title {
    font-size: 10px;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail {
    margin-left: 0;
    padding: 0;
    height: 350px;
    background: rgb(42, 48, 53);
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card {
    color: white;
    width: 100%;
    height: 100%;
    font-family: volte_medium;
    position: absolute;
    z-index: 0;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-banner-title {
    font-size: 12px;
    margin-top: 0;
    max-width: 215px;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description {
    margin-left: 10px;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description .festive-description-title {
    font-size: 20px;
    line-height: 24px;
    -webkit-line-clamp: 1;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .festive-card-description .festive-description {
    font-size: 14px;
    line-height: 16.8px;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .special-image-wrapper {
    position: absolute;
    right: 16px;
    top: 36px;
    width: 112px;
    height: 112px;
    display: block;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .festive-card .special-image-wrapper .tree-image {
    bottom: 0px;
    height: 100%;
    width: 100%;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail {
    width: 100%;
    position: absolute;
    top: 44.1%;
    padding-left: 2.8%;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .special-rail-title {
    display: none;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal {
    padding-left: unset;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait .listing-item .card-image {
    height: 180px;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait li {
    width: 120px;
    height: 180px;
    margin-right: 8px;
  }
  .listing-vertical .sports-rail-wrapper.special-banner-rail .special-rail .listing-horizontal.listing-portrait li .crown-image {
    margin: 4px !important;
  }
  .listing-vertical .sports-rail-wrapper .sports-rail-background {
    height: 187px;
  }
  .listing-vertical .sports-rail-wrapper .sports-rail-background img {
    height: 187px;
    border-radius: 6px;
  }
  .listing-vertical .sports-rail-wrapper .sports-rail {
    bottom: 10px;
    padding-left: 8px;
  }
  .listing-vertical .sports-rail-wrapper .sports-rail .divider-title-section .sports-rail-header-image {
    height: 20px;
  }
  .listing-vertical .sports-rail-wrapper .sports-rail .divider-title-section .see-all-link {
    padding-right: 14%;
  }
  .listing-vertical .divider-title-section {
    margin-bottom: 7px;
  }
  .listing-vertical .divider-title-section .rail-image-title-wrapper .provider-wrapper {
    width: 40px;
    height: 40px;
  }
  .listing-vertical .divider-title-section .rail-image-title-wrapper .headings h2 {
    left: 0;
    line-height: 19.2px;
    font-size: 16px;
  }
  .listing-vertical .divider-title-section .rail-image-title-wrapper .headings .sub-heading {
    font-size: 9px;
    line-height: 10.8px;
  }
  .listing-vertical .divider-title-section .trending-img {
    height: 20px;
    width: 20px;
  }
  .listing-vertical .game-title {
    margin-bottom: 11px;
    padding-top: 7px;
  }
  .listing-vertical .live-rail-title .divider-title-section {
    margin-bottom: 16px;
  }
  .listing-vertical .live-rail-title .divider-title-section .rail-title .rail-clickable-Title {
    left: 0%;
  }
  .listing-vertical .live-rail-title .divider-title-section .red-dot {
    margin: 7px 0 0 4px;
  }
  .listing-vertical .live-rail-title .divider-title-section .trending-img {
    margin-right: 7px;
    margin-bottom: -3px;
    height: 20px;
    width: 20px;
  }
  .listing-vertical .live-rail-title .divider-title-section .see-all-link::after {
    top: 11px;
  }
  .listing-vertical .listing-portrait.medium li {
    width: 158px;
    height: 237px;
  }
  .listing-vertical .listing-portrait.large li {
    width: 218px;
    height: 327px;
  }
  .listing-vertical .listing-portrait li {
    width: 120px;
    height: 180px;
    margin-right: 8px;
  }
  .listing-vertical .listing-portrait li .card-image {
    border-radius: 6px !important;
  }
  .listing-vertical .listing-portrait li .episode-free {
    font-size: 10px;
    padding: 4px;
    border-radius: unset;
    border-bottom-right-radius: 6px;
    width: auto;
  }
  .listing-vertical .listing-portrait img.freemium-image {
    width: 24px;
    height: 24px;
    bottom: 20px;
    margin: 0 0 6px 6px;
  }
  .listing-vertical .listing-top_portrait li {
    margin-right: 8px;
    width: 206px;
    height: 251px;
  }
  .listing-vertical .listing-top_portrait li div:nth-child(1) {
    width: 76.7%;
    position: relative;
    height: 94.43%;
    right: -23%;
    border-radius: 6px;
  }
  .listing-vertical .listing-top_portrait li div:nth-child(1) .card-image {
    width: 100%;
    height: 100%;
    border-radius: 6px;
  }
  .listing-vertical .listing-top_portrait li .top-portrait-episode-free {
    width: 40%;
    bottom: 14px;
    left: 60%;
    z-index: 2;
    font-size: 10px;
    border-radius: 0 0 6px 0px;
    padding: 4px;
  }
  .listing-vertical .listing-top_portrait li .top-ten-image {
    height: 80px;
  }
  .listing-vertical .listing-top_portrait li .top-ten-image img {
    width: auto;
    height: 100%;
    display: block;
    max-width: none;
  }
  .listing-vertical .listing-landscape.large li {
    width: 256px;
    height: 144px;
  }
  .listing-vertical .listing-landscape li {
    height: 108px;
    width: 192px;
    margin-right: 8px;
    border-radius: 6px;
  }
  .listing-vertical .listing-landscape li .episode-free {
    padding: 4px;
    font-size: 10px;
    border-radius: 0px 0px 6px 0px;
  }
  .listing-vertical .listing-landscape li.listing-square {
    height: 120px;
    width: 120px;
    margin-right: 8px;
    border-radius: 0;
  }
  .listing-vertical .listing-landscape li.listing-mid-banner-games {
    height: 150px;
    width: 310px;
    margin-top: 20px;
  }
  .listing-vertical .listing-landscape li.listing-mid-scroll-banner {
    height: 175px;
    width: 310px;
    margin-top: 20px;
  }
  .listing-vertical .listing-landscape li.listing-mid-scroll-banner img {
    height: 100%;
    width: 100%;
  }
  .listing-vertical .listing-landscape li.browse-by-genre-listing {
    width: 64px;
    height: 64px;
    margin-right: 6px;
    margin-top: 4px;
    border-radius: 11px;
  }
  .listing-vertical .listing-landscape li.browse-by-genre-listing .genre-action-image.image-handling img {
    max-width: 58px;
    max-height: 26px;
  }
  .listing-vertical .listing-landscape li.browse-by-genre-listing .genre-action-image img {
    max-width: 35px;
    max-height: 26px;
    position: absolute;
    top: 6.5px;
  }
  .listing-vertical .listing-landscape li.browse-by-genre-listing .genre-item-title {
    bottom: 0;
    font-size: 11px;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 56px;
    overflow: hidden;
  }
  .listing-vertical .listing-landscape li.browse-by-genre-listing .genre-item-title.isGenre {
    bottom: -2px;
    font-size: 12px;
  }
  .listing-vertical .listing-landscape li.browse-by-genre-listing .genre-item-title.isGenre h1 {
    bottom: -2px;
    font-size: 12px;
  }
  .listing-vertical .listing-landscape li.browse-by-lang-listing {
    width: 88px;
    height: 88px;
    margin-right: 8px;
    margin-top: 4px;
  }
  .listing-vertical .listing-landscape li.browse-by-lang-listing .lang-item-title {
    width: 64px;
    height: 12px;
    bottom: 2px;
    font-size: 12px;
    margin-top: 4px;
    font-family: volte_reg;
  }
  .listing-vertical .listing-landscape li.browse-by-category-listing {
    width: 100px;
    height: 56px;
    left: 0px;
    top: 0px;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2));
    border-radius: 6px;
    margin-right: 8px;
  }
  .listing-vertical .listing-landscape li.browse-by-category-listing .genre-item-title {
    left: 6%;
    right: 17%;
    top: 71.43%;
    bottom: 3.57%;
    font-size: 12px;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 77px;
    overflow: hidden;
  }
  .listing-vertical .listing-landscape li.browse-by-category-listing::after {
    position: absolute;
    left: 0%;
    right: 0%;
    top: 46.43%;
    bottom: 0%;
    width: 100px;
    height: 53.8%;
    background: linear-gradient(180deg, rgba(2, 0, 5, 0) 5.68%, #220046 67.05%);
    border-radius: 0px 0px 6px 6px;
    content: "";
  }
  .listing-vertical .listing-landscape.mid-scroll-center {
    justify-content: center;
    padding-left: 0;
  }
  .listing-vertical .listing-live-rail li {
    width: 64px;
    height: 64px;
    margin-right: 6px;
    border-radius: 4px;
  }
  .listing-vertical .listing-top-ten-games .listing-double-number {
    width: 188px;
  }
  .listing-vertical .listing-top-ten-games li {
    width: 164px;
    height: 113px;
  }
  .listing-vertical .listing-top-ten-games li .card-image {
    width: 96.17px;
    height: 96.17px;
    right: 30px;
    border-radius: 9.617px;
  }
  .listing-vertical .listing-top-ten-games li .games-favorite {
    width: 22px;
    height: 22px;
    bottom: 21px;
    right: 14px;
  }
  .listing-vertical .listing-top-ten-games li .top-ten-image img {
    width: 50px;
    height: 64px;
    bottom: 25px;
  }
  .listing-vertical .listing-top-ten-games li .top-ten-image img.double-number-image {
    width: 92px !important;
  }
  .listing-vertical .listing-circular li {
    width: 64px;
    height: 64px;
    margin-right: 7px;
  }
  .listing-vertical .listing-circular li.provider-listing {
    height: 64px;
    margin-right: 8px;
  }
  .listing-vertical.series-banner-container {
    margin-top: 16px;
  }
  .listing-vertical.series-banner-container .special-series-main-title {
    width: 100%;
    color: #eeeeff;
    padding-left: 2.8%;
    margin-bottom: 12px;
    font-family: volte_medium;
    font-size: 16px;
    line-height: 16.8px;
  }
  .listing-vertical.series-banner-container .series-banner-rail {
    height: 215px;
    padding: 0;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner {
    width: 100%;
    height: 100%;
    background: #000;
    z-index: unset;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner img {
    width: 100%;
    height: 100%;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner .provider-image-wrapper {
    width: 20px;
    height: 20px;
    position: absolute;
    top: 10px;
    left: 10px;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail-banner .banner-shadow {
    right: unset;
    top: unset;
    bottom: 0;
    width: 100%;
    height: 69.76%;
    background: linear-gradient(180deg, rgba(2, 0, 5, 0) 0%, #020005 50%);
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail {
    top: unset;
    bottom: 5px;
    padding-left: unset;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .divider-title-section.series-rail-title {
    display: none;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal {
    padding-left: 10px;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info {
    height: 24px;
    padding: 4px 6px 4px 6px;
    font-size: 12px;
    font-weight: 500;
    backdrop-filter: blur(64px);
    line-height: 14.4px;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info .play {
    width: 16px;
    height: 16px;
    margin-right: 4px;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info .play img {
    width: 100%;
    height: 100%;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .special-series-title-info .special-series-title {
    padding-top: 3px;
  }
  .listing-vertical.series-banner-container .series-banner-rail .series-special-rail .listing-horizontal .listing-item .card-provider-logo {
    display: none;
  }
}
@media only screen and (max-width: 620px) {
  .listing-vertical h2 + .see-all-link:before {
    width: 78%;
  }
  .no-bottom-container:last-child {
    margin-bottom: 0;
  }
}
.slick-track {
  width: max-content !important;
}

@media only screen and (max-width: 768px) {
  .category-page-listing {
    top: 2em;
  }
}
@media only screen and (min-width: 481px) and (max-width: 768px) {
  .listing-vertical h2 {
    font-size: 18px;
  }
  .listing-vertical .rail-title h2 {
    font-size: 18px;
  }
}
.rail-title-block {
  display: flex;
}
.rail-title-block .rail-title-microinteractions {
  width: 24px;
  height: 24px;
}
.rail-title-block .rail-title-span {
  margin-left: 8px;
}
@media only screen and (max-width: 480px) {
  .rail-title-block .rail-title-microinteractions {
    width: 18px;
    height: 18px;
  }
  .rail-title-block .rail-title-span {
    padding-top: 3px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.language-container {
  padding: 4px;
  position: relative;
  top: 1em;
  margin-bottom: 38px;
}
.language-container .lang-sub-container {
  margin: 0 auto;
  width: 640px;
  height: 68px;
  text-align: center;
  padding: 10px 27px 15px 29px;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%);
  border: 1px solid #220046;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
}
.language-container .lang-sub-container .lang-message {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  color: #ffffff;
  text-shadow: 0px 3px 10px rgb(0, 0, 0.8);
  position: relative;
  text-align: center;
}
.language-container .lang-sub-container .lang-message .lang-text {
  position: absolute;
  width: 300px;
  bottom: -22px;
  left: 2px;
}
.language-container .lang-sub-container .lang-message span {
  display: flex;
}
.language-container .lang-sub-container .lang-message .text-box-image {
  position: absolute;
  bottom: -34px;
  right: -86px;
  width: 111px;
  height: 85px;
}
.language-container .lang-sub-container .lang-message .hindi-letter-image {
  position: absolute;
  bottom: 11px;
  left: 45px;
}
.language-container .lang-sub-container .lang-message .english-letter-image {
  position: absolute;
  bottom: 4px;
  left: 23px;
}
.language-container .lang-sub-container .cross-icon {
  width: 16px;
  height: 16px;
  margin-right: 10px;
  margin-left: 10px;
  cursor: pointer;
}
.language-container .lang-sub-container .lang-cross-icon-wrapper {
  display: flex;
}
.language-container .lang-sub-container .select-language {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.language-container .lang-sub-container .select-language span {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 120%;
  text-align: right;
  color: #f3cbe3;
  position: relative;
  top: 4px;
}
.language-container .lang-sub-container .select-language img {
  margin-left: 7px;
}
@media only screen and (max-width: 700px) {
  .language-container .lang-sub-container {
    width: 90%;
  }
  .language-container .lang-sub-container .lang-message {
    font-size: 16px;
  }
  .language-container .lang-sub-container .lang-message .lang-text {
    width: 240px;
  }
  .language-container .lang-sub-container .select-language span {
    font-size: 16px;
  }
}
@media only screen and (max-width: 480px) {
  .language-container {
    margin-bottom: 26px;
  }
  .language-container .lang-sub-container {
    height: 47px;
    padding: 8px 10px 9px 21px;
  }
  .language-container .lang-sub-container .lang-message {
    font-size: 12px;
    line-height: 15px;
  }
  .language-container .lang-sub-container .lang-message .text-box-image {
    bottom: -24px;
    right: -57px;
    width: 75px;
    height: 58px;
  }
  .language-container .lang-sub-container .lang-message .hindi-letter-image {
    bottom: 13px;
    left: 31px;
    width: 15px;
  }
  .language-container .lang-sub-container .lang-message .english-letter-image {
    bottom: 8px;
    width: 17px;
    left: 18px;
  }
  .language-container .lang-sub-container .lang-message .lang-text {
    width: 200px;
    bottom: -14px;
  }
  .language-container .lang-sub-container .select-language span {
    font-size: 12px;
    top: 0;
  }
  .language-container .lang-sub-container .cross-icon {
    display: none;
  }
}
@media only screen and (max-width: 390px) {
  .language-container .lang-sub-container .lang-message {
    font-size: 10px;
  }
  .language-container .lang-sub-container .lang-message .lang-text {
    width: 200px;
  }
  .language-container .lang-sub-container .select-language span {
    font-size: 10px;
  }
}
@media only screen and (max-width: 320px) {
  .language-container .lang-sub-container .lang-message {
    font-size: 10px;
  }
  .language-container .lang-sub-container .lang-message .lang-text {
    width: 155px;
  }
  .language-container .lang-sub-container .select-language span {
    font-size: 10px;
  }
}
@media only screen and (max-width: 280px) {
  .language-container .lang-sub-container .lang-message {
    font-size: 10px;
  }
  .language-container .lang-sub-container .lang-message .lang-text {
    width: 130px;
  }
  .language-container .lang-sub-container .select-language span {
    font-size: 10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.game-of-the-week-rail {
  width: 360px;
  height: 175px;
  display: flex;
  background: linear-gradient(146.32deg, #020005 0%, #220046 87.9%);
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.6);
  border-radius: 6px;
  align-items: center;
  margin-right: 20px;
}
.game-of-the-week-rail .card-container {
  padding: 0 18px 0 20px;
}
.game-of-the-week-rail .card-container img {
  width: 162px;
  height: 92px;
  border-radius: 12px;
}
.game-of-the-week-rail .game-detail-container {
  color: #ffffff;
  font-size: 14px;
  font-family: volte_medium;
  text-align: right;
  margin-right: 19px;
}
.game-of-the-week-rail .game-detail-container .head-title {
  font-size: 16px;
  background: linear-gradient(270deg, #FFA800 0%, #FFF389 45.31%, #FFA800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  padding-bottom: 12px;
  font-family: volte_semiBold;
  font-weight: 600;
}
.game-of-the-week-rail .game-detail-container .game-title {
  padding-bottom: 4px;
  font-family: volte_semiBold;
  font-weight: 600;
}
.game-of-the-week-rail .game-detail-container .btn.primary-btn {
  font-size: 12px;
  padding: 8.15135px 32px;
  margin-top: 12px;
  margin-right: 0;
}
.game-of-the-week-rail .game-detail-container .primary-btn:hover {
  color: unset;
  border: 2px solid #e10092;
  transition: 0ms;
}

.newly-added-game-rail {
  width: 817px;
  height: 175px;
  display: flex;
  background: linear-gradient(34.16deg, #020005 0%, #220046 100%);
  border-radius: 6px;
  align-items: end;
  position: relative;
}
.newly-added-game-rail .newly-rail-title {
  position: absolute;
  font-weight: 600;
  font-size: 14px;
  line-height: 14px;
  color: #ffffff;
  font-family: volte_semiBold;
  left: 5.5%;
  top: 5.8%;
}
.newly-added-game-rail .newly-added-game-container:nth-child(2) {
  margin-left: 40px;
}
.newly-added-game-rail .newly-added-game-container {
  margin-right: 20px;
}
.newly-added-game-rail .newly-added-game-container .newly-card-container {
  cursor: pointer;
}
.newly-added-game-rail .newly-added-game-container .newly-card-container img {
  width: 175px;
  height: 100px;
  border-radius: 12px;
}
.newly-added-game-rail .newly-added-game-container .newly-card-container .newly-content-title {
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: #ffffff;
  margin-top: 12px;
  text-align: center;
  margin-bottom: 8px;
}

@media screen and (max-width: 1176px) {
  .newly-added-game-rail {
    width: 620px;
  }
  .newly-added-game-rail .newly-added-game-container:nth-child(2) {
    margin-left: 25px;
  }
}
@media screen and (max-width: 480px) {
  .game-of-the-week-rail {
    height: 136px;
    margin-bottom: 18px;
    margin-top: 20px;
    margin-right: 0px;
    width: 100%;
    justify-content: center;
  }
  .game-of-the-week-rail .card-container {
    padding: 0;
    margin-right: 18px;
  }
  .game-of-the-week-rail .card-container img {
    width: 170px;
  }
  .game-of-the-week-rail .game-detail-container {
    margin: 0;
  }
  .newly-added-game-rail {
    width: 100%;
    height: 155px;
    margin-bottom: 15px;
    justify-content: space-evenly;
  }
  .newly-added-game-rail .newly-rail-title {
    left: 9%;
  }
  .newly-added-game-rail .newly-added-game-container:nth-child(2) {
    margin-left: 0px;
  }
  .newly-added-game-rail .newly-added-game-container {
    margin-right: 0px;
  }
  .newly-added-game-rail .newly-added-game-container .newly-card-container img {
    width: 158px;
    height: 90px;
  }
  .newly-added-game-rail .newly-added-game-container .newly-card-container .newly-content-title {
    font-size: 12px;
    line-height: 12px;
    margin-top: 4px;
    margin-bottom: 14px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.seeall-content {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  margin-bottom: 33px;
  padding: 0;
  width: 100%;
}
.seeall-content .seo-description-container {
  width: 100%;
  padding-top: 0px;
  padding-bottom: 0px;
}
.seeall-content .seo-description-container.footer {
  margin-top: 20px;
  margin-bottom: 36PX;
}
.seeall-content .home-faq-container {
  width: 100%;
}
.seeall-content .home-faq-container .horizontal-line {
  margin-bottom: 30px;
}
.seeall-content .scroll-loader {
  display: block;
}
.seeall-content .container-top .grid-view .listing-block {
  display: inline-flex;
}
.seeall-content h1 {
  width: 94.3%;
  margin: auto;
  font-family: sky_med;
  margin-bottom: 7px;
  font-size: 22px;
  line-height: 120%;
  color: #eeeeff;
}
.seeall-content h1.isGamesHeader {
  font-family: volte_medium;
  font-size: 26px;
}
@media only screen and (max-width: 480px) {
  .seeall-content h1.isGamesHeader {
    font-size: 19px;
  }
}
.seeall-content h1 .seo-provider-railtitle {
  display: none;
}
@media only screen and (max-width: 480px) {
  .seeall-content h1 {
    font-size: 16px;
    line-height: 110%;
    color: #ffffff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
@media only screen and (min-width: 481px) and (max-width: 768px) {
  .seeall-content h1 {
    font-size: 18px;
  }
}
.seeall-content .divider {
  width: 100%;
}
.seeall-content .divider:before {
  content: "";
  background-image: url(/3029262e45fd04fb6e331202130bb484.png);
  height: 2px;
  background-size: cover;
  display: inline-block;
  width: 97%;
  margin-right: 8px;
}
.seeall-content .set-hover-seeall {
  margin-top: 0px;
}
.seeall-content .news-filter {
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: 2.8%;
  overflow: hidden;
  white-space: nowrap;
  -ms-overflow-style: none;
  /* IE and Edge */
  scrollbar-width: none;
  width: 100%;
  /* Firefox */
}
.seeall-content .news-filter::-webkit-scrollbar {
  display: none;
}
.seeall-content .news-filter li {
  cursor: pointer;
  display: inline-block;
  padding: 9px 18px;
  border-radius: 55px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.11), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  font-size: 22px;
  color: #f3cbe3;
  line-height: 1.29;
  margin-right: 10px;
  border: 1px solid #f3cbe3;
  font-weight: 400;
  font-family: volte_reg;
  position: relative;
}
.seeall-content .news-filter li.active {
  background-color: #e5007d;
  border: 1px solid #e5007d;
}
.seeall-content .news-filter li.active:hover {
  color: #ffffff;
  border: 1px solid #ffffff;
}
.seeall-content .news-filter li.active span {
  padding-left: 10px;
  position: relative;
  top: 1.2px;
}
.seeall-content .news-filter li.active span i {
  position: unset;
  font-size: 17px;
  border: none;
  border-radius: unset;
  background-color: unset;
}
.seeall-content .news-filter i {
  position: absolute;
  width: 34px;
  height: 34px;
  border: solid 1px #ffffff;
  background-color: #e10092;
  border-radius: 100%;
  cursor: pointer;
  z-index: 3;
}
.seeall-content .news-filter i::after {
  color: #ffffff;
  top: 7px;
  display: inline-block;
  position: relative;
  left: 11px;
}
.seeall-content .news-filter .right-icon {
  margin-top: 6px;
  right: 2.8%;
}
.seeall-content .news-filter .left-icon {
  margin-top: 6px;
  left: 2.8%;
}
.seeall-content .news-filter .right-icon::after {
  content: ">";
}
.seeall-content .news-filter .left-icon::after {
  content: "<";
}
.seeall-content .seeall {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  top: 0;
  width: 100%;
  padding: 0px;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv {
  width: 100%;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
  grid-template-columns: repeat(5, 1fr);
  grid-gap: 30px 69.35px;
  margin: 10px 0;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component span:last-child .listing-item {
  overflow: unset;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  aspect-ratio: 1/1.193;
  display: block;
  padding: 0 !important;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block li:nth-child(10) {
  overflow: unset;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  margin: 0;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item div:nth-child(1) {
  width: 74.87%;
  display: flex;
  position: relative;
  height: 100%;
  z-index: 2;
  border-radius: 8px;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-provider-logo {
  position: absolute;
  right: 0%;
  top: 0%;
  width: 28px;
  height: 28px;
  margin: 8px;
  border-radius: 2px;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .top-portrait-episode-free {
  width: 47%;
  z-index: 2;
  bottom: 5.8%;
  left: 53%;
  font-size: 12px;
  border-radius: 0px 0px 8px 0px;
  height: 20px;
  padding: 6px;
  font-weight: 500;
  display: flex;
  align-items: center;
  text-align: center;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  margin: 0;
  height: 94.13%;
  width: 100%;
  border-radius: 8px !important;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image {
  position: absolute;
  bottom: 0;
  z-index: 2;
  width: auto;
  left: 0%;
  height: 50.36%;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image.img-hover {
  bottom: 10%;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image img {
  width: 100%;
  height: 100%;
  position: relative;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover {
  width: 75%;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover {
  width: 100% !important;
  border-radius: 6px;
  padding-bottom: 15px;
  bottom: -22px;
  margin-right: 0;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .listing-top_portrait_info-section {
  padding: 7px 10px 12px 10px;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .listing-top_portrait_info-section .info-header {
  font-size: 16px;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .listing-top_portrait_info-section .info-header h4 {
  font-size: inherit;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .listing-top_portrait_info-section .listing-top_portrait_footer_section .textBlock {
  font-size: inherit;
}
.seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .listing-top_portrait_info-section .listing-top_portrait_footer_section .movieButtonContainer i {
  font-size: inherit;
}
.seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
  grid-template-columns: repeat(7, 1fr);
  padding-top: 10px;
}
.seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  padding: 0 !important;
}
.seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item div:nth-child(1) {
  height: 100%;
}
.seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item div:nth-child(1) .card-image {
  height: 100%;
}
.seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover {
  margin-left: 10px;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv {
  width: 100%;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component {
  grid-template-columns: repeat(4, 1fr);
  grid-gap: 40px 140px;
  margin: 10px 0;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component span:last-child .listing-item {
  overflow: unset;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component span:first-child .listing-item .top-ten-image {
  left: 3%;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  aspect-ratio: 1/0.86;
  display: block;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block li:nth-child(10) {
  overflow: unset;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: flex-end;
  margin: 0;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item div:nth-child(1) {
  width: 67%;
  display: flex;
  position: relative;
  height: 100%;
  z-index: 2;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  margin: 0;
  height: 78%;
  width: 100%;
  border-radius: 20.893px;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .games-favorite {
  width: 19%;
  height: 15%;
  right: -8px;
  bottom: 25%;
  position: absolute;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .game-detail {
  position: absolute;
  top: 75%;
  color: #ffffff;
  font-weight: 500;
  line-height: 21px;
  font-family: volte_reg;
  color: #FFF;
  font-style: normal;
  font-size: 20px;
  width: 67%;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .game-detail .game-detail-title {
  display: -webkit-box !important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  width: 100% !important;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image {
  position: absolute;
  bottom: 26%;
  z-index: 1;
  width: 36%;
  left: 5%;
  height: 52%;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image img {
  width: 100% !important;
  height: 100% !important;
  position: relative !important;
  left: 0 !important;
  bottom: 0 !important;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image.ten-img {
  width: auto;
  height: 52%;
  left: -20.5%;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image.ten-img.double-number-image {
  width: 100% !important;
}
.seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image.ten-img img {
  width: 100% !important;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv {
  width: 100%;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component {
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-gap: 20px 30px;
  margin: 10px 0;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  padding: 0 !important;
  display: block;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  display: block;
  margin: 0;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  margin: 0;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games {
  width: 100%;
  height: 100%;
  position: initial;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .listing-double-number {
  width: 250px;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .card-image {
  width: 40.3%;
  height: 40.3%;
  right: 0;
  z-index: 2;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .games-favorite {
  width: 30px;
  height: 30px;
  z-index: 3;
  right: 35px;
  position: relative;
  bottom: 8px;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .top-ten-image img {
  bottom: 17.5%;
  width: 21.6%;
  height: 57.2%;
  position: absolute;
  left: -16%;
  border-radius: 0px;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .game-detail {
  margin-top: 9.3px;
}
.seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .game-detail .game-detail-title {
  color: #ffffff;
  font-family: volte_reg;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
  grid-template-columns: repeat(13, 1fr);
}
.seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  padding-bottom: 100%;
}
.seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  height: 100%;
  border-radius: 6px;
}
.seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .hover-popup.overlap-hover {
  width: 100%;
}
.seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .hover-popup.overlap-hover .popover.binge-channel-square-hover {
  margin-left: -14px;
  width: 120px;
  height: 120px;
  border-radius: 6px;
  background: #FFF;
}
.seeall-content .seeall.live-see-all .crown-image {
  height: 24px;
  width: 24px;
  position: absolute;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv {
  width: 100%;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 20px;
  width: 100%;
  padding: 0 2.8% 0 2.8%;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  display: block;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
  display: block;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  height: 78%;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover {
  width: 110%;
  height: 100%;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover {
  width: 100%;
  margin-left: 11.5px;
  height: fit-content;
  padding-bottom: 5px;
}
.seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover .image-top img {
  height: 100%;
}
.seeall-content .seeall li .subscribed {
  width: 26px;
  height: 26px;
  position: absolute;
  right: 9px;
  top: 8px;
  z-index: 1;
}
.seeall-content .seeall.listing-landscape li, .seeall-content .seeall.listing-landscape.card-image, .seeall-content .seeall.listing-landscape.place-holder-image {
  width: 200px;
  height: auto;
  margin-right: 20px;
  margin-bottom: 20px;
  padding-bottom: 55%;
  border-radius: 8px;
}
.seeall-content .seeall.listing-landscape li .card-image,
.seeall-content .seeall.listing-landscape li .place-holder-image, .seeall-content .seeall.listing-landscape.card-image .card-image,
.seeall-content .seeall.listing-landscape.card-image .place-holder-image, .seeall-content .seeall.listing-landscape.place-holder-image .card-image,
.seeall-content .seeall.listing-landscape.place-holder-image .place-holder-image {
  width: 100%;
  height: 100%;
  display: inline-block;
  transform: translateZ(0);
  border-radius: 6px;
}
.seeall-content .seeall.listing-landscape .episode-free {
  border-radius: 0px 0px 8px 0px;
  padding: 6px;
  width: auto;
  right: 0px;
  bottom: 0px;
  font-size: 12px;
}
.seeall-content .seeall.listing-landscape .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
  height: 100%;
}
.seeall-content .seeall.listing-landscape .tvod-listing-item {
  height: 196px !important;
}
.seeall-content .seeall.listing-circular li {
  width: 215px;
  height: 215px;
  margin-right: 20px;
  margin-bottom: 10px;
}
.seeall-content .seeall.listing-circular .item-detail {
  display: none;
}
.seeall-content .seeall.listing-circular .tvod-listing-item {
  height: 196px !important;
}
@media (max-width: 480px) {
  .seeall-content .seeall.listing-circular li {
    width: 47%;
    margin-right: 10px;
    height: 170px;
  }
}
.seeall-content .seeall.listing-portrait {
  margin-bottom: 21px;
}
.seeall-content .seeall.listing-portrait li {
  width: 200px;
  height: auto;
  margin-right: 20px;
  margin-bottom: 18px;
}
.seeall-content .seeall.listing-portrait li .card-image,
.seeall-content .seeall.listing-portrait li .place-holder-image {
  width: 100%;
  height: 75%;
  display: inline-block;
  transform: translateZ(0);
  position: relative;
}
.seeall-content .seeall.listing-portrait .tvod-listing-item {
  height: 319px !important;
}
.seeall-content .seeall.listing-square li {
  width: 176px;
  height: auto;
  margin-bottom: 30px;
  margin-right: 20px;
}
.seeall-content .seeall.listing-square li img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  margin-right: 20px;
  position: relative;
}
@media only screen and (max-width: 480px) {
  .seeall-content .seeall.listing-square li {
    margin-bottom: 20px;
  }
  .seeall-content .seeall.listing-square li img {
    margin-right: 16px;
  }
}
.seeall-content .seeall.listing-square li .game-detail {
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  line-height: 19.8px;
  font-family: volte_reg;
  width: 156px;
}
.seeall-content .seeall.listing-square li .game-detail .game-detail-title {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.seeall-content .seeall.listing-square li .game-detail .play-count {
  font-weight: 500;
  font-size: 12px;
  line-height: 15px;
  color: #8e81a1;
}
.seeall-content .seeall.listing-square li .games-favorite {
  width: 30px;
  height: 30px;
  right: -8px;
  bottom: 48px;
  position: absolute;
}
@media only screen and (max-width: 480px) {
  .seeall-content .seeall.listing-square li .games-favorite {
    width: 22px;
    height: 22px;
    bottom: 34px;
  }
  .seeall-content .seeall.listing-square li .game-detail {
    bottom: -3px;
    font-size: 12px;
    font-weight: 500;
    line-height: 12px;
    width: 120px;
  }
  .seeall-content .seeall.listing-square li .game-detail .play-count {
    font-weight: 500;
    font-size: 9px;
    line-height: 9px;
    position: relative;
    top: 1px;
  }
}
.seeall-content .load-more {
  width: 100%;
  margin-top: 20px;
}
.seeall-content .app-view {
  width: 100%;
  margin-top: 20px;
}
.seeall-content .app-view .seeall.listing-circular li {
  margin: 7px 20px 13px 0;
}
.seeall-content .app-view.no-subscribers div {
  color: #bec1d9;
  margin-top: 20px;
  text-align: center;
}
.seeall-content .app-view h4 {
  font-size: 20px;
}
.seeall-content .grid-view .listing-block {
  display: inline-flex;
  position: relative;
}
.seeall-content .listing-landscape .listing-block {
  position: relative;
}
.seeall-content .listing-block {
  text-align: inherit;
  color: inherit;
  line-height: inherit;
}
@media only screen and (max-width: 480px) {
  .seeall-content {
    top: 8px;
    padding: 0 1% 19px 6.9%;
  }
  .seeall-content .app-view .seeall .listing-circular li {
    margin: 7px 7px 5px 0;
  }
  .seeall-content .seeall.listing-circular li {
    width: 110px;
    height: 110px;
  }
  .seeall-content .seeall.listing-circular li .subscribed {
    width: 18px;
    height: 18px;
    right: 6px;
    top: 6px;
  }
  .seeall-content .seeall.listing-landscape li, .seeall-content .seeall.listing-landscape.card-image, .seeall-content .seeall.listing-landscape.place-holder-image {
    height: auto;
    margin-right: 7px;
    margin-bottom: 20px;
    padding-bottom: 56.7%;
  }
  .seeall-content .seeall.listing-top_portrait {
    margin-bottom: -5px;
  }
  .seeall-content .seeall.listing-top_portrait li {
    height: auto;
    margin-right: 7px;
    margin-bottom: 20px;
  }
  .seeall-content .seeall.listing-portrait {
    margin-bottom: -5px;
    padding-bottom: 15%;
  }
  .seeall-content .seeall.listing-portrait li {
    height: auto;
    margin-right: 7px;
    margin-bottom: 20px;
  }
  .seeall-content .seeall.listing-square li {
    height: auto;
    margin-right: 7px;
    margin-bottom: 20px;
  }
}

.fav-seeall-content {
  padding: 0;
}
.fav-seeall-content .seeall {
  margin-top: 30px;
}
.fav-seeall-content .banner-on-header {
  width: 100%;
}
.fav-seeall-content .favorite-banner {
  position: relative;
  height: 294px;
}
.fav-seeall-content .favorite-banner .favorite-img {
  position: absolute;
  width: 100%;
  min-height: 294px;
  right: 0;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
}
.fav-seeall-content .favorite-banner .favorite-img img {
  width: 100%;
  height: 294px;
  object-fit: fill;
}
.fav-seeall-content .favorite-banner .set-favourite-text {
  width: 100%;
  padding-left: 2.8%;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 2;
  bottom: 0;
}
.fav-seeall-content .favorite-banner .set-favourite-text h1 {
  font-size: 26px;
  font-family: volte_medium;
  color: #ffffff;
  margin: 0;
}
@media only screen and (max-width: 480px) {
  .fav-seeall-content {
    top: -51px;
    padding: 0;
  }
  .fav-seeall-content .seeall {
    margin-top: 18px;
  }
  .fav-seeall-content .favorite-banner {
    position: relative;
    height: 122px;
  }
  .fav-seeall-content .favorite-banner .favorite-img {
    min-height: 122px;
  }
  .fav-seeall-content .favorite-banner .favorite-img img {
    height: 122px;
  }
  .fav-seeall-content .favorite-banner .set-favourite-text {
    padding-left: 2.8%;
  }
  .fav-seeall-content .favorite-banner .set-favourite-text h1 {
    font-size: 19px;
  }
}

@media only screen and (min-width: 1600px) and (max-width: 1920px) {
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, 1fr);
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(15, 1fr);
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
    padding-bottom: 100%;
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
    height: 100%;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, 1fr);
  }
}
@media only screen and (min-width: 1171px) and (max-width: 1340px) {
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(11, 1fr);
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media only screen and (min-width: 941px) and (max-width: 1170px) {
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 30px 70px;
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(9, 1fr);
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 940px) {
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 20px 40px;
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(8, 1fr);
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 40px;
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-gap: 20px;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: 20px 50px;
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, 1fr);
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 40px;
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .seeall-content {
    padding: 0;
  }
  .seeall-content h1 {
    width: 94%;
  }
  .seeall-content .news-filter {
    overflow-x: scroll;
    margin-top: 12px;
    margin-bottom: 10px;
  }
  .seeall-content .news-filter li {
    padding: 6px 15px;
    margin-right: 10px;
    font-size: 16px;
  }
  .seeall-content .news-filter li.active span {
    padding-left: 11px;
    top: 0px;
  }
  .seeall-content .news-filter li.active span i {
    font-size: 10px;
  }
  .seeall-content .seo-description-container {
    padding-top: 0px;
    padding-bottom: 0px;
  }
  .seeall-content .seo-description-container p {
    margin-top: 12px;
  }
  .seeall-content .seo-description-container.footer {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .seeall-content .home-faq-container .horizontal-line {
    margin-top: 0px;
    margin-bottom: 12px;
  }
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 12px;
  }
  .seeall-content .seeall.listing-portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
    margin-bottom: 0;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: 18px 66px;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component span:first-child .listing-item .top-ten-image {
    left: 0%;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
    aspect-ratio: 1/0.9;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games {
    width: 100%;
    height: 100%;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item div:nth-child(1) {
    width: 70.5%;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
    height: 78.5%;
    border-radius: 9.617px;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .games-favorite {
    bottom: 26%;
    right: 0;
    left: 75%;
    width: 20%;
    height: 16%;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .game-detail {
    font-size: 12.823px;
    width: 70.5%;
    top: 77%;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image {
    bottom: 26% !important;
    width: 35.5% !important;
    left: 3% !important;
    height: 52% !important;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image img {
    top: 0 !important;
  }
  .seeall-content .seeall.listing-square.games-top-ten .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image img.double-number-image {
    left: -52% !important;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: 8px;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games {
    width: 89%;
    height: 100%;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .listing-double-number {
    width: 168px;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .card-image {
    width: 66.8%;
    height: 66.8%;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .games-favorite {
    width: 22px;
    height: 22px;
    bottom: 25px;
    left: 70px;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .top-ten-image img {
    width: 50px;
    height: 64px;
    bottom: 0;
    top: 25px;
    left: -22.5%;
    border-radius: 0px;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .top-ten-image img.double-number-image {
    width: 92px !important;
    left: -38%;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .game-detail {
    margin-top: 3.84px;
    height: 16px;
  }
  .seeall-content .seeall.listing-square .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-top-ten-games .game-detail .game-detail-title {
    color: #ffffff;
    font-family: volte_reg;
    font-size: 12.823px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px 12px;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component span:last-child .listing-item {
    overflow: unset;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
    aspect-ratio: 1/1.22;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item div:nth-child(1) {
    width: 76.75%;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-provider-logo {
    width: 20px;
    height: 20px;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .top-portrait-episode-free {
    bottom: 5.5%;
    font-size: 10px;
    left: 45%;
    border-radius: 0px 0px 6px 0px;
    width: 55%;
    padding: 4px;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
    height: 94.4%;
    border-radius: 6px !important;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image {
    height: 43.8%;
  }
  .seeall-content .seeall.listing-top_portrait .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .top-ten-image img {
    width: auto;
    height: 100%;
    display: block;
    max-width: none;
    position: relative;
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
    padding-top: 10px;
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
    padding: 0 !important;
    margin-bottom: -2px;
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
    margin-right: 0;
    margin-bottom: 0;
  }
  .seeall-content .seeall .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
    height: 81%;
  }
  .seeall-content .seeall.listing-landscape .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
    height: 100%;
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
  .seeall-content .seeall.live-see-all .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .card-image {
    height: 95%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.channel-container h1 {
  margin-bottom: 30px;
}

@media only screen and (max-width: 480px) {
  .channel-container h1 {
    margin-bottom: 12px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.seo-description-container {
  padding: 30px 2.8%;
  padding-bottom: 25px;
}
.seo-description-container.seo-hide-description {
  visibility: hidden;
  height: 0;
  margin: 0 !important;
  padding: 0 !important;
}
.seo-description-container h1 {
  font-family: volte_reg;
  font-size: 26px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  color: #ffffff;
  margin-bottom: 2px;
}
.seo-description-container h2 {
  font-size: 20px;
}
.seo-description-container p {
  font-family: volte_reg;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
  color: #F3CBE3;
  white-space: pre-wrap;
}

.seo-hr {
  border: 2px solid #564372;
  margin-bottom: 36px;
  overflow: hidden;
}
.seo-hr.seo-hide-description {
  visibility: hidden;
  height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

@media only screen and (max-width: 480px) {
  .seo-description-container {
    padding: 0px 2.8%;
  }
  .seo-description-container.footer {
    margin-top: 10px;
  }
  .seo-description-container h1 {
    font-size: 20px;
    margin-bottom: 10px;
  }
  .seo-description-container h2 {
    font-size: 14px;
  }
  .seo-description-container p {
    font-size: 12px;
  }
  .seo-hr {
    border: 1px solid #564372;
    margin: 18px 0;
    overflow: hidden;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.app-provider-wrapper {
  width: 100%;
  background: linear-gradient(330.7deg, #020005 4.64%, #220046 92.58%);
  border-radius: 11.25px;
  padding: 18px 0 32.5px 0;
}
.app-provider-wrapper .explore-btn-container {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  padding-bottom: 22px;
}
.app-provider-wrapper .explore-btn-container .explore-btn {
  background: inherit;
  border-radius: 50px;
  padding: 19.0573px 28.125px;
  border: 2.08491px solid #F3CBE3;
  cursor: pointer;
}
.app-provider-wrapper .explore-btn-container .explore-btn .button-text {
  color: #F3CBE3;
  font-family: volte_medium;
  font-style: normal;
  font-weight: 600;
  font-size: 22.5px;
}
.app-provider-wrapper .provider-title {
  display: flex;
  justify-content: center;
  margin-bottom: 36.5px;
}
.app-provider-wrapper .provider-title h2 {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 26px;
  line-height: 26px;
  text-align: center;
  color: #FFFFFF;
  padding: 0;
}
.app-provider-wrapper .browse-listing-container .listing-horizontal {
  padding-left: 0px;
}
.app-provider-wrapper .browse-listing-container .listing-horizontal .box-shadow-slider {
  width: 65px;
  height: 75px;
  position: absolute;
  z-index: 10;
  left: -18px;
  top: 0;
  background: linear-gradient(270deg, #220046 20.89%, rgba(34, 0, 70, 0.7) 45.36%, rgba(34, 0, 70, 0) 100%);
  transform: matrix(-1, 0, 0, 1, 0, 0);
}
.app-provider-wrapper .browse-listing-container .listing-horizontal .box-shadow-slider-right-shadow {
  width: 65px;
  height: 75px;
  position: absolute;
  z-index: 10;
  top: 0;
  background: linear-gradient(270deg, #16012E 20.89%, rgba(22, 1, 46, 0.7) 45.36%, rgba(34, 0, 70, 0) 100%);
  transform: matrix(1, 0, 0, 1, 0, 0);
  right: 0;
}
.app-provider-wrapper .browse-listing-container .browse-rails-container {
  border-radius: 6px;
  width: 73px;
  height: 73px;
  opacity: 0.65;
}
@media only screen and (max-width: 480px) {
  .app-provider-wrapper .browse-listing-container .browse-rails-container {
    border-radius: 3.47826px;
  }
}
.app-provider-wrapper .browse-listing-container ul .slick-track {
  margin-left: -50px;
}
@media only screen and (max-width: 480px) {
  .app-provider-wrapper .browse-listing-container ul .slick-track {
    margin-left: -42px;
  }
}
.app-provider-wrapper .browse-listing-container ul .slick-slider {
  width: 100%;
}
.app-provider-wrapper .browse-listing-container ul .slick-slider .slick-slide {
  opacity: 0.65;
  touch-action: none;
  pointer-events: none;
  width: 93px !important;
}
@media only screen and (max-width: 480px) {
  .app-provider-wrapper .browse-listing-container ul .slick-slider .slick-slide {
    width: 50px !important;
  }
}
.app-provider-wrapper .browse-listing-container ul .slick-slider .slick-active {
  touch-action: pan-y;
  pointer-events: unset;
  margin-bottom: 0 !important;
}
.app-provider-wrapper .browse-listing-container ul .slick-slider .slick-arrow {
  z-index: 11;
}
.app-provider-wrapper .browse-listing-container ul .slick-slider .slick-arrow.slick-prev {
  left: 34px;
}
.app-provider-wrapper .browse-listing-container ul .slick-slider .slick-arrow.slick-next {
  right: 34px;
}
.app-provider-wrapper .browse-listing-container ul .center .slick-center {
  margin: 0 20px;
}
@media only screen and (max-width: 480px) {
  .app-provider-wrapper .browse-listing-container ul .center .slick-center {
    margin: 0 15px;
  }
}
.app-provider-wrapper .browse-listing-container ul .center .slick-center .listing-block {
  width: auto;
}
.app-provider-wrapper .browse-listing-container ul .center .slick-center .center-mode {
  transition: all 0.15s ease-out;
  transform: scale(1.5, 1.5);
  background: linear-gradient(white, white) padding-box, linear-gradient(180deg, #E796C7 50%, #F3CBE3 100%) border-box;
  border: 1px solid transparent;
  z-index: 4;
  border-radius: 7.3913px;
  opacity: 1;
}
@media only screen and (max-width: 480px) {
  .app-provider-wrapper .browse-listing-container ul .center .slick-center .center-mode {
    transform: scale(1.7, 1.7);
    border: 1px solid transparent;
    border-radius: 4px;
  }
}
.app-provider-wrapper .browse-listing-container .slick-dots {
  bottom: -38px;
}
.app-provider-wrapper .browse-listing-container .slick-dots li {
  width: 0px;
  height: 0px;
  bottom: 1.5px;
}
.app-provider-wrapper .browse-listing-container .slick-dots li.slick-active .slick-dot-container {
  background-color: #e10092;
  width: 70px;
  border-radius: 4px;
  height: 8px;
}
.app-provider-wrapper .browse-listing-container .slick-dots .slick-divider {
  border-bottom: 1px solid #444764;
  position: relative;
  bottom: 20px;
  margin-right: 6.9%;
}
.app-provider-wrapper .browse-main-container {
  margin-top: 40px;
}
.app-provider-wrapper .browse-main-container .apps-card-container {
  margin: 0 34px;
  background: rgba(239, 232, 251, 0.2);
  border-radius: 11.25px;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 22.5px;
  padding: 38px 22px 70px 22px;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item {
  position: relative;
  width: 100%;
  border-radius: 8.18px;
  padding-bottom: 147%;
  background: #020005;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item img {
  width: 100%;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item .crown-image {
  width: auto;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item .place-holder-image {
  position: absolute;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item .listing-item-image {
  position: relative;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item .content-info {
  display: flex;
  justify-content: end;
  padding: 4px 0px;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .listing-item .content-info img {
  width: 20px;
  height: 20px;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .hover-popup .apps-hover {
  width: 106% !important;
  height: fit-content;
  margin-left: -7px;
  margin-top: -10px;
  border-radius: 8.18px;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .hover-popup .apps-hover .image-top img {
  height: 98%;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .hover-popup .apps-hover .image-top .broken-image {
  padding-bottom: 125%;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block {
  display: flex;
  flex-direction: column;
  position: relative;
  width: 300px;
  margin: 0px 15px 30px 0px;
}
@media only screen and (max-width: 768px) {
  .app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block {
    width: 156px;
  }
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block img {
  width: 100%;
  height: 200px;
  border-radius: 8px;
}
@media only screen and (max-width: 768px) {
  .app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block img {
    height: 87px;
  }
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block .place-holder-image {
  position: absolute;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block .listing-item-image {
  position: relative;
}
.app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block span {
  font-family: sky_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 30px;
  line-height: inherit;
  color: #a3a6c2;
}
@media only screen and (max-width: 768px) {
  .app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container .landscape-block span {
    font-size: 13px;
  }
}
.app-provider-wrapper .browse-main-container .browse-all-link {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px;
  position: relative;
  bottom: 15px;
}
.app-provider-wrapper .browse-main-container .browse-all-link .browse-all-image {
  text-decoration: none;
  cursor: pointer;
  font-size: 16px;
  font-family: sky_med;
  color: #5087c7;
}
.app-provider-wrapper .browse-main-container .browse-all-link .browse-all-image:after {
  content: "";
  display: inline-block;
  width: 21px;
  height: 20px;
  background: url(/9ebeca947bf1db810a8cbf7d06b827f3.svg) no-repeat;
  position: relative;
  left: 7px;
  top: 4px;
}
.app-provider-wrapper .browse-main-container .browse-all-link .browse-all-image:hover {
  color: #5087c7;
}

@media only screen and (max-width: 480px) {
  .app-provider-wrapper .browse-listing-container .listing-horizontal {
    padding-left: 0px;
  }
  .app-provider-wrapper .browse-listing-container .listing-horizontal .box-shadow-slider {
    width: 30px;
    height: 40px;
    left: 0px;
  }
  .app-provider-wrapper .browse-listing-container .listing-horizontal .box-shadow-slider-right-shadow {
    width: 30px;
    height: 40px;
  }
  .app-provider-wrapper .browse-listing-container .browse-rails-container {
    width: 40px;
    height: 40px;
  }
  .app-provider-wrapper .provider-title {
    margin-bottom: 26px;
  }
  .app-provider-wrapper .provider-title h2 {
    font-size: 14px;
  }
  .app-provider-wrapper .explore-btn-container {
    padding-bottom: 15px;
    padding-top: 2px;
  }
  .app-provider-wrapper .explore-btn-container .explore-btn {
    padding: 0px 16px;
    height: 38px;
    display: flex;
    align-items: center;
    border: 2px solid #F3CBE3;
  }
  .app-provider-wrapper .explore-btn-container .explore-btn .button-text {
    font-size: 12px;
    line-height: 12px;
  }
  .app-provider-wrapper .browse-main-container {
    margin-top: 41px;
  }
  .app-provider-wrapper .browse-main-container .apps-card-container {
    margin: 0 11px;
  }
  .app-provider-wrapper .browse-main-container .apps-card-container .browse-sub-container {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 10px;
    padding: 10px 10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.live-banner-rail {
  border-radius: 6px;
  border: 2px solid #564372;
  background: var(--sports, linear-gradient(315deg, #A22736 0%, #220046 100%));
  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.6);
  width: 640px;
  height: 117px;
  display: flex;
  align-items: center;
  margin: auto;
  margin-bottom: 30px;
  cursor: pointer;
}
.live-banner-rail .card-container {
  width: 209px;
  height: 100%;
  position: relative;
}
.live-banner-rail .card-container:after {
  content: "";
  position: absolute;
  right: -28%;
  width: 102px;
  height: 100%;
  background: linear-gradient(90deg, rgba(91, 18, 63, 0) 19.27%, #5B123F 43.75%, rgba(91, 18, 63, 0) 72.92%);
}
.live-banner-rail .card-container img {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}
.live-banner-rail .card-container .live-card {
  width: 100%;
  height: 100%;
  border-radius: 4px;
}
.live-banner-rail .card-container .partner-logo {
  width: auto;
  height: 20px;
  position: absolute;
  top: 3px;
  left: 3.5px;
}
.live-banner-rail .live-banner-detail-container {
  margin-left: 6%;
  margin-top: 12px;
  color: var(--text-white, #FFF);
  text-align: left;
  line-height: 110%;
  font-family: "volte_medium";
  width: 55%;
}
.live-banner-rail .live-banner-detail-container .head-text {
  font-size: 22px;
  font-weight: 600;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.live-banner-rail .live-banner-detail-container .head-text.live-dot::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 3px;
  border-radius: 8px;
  background-color: #E56C6C;
  margin-bottom: 4px;
  margin-left: -11px;
}
.live-banner-rail .live-banner-detail-container .live-banner-title {
  font-size: 18px;
  font-weight: 500;
  margin-top: 9px;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
.live-banner-rail .live-banner-detail-container .primary-btn {
  margin-top: 9px;
  padding: 6px 20px;
}
.live-banner-rail .live-banner-detail-container .primary-btn:hover {
  color: #ffffff;
  border: 2px solid #e10092;
  transition: 0ms;
}

@media only screen and (max-width: 480px) {
  .live-banner-rail {
    width: 95%;
    height: 108px;
    margin-bottom: 15px;
    justify-content: space-between;
  }
  .live-banner-rail .live-banner-detail-container {
    margin-left: 14px;
    margin-top: 9.5px;
    width: 35%;
  }
  .live-banner-rail .live-banner-detail-container .head-text {
    font-size: 16px;
    font-family: volte_medium;
    font-weight: 500;
  }
  .live-banner-rail .live-banner-detail-container .head-text.live-dot::before {
    width: 5px;
    height: 5px;
    margin-right: 4px;
    margin-left: -1px;
    margin-bottom: 3px;
  }
  .live-banner-rail .live-banner-detail-container .live-banner-title {
    font-size: 11px;
    font-weight: 500;
    margin-top: 9px;
  }
  .live-banner-rail .live-banner-detail-container .primary-btn {
    font-size: 12px;
    padding: 3px 18px;
    margin: 6px 0px 10px 0px;
  }
  .live-banner-rail .card-container {
    width: 184px;
    height: 100%;
    margin-left: 20px;
    display: flex;
  }
  .live-banner-rail .card-container:after {
    width: 77px;
    height: 100%;
    left: -19%;
  }
  .live-banner-rail .card-container .partner-logo {
    width: auto;
    height: 16px;
    position: absolute;
    right: 4px;
    top: 4px;
    left: unset;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.channel-wrapper {
  width: 100%;
  background: #220046;
  padding-left: 40px;
  padding-top: 12px;
}
.channel-wrapper .slick-initialized .slick-slide {
  width: 136px !important;
  margin-bottom: 12px !important;
}
.channel-wrapper.channel-wrapper-alt {
  background: linear-gradient(330.7deg, #020005 4.64%, #220046 92.58%);
}
.channel-wrapper .language-filter-wrapper {
  position: relative;
}
.channel-wrapper .gradient-base, .channel-wrapper .right-gradient, .channel-wrapper .left-gradient {
  position: absolute;
  width: 127px;
  height: 48px;
  z-index: 1;
}
.channel-wrapper .left-gradient {
  left: 0;
  background: linear-gradient(-90deg, rgba(34, 0, 70, 0) 0%, #220046 100%);
}
.channel-wrapper .right-gradient {
  right: 0;
  background: linear-gradient(90deg, rgba(34, 0, 70, 0) 0%, #220046 100%);
}
.channel-wrapper .compositeTitle {
  padding-left: 9px;
}
.channel-wrapper .channel-title {
  display: flex;
  justify-content: flex-start;
  padding-bottom: 12px;
}
.channel-wrapper .channel-title h2 {
  color: #ffffff;
  padding: 0;
  font-family: volte_medium;
  font-size: 22px;
  font-weight: 500;
  line-height: 21.6px;
  text-align: left;
}
.channel-wrapper .language-filter {
  overflow: hidden;
  white-space: nowrap;
  width: 100%;
}
.channel-wrapper .language-filter i {
  position: absolute;
}
.channel-wrapper .language-filter i:after {
  color: #ffffff;
  top: 10px;
  display: inline-block;
  position: relative;
  left: 90px;
}
.channel-wrapper .language-filter .left-icon {
  margin-top: 3px;
}
.channel-wrapper .language-filter .left-icon:after {
  content: "";
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url(/b4469cefef8bf631b48edc1e955c90db.svg) no-repeat;
  position: relative;
  left: 11px;
  z-index: 2;
  cursor: pointer;
}
.channel-wrapper .language-filter .right-icon {
  text-decoration: none;
  cursor: pointer;
  font-size: 14px;
  line-height: 16.14px;
  font-family: volte_medium;
  color: #ffffff;
}
.channel-wrapper .language-filter .right-icon:after {
  content: "";
  display: inline-block;
  width: 120px;
  height: 40px;
  background: url(/7941a12718b2867f46a29f155a740150.svg) no-repeat;
  position: relative;
  cursor: pointer;
  z-index: 2;
}
.channel-wrapper .language-filter li {
  cursor: pointer;
  display: inline-block;
  padding: 8px 18px;
  border-radius: 24.5px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.11), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  font-size: 22px;
  color: #f3cbe3;
  line-height: 1.29;
  margin-right: 13px;
  border: 1px solid #f3cbe3;
  font-weight: 400;
  font-family: volte_reg;
}
.channel-wrapper .language-filter li.active {
  background-color: #e5007d;
  border: 2px solid #e5007d;
  color: #ffffff;
  border-radius: 55px;
}
.channel-wrapper .language-filter li.active.genre-active {
  color: #ffffff;
}
.channel-wrapper .language-filter li.active.genre-active span {
  padding-left: 10px;
  position: relative;
  top: 1.2px;
}
.channel-wrapper .language-filter li.active.genre-active span .icon-close {
  position: unset;
  font-size: 17px;
  border: none;
  border-radius: unset;
  background-color: unset;
}
.channel-wrapper .language-filter li:hover {
  color: #ffffff;
  border: 2px solid #ffffff;
  border-radius: 55px;
  padding: 7px 17.2px;
}
.channel-wrapper .language-filter li.active:hover {
  border: 2px solid transparent;
  padding: 8px 18px;
}
.channel-wrapper .filter-container {
  margin-top: 20px;
}
.channel-wrapper .filter-container .form-group {
  margin: 22px auto;
}
.channel-wrapper .right-icon {
  margin-top: 4px;
  right: 0px;
}
.channel-wrapper .right-icon:after {
  content: ">";
}
.channel-wrapper .listing-horizontal {
  padding-left: 0px;
  padding-top: 12px;
}
.channel-wrapper .listing-channel li {
  height: 120px;
  width: 120px;
  border-radius: 4px;
}
.channel-wrapper .listing-channel li .card-image:hover {
  padding: 2px;
  border: 2px solid white;
}

.composite-container {
  background-color: linear-gradient(330.7deg, #020005 4.64%, #220046 92.58%);
}

@media only screen and (max-width: 480px) {
  .channel-wrapper {
    width: 100%;
    padding-left: 10px;
    padding-top: 8px;
  }
  .channel-wrapper .slick-initialized .slick-slide {
    width: 98px !important;
    margin-bottom: 8px !important;
  }
  .channel-wrapper .compositeTitle {
    padding-left: 0px;
  }
  .channel-wrapper .channel-title {
    display: flex;
    justify-content: flex-start;
  }
  .channel-wrapper .channel-title h2 {
    color: #ffffff;
    padding: 0;
    font-family: volte_medium;
    font-size: 14px;
    font-weight: 500;
    line-height: 16.8px;
    text-align: left;
  }
  .channel-wrapper .language-filter {
    margin-bottom: 0;
    overflow-x: scroll;
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    width: 100%;
    /* Firefox */
  }
  .channel-wrapper .language-filter::-webkit-scrollbar {
    display: none;
  }
  .channel-wrapper .language-filter i {
    position: absolute;
  }
  .channel-wrapper .language-filter i:after {
    color: #ffffff;
    top: 7px;
    display: inline-block;
    position: relative;
    left: 90px;
  }
  .channel-wrapper .language-filter .left-icon {
    margin-top: 6px;
    background: linear-gradient(90deg, rgba(34, 0, 70, 0) 0%, #220046 100%);
  }
  .channel-wrapper .language-filter .left-icon:after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background: url(/b4469cefef8bf631b48edc1e955c90db.svg) no-repeat;
    position: relative;
    left: 0px;
  }
  .channel-wrapper .language-filter .right-icon {
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
    line-height: 16.14px;
    font-family: volte_medium;
    color: #ffffff;
    background: linear-gradient(90deg, rgba(34, 0, 70, 0) 0%, #220046 100%);
  }
  .channel-wrapper .language-filter .right-icon:after {
    content: "";
    display: inline-block;
    width: 32px;
    height: 32px;
    background: url(/7941a12718b2867f46a29f155a740150.svg) no-repeat;
    position: relative;
  }
  .channel-wrapper .language-filter li {
    cursor: pointer;
    display: inline-block;
    padding: 8px 16px;
    border-radius: 55px;
    box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.11), 0 0 2px 0 rgba(0, 0, 0, 0.12);
    font-size: 16px;
    color: #f3cbe3;
    line-height: 19.2px;
    margin-right: 6px;
    border: 1px solid #f3cbe3;
    font-weight: 500;
    font-family: volte_reg;
  }
  .channel-wrapper .language-filter li.active {
    background-color: #e5007d;
    border: 1px solid #e5007d;
    height: 35px;
    text-align: center;
    font-size: 16px;
  }
  .channel-wrapper .language-filter li.active.genre-active {
    color: #ffffff;
  }
  .channel-wrapper .language-filter li.active.genre-active span {
    padding-left: 10px;
    position: relative;
    top: 1.2px;
  }
  .channel-wrapper .language-filter li.active.genre-active span .icon-close {
    position: unset;
    font-size: 17px;
    border: none;
    border-radius: unset;
    background-color: unset;
  }
  .channel-wrapper .language-filter li:hover {
    color: #ffffff;
    border: 1px solid #ffffff;
  }
  .channel-wrapper .filter-container {
    margin-top: 20px;
  }
  .channel-wrapper .filter-container .form-group {
    margin: 22px auto;
  }
  .channel-wrapper .right-icon {
    margin-top: 6px;
    right: 2.8%;
  }
  .channel-wrapper .right-icon:after {
    content: ">";
  }
  .channel-wrapper .listing-horizontal {
    padding-left: 0px;
    padding-top: 12px;
  }
  .channel-wrapper .listing-channel li {
    height: 90px;
    width: 90px;
    border-radius: 4px;
  }
  .channel-wrapper .listing-channel li .card-image:hover {
    padding: unset;
    border: unset;
  }
  .channel-wrapper .horizontal-rail {
    padding-bottom: 6px;
    margin-top: 12px;
    gap: 8px;
  }
  .channel-wrapper .slider-rail-top {
    margin-top: 0px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.header-container {
  background-color: black;
  color: #00ffff;
}

.main-container {
  margin-top: 0;
  padding: 0;
  min-height: 100vh;
}
.main-container.cancel-page-header {
  margin-top: -24px;
}
.main-container.top-margin {
  margin-top: 4.4em;
}
.main-container .seo-home .footer {
  margin-top: -62px;
}
@media only screen and (max-width: 480px) {
  .main-container.home-page {
    margin-top: 0;
  }
}
.main-container .fs-message {
  color: #ffffff;
  text-align: center;
  position: fixed;
  top: 50%;
  width: 100%;
}

.handle-top {
  margin-top: 4em;
}
.handle-top.mg-top {
  margin-top: 5em;
}

.bottom-margin {
  margin-bottom: 1.562em;
}

.slick-prev,
.slick-next {
  z-index: 10001;
}

@media only screen and (max-width: 480px) {
  .top-download-header .main-container {
    margin-top: 90px !important;
    position: relative;
  }
  .main-container {
    margin-top: 0;
  }
  .main-container.top-margin {
    margin-top: 51px;
  }
  .main-container.margin-player {
    margin-top: 30px !important;
  }
  .main-container.campaign-page-subscription {
    margin-top: 0px !important;
  }
  .main-container.new-banner-home {
    margin-top: 45px !important;
  }
  .main-container.new-banner-home.margin-rm {
    margin-top: 0px !important;
  }
  .bottom-margin {
    margin-bottom: 3.6em;
  }
  .page-cls-freetrial .main-container {
    height: 100vh;
  }
}
.page-cls-transactions .main-container {
  display: flex;
  margin-top: 0px !important;
}
@media only screen and (max-width: 480px) {
  .page-cls-transactions .main-container {
    margin-top: 0px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.partner-home-bar {
  margin-top: 10px;
  width: 100%;
  margin-bottom: 20px;
  padding-left: 2.8%;
}
.partner-home-bar div.left-block.normal-block, .partner-home-bar div.left-block.big-block {
  display: flex;
  align-items: center;
}
.partner-home-bar div.right-block {
  width: 35%;
  display: inline-block;
  border-right: 2px solid #52547a;
}
.partner-home-bar div.right-block .partner-desc {
  width: 100%;
  padding: 0 8%;
  font-size: 14px;
  line-height: 1.57;
  color: #ffffff;
}
.partner-home-bar .partner-logo {
  width: 55px;
  height: 55px;
  margin-right: 20px;
}
.partner-home-bar .partner-logo .broken-image {
  box-shadow: none !important;
  background-color: transparent !important;
  display: none;
  width: 55px;
  height: 55px;
}
.partner-home-bar .partner-logo img {
  border-radius: 100%;
  height: 100%;
}
.partner-home-bar .partner-info .partner-name {
  line-height: 120%;
  width: 100%;
  font-size: 26px;
  color: #EEEEFF;
}
.partner-home-bar .partner-info .subscription {
  width: 100%;
  line-height: 1.22;
  color: #a3a6c2;
  text-align: left;
  padding-left: 3px;
}
.partner-home-bar .partner-subscribe-btn-section {
  display: inline-block;
  text-align: center;
}
.partner-home-bar .partner-subscribe-btn-section .btn {
  width: auto;
  font-size: 16px;
  height: auto;
  padding: 12px 24px;
  margin-top: 10px;
  margin-right: 0;
}
.partner-home-bar .partner-subscribe-btn-section.btn-small, .partner-home-bar .partner-subscribe-btn-section.btn-normal {
  width: 31%;
}

@media only screen and (max-width: 1150px) {
  .partner-home-bar div.left-block.normal-block {
    width: 60%;
  }
  .partner-home-bar div.left-block .partner-logo {
    margin-left: 0;
  }
  .partner-home-bar div.right-block {
    width: 33.3%;
  }
  .partner-home-bar div.partner-subscribe-btn-section.btn-small {
    width: 26.3%;
  }
  .partner-home-bar div.partner-subscribe-btn-section.btn-normal {
    width: 33.3%;
  }
}
@media only screen and (max-width: 480px) {
  .partner-home-bar {
    position: relative;
    margin-top: 0;
    margin-bottom: 0;
  }
  .partner-home-bar .partner-logo {
    margin-right: 10px;
  }
  .partner-home-bar .partner-info .partner-name {
    font-size: 16px;
  }
}
/*
@media only screen and (max-width: 950px) {
  .partner-home-bar {
    display: block;
    width: 100%;
    height: auto;
    padding-left: 6.9%;

    div {
      &.left-block {
        display: block;
        border-right: none;
        &.normal-block,
        &.big-block{
          width: 100%;
          text-align: left;
        }
        .partner-logo {
          margin-left: 0;
        }
          .partner-info {
            .partner-name {
              width: 100%;
              margin-bottom: 2px;
            }
            .subscription {
              width: 100%;
            }
          }
      }

      &.right-block {
        width: 100%;
        display: block;
        border-right: none;
        margin: 12px 0 5px 0;
        .partner-desc{
          margin-left: 0;
          padding: 0;
        }
      }

      &.partner-subscribe-btn-section {

        display: block;
        text-align: left;
        &.btn-small,&.btn-normal {
          width: 100%;
        }
        .btn{
          margin-left: 0;
          padding: 10px 24px;
          width: fit-content;
        }
      }
    }
  }
}*/
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.home-faq-container {
  margin-bottom: 5px;
  padding: 0px 2.8% 30px 2.8%;
}
.home-faq-container.seo-hide-description {
  visibility: hidden;
  height: 0;
  margin: 0 !important;
  padding: 0 !important;
}
.home-faq-container .horizontal-line {
  width: 100%;
  border: 1px solid #564372;
  margin-bottom: 18px;
}
@media only screen and (max-width: 480px) {
  .home-faq-container {
    padding-bottom: 0;
  }
  .home-faq-container .horizontal-line {
    margin: 18px auto;
    width: 94%;
  }
}

.home-faq {
  padding: 0 10px;
}
.home-faq h2 {
  font-size: 22px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
}
.home-faq .accordion-item {
  padding: 12.852px 36px 13.148px 20px;
  border-radius: 12px;
  border: 1px solid #564372;
  margin-top: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
}
.home-faq .accordion-item.active {
  padding: 10px 36px 25px 25px;
  border: 2px solid #F2F2F2;
}
.home-faq .accordion-item.active .answer-wrapper {
  visibility: visible;
  -webkit-transition: height 0.7s ease;
  -o-transition: height 0.7s ease;
  transition: height 0.7s ease;
  margin-top: 10px;
}
.home-faq .accordion-item.active .answer-wrapper p {
  visibility: visible;
  -webkit-transition: opacity 1s ease-out;
  -o-transition: opacity 1s ease-out;
  transition: opacity 1s ease-out;
  opacity: 1;
}
.home-faq .accordion-item .title-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #ffffff;
  font-size: 18px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  font-family: volte_reg;
}
.home-faq .accordion-item .title-wrapper .arrow-wrapper.active img {
  -webkit-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
}
.home-faq .accordion-item .title-wrapper .arrow-wrapper img {
  width: 24px;
  height: 24px;
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.home-faq .accordion-item .answer-wrapper {
  color: #D6C6F4;
  visibility: hidden;
  -webkit-transition: height 0.4s ease-out;
  -o-transition: height 0.4s ease-out;
  transition: height 0.4s ease-out;
  font-size: 16px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
}
.home-faq .accordion-item .answer-wrapper p {
  visibility: hidden;
  opacity: 0;
}

@media only screen and (max-width: 480px) {
  .home-faq {
    padding: 0;
  }
  .home-faq h2 {
    font-size: 16px;
  }
  .home-faq .accordion-item {
    padding: 10px;
  }
  .home-faq .accordion-item.active {
    padding: 10px 10px 25px 25px;
  }
  .home-faq .accordion-item .title-wrapper {
    font-size: 15px;
  }
  .home-faq .accordion-item .title-wrapper .arrow-wrapper {
    padding-right: 0px;
  }
  .home-faq .accordion-item .title-wrapper .arrow-wrapper img {
    width: 16px;
    height: 16px;
  }
  .home-faq .accordion-item .answer-wrapper {
    font-size: 12px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.home-container .container.new-hero-banner .slick-list .slick-slide .hero-banner {
  display: flex;
  justify-content: center;
}
.home-container .container.new-hero-banner .slick-list .slick-slide img.banner-provider-image {
  width: 48px;
  height: 48px;
  top: 20px;
  right: 33px;
  border-radius: 4.62px;
  z-index: 2;
}
@media only screen and (max-width: 480px) {
  .home-container .container.new-hero-banner .slick-list .slick-slide img.banner-provider-image {
    border-radius: 0;
  }
}
.home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper {
  top: 31px;
  left: 20px;
  position: absolute;
  display: flex;
  align-items: center;
  width: auto;
  z-index: 2;
}
.home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper .live-tag {
  display: inline-flex;
  align-items: center;
  border-radius: 5px;
  height: 26px;
  background: #6B00DD;
  color: #FFFFFF;
  border-radius: 2px;
  margin-right: 12px;
  padding: 0 4px;
  font-family: volte_semiBold;
}
.home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper .live-tag .dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  margin-right: 5px;
  background: #FF224A;
}
.home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper .crown-image {
  margin: unset;
  position: unset;
  width: 30px !important;
  height: 30px !important;
}
.home-container .container.new-hero-banner .content-meta-container {
  display: flex;
  justify-content: revert;
  align-items: flex-start;
  flex-direction: column;
  text-align: -webkit-center;
  position: absolute;
  bottom: 20px;
  width: 340px;
  z-index: 2;
  width: 98.7%;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster {
  width: auto !important;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classa {
  max-width: 650px;
  height: 45px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classb {
  height: 55px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classc {
  height: 80px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classd {
  height: 90px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classe {
  height: 100px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classf {
  height: 115px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster img {
  width: 100% !important;
  height: 100% !important;
  position: unset;
  border-radius: unset;
  max-width: 100%;
  object-fit: contain;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster .hide-title {
  visibility: hidden;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info {
  font-family: volte_reg;
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  color: #FFFFFF;
  margin-top: 12px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info .star-icon {
  width: 24px !important;
  height: 24px !important;
  display: inline-flex;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info .star-icon img {
  width: 100%;
  height: 100%;
  margin-right: 10px;
  position: relative;
  top: 7px;
}
.home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info.hidden {
  visibility: hidden;
}
.home-container .container.new-hero-banner .button-container {
  display: flex;
  align-items: center;
  column-gap: 12px;
  margin-top: 12px;
  justify-content: center;
}
.home-container .container.new-hero-banner .button-container.flex-block {
  display: flex;
  justify-content: center;
}
.home-container .container.new-hero-banner .button-container.show-btn {
  visibility: unset;
}
.home-container .container.new-hero-banner .button-container.hide-btn {
  visibility: hidden;
}
.home-container .container.new-hero-banner .empty-btn {
  height: 40px;
}
.home-container .container.new-hero-banner .play-now-btn {
  position: unset;
}
.home-container .container.new-hero-banner .play-now-btn .btn::before {
  margin-right: 8px;
}
.home-container .container.new-hero-banner .play-now-btn .btn {
  min-width: 280px;
  height: 40px;
  padding: 0 30px;
  justify-content: center;
}
.home-container .container.new-hero-banner .play-now-btn .btn span {
  padding-right: 0;
}
.home-container .container.new-hero-banner .watchlist-container .watchlist-btn {
  min-width: 48px;
  height: 40px;
  padding: 0;
  border-radius: 4px;
  color: #ffffff;
  background-blend-mode: normal, overlay;
  background: #e10092;
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  margin: 0;
}
.home-container .container.new-hero-banner .watchlist-container .button-icon {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.home-container .container.new-hero-banner .watchlist-container .button-icon .icon-check::before {
  font-size: 16px;
  color: #FFFFFF;
}
.home-container .container.new-hero-banner .watchlist-container .button-icon .add-icon {
  width: 16px !important;
  height: 16px !important;
}
.home-container .container.new-hero-banner .watchlist-container .button-icon .tick-icon {
  width: 16px !important;
  height: 16px !important;
}
.home-container .container.new-hero-banner .banner-gradient {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 193px;
  max-width: 98.7%;
  border-radius: 11px;
}
.home-container .container.new-hero-banner .top-gradient {
  position: absolute;
  top: 0;
  width: 100%;
  height: 89px;
  max-width: 98.7%;
  border-radius: 11px;
}

@media only screen and (max-width: 480px) {
  .home-container .container.new-hero-banner {
    margin-bottom: -12%;
  }
  .home-container .container.new-hero-banner.category-page-banner {
    top: unset;
    margin-bottom: -21%;
  }
  .home-container .container.new-hero-banner .hb-slick-dots {
    z-index: 2;
  }
  .home-container .container.new-hero-banner .slick-track {
    transform: unset !important;
    transition: unset !important;
    transition: transform 0.1s ease !important;
  }
  .home-container .container.new-hero-banner .slick-list {
    overflow: hidden;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide.slick-cloned {
    opacity: 0.2;
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1);
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide {
    transform: unset !important;
    opacity: 0.2;
    transform: scale(0.9);
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), transform 0.8s ease-in-out;
  }
  .home-container .container.new-hero-banner .slick-list .slick-active {
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.8s cubic-bezier(0.4, 0, 0.2, 1), transform 0.8s ease-in-out;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide {
    position: relative;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide img.banner-provider-image {
    width: 40px;
    height: 40px;
    right: 12px;
    border-radius: 4.62px;
    top: 78px;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide img.banner-provider-image.img-2x3 {
    right: 33px;
    top: 53px;
    width: 32px;
    height: 32px;
    border-radius: 2.78px;
    border: 0.35px solid rgb(86, 67, 114);
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide img.banner-provider-image.img-3x4 {
    right: 16.48px;
    top: 63.48px;
    border: 0.38px solid rgb(86, 67, 114);
    width: 34.539680481px;
    height: 34.539680481px;
    border-radius: 3px;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper {
    left: 12px;
    top: 78px;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper.img-2x3 {
    left: 33.3px;
    top: 53px;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper.img-3x4 {
    left: 16.3px;
    top: 62px;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper .live-tag {
    padding: 0 8px;
    font-size: 16px;
  }
  .home-container .container.new-hero-banner .slick-list .slick-slide .crown-live-wrapper .live-tag .dot {
    width: 10px;
    height: 10px;
  }
  .home-container .container.new-hero-banner .button-container {
    z-index: 2;
  }
  .home-container .container.new-hero-banner .button-container.flex-block {
    display: flex;
    justify-content: center;
  }
  .home-container .container.new-hero-banner .content-meta-container {
    width: 100%;
  }
  .home-container .container.new-hero-banner .content-meta-container {
    width: 100%;
    z-index: 2;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster {
    width: 180px;
    max-width: 100%;
    height: 56px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classa {
    max-width: 280px;
    height: auto;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classb {
    height: 50px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classc {
    height: 75px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classd {
    height: 80px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classe {
    height: 90px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-name-poster.classf {
    height: 110px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info {
    font-size: 16px;
    line-height: 19.2px;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info .star-icon {
    width: 15px !important;
    height: 15px !important;
    display: inline-flex;
  }
  .home-container .container.new-hero-banner .content-meta-container .meta-wrapper .content-info .star-icon img {
    margin-right: 4px;
    position: relative;
    top: 2px;
  }
  .home-container .container.new-hero-banner .empty-btn {
    height: 36px;
  }
  .home-container .container.new-hero-banner .play-now-btn .btn::before {
    width: 12px;
    height: 12px;
    margin-right: 9.83px;
  }
  .home-container .container.new-hero-banner .play-now-btn .btn {
    min-width: 156px;
    height: 36px;
    padding: 0 20px;
    justify-content: center;
    font-size: 16px;
  }
  .home-container .container.new-hero-banner .watchlist-container .watchlist-btn {
    height: 36px;
    min-width: 44px;
  }
  .home-container .container.new-hero-banner .watchlist-container .watchlist-btn .button-icon .icon-check::before {
    font-size: 12px;
    color: #FFFFFF;
  }
  .home-container .container.new-hero-banner .watchlist-container .watchlist-btn .button-icon .add-icon {
    width: 12px !important;
    height: 12px !important;
  }
  .home-container .container.new-hero-banner .watchlist-container .watchlist-btn .button-icon .tick-icon {
    width: 12px !important;
    height: 12px !important;
  }
  .home-container .container.new-hero-banner .banner-gradient {
    z-index: 1;
    height: 179px;
    border-radius: 0;
    width: 101%;
    max-width: 101%;
    height: 246px;
    max-width: 100%;
  }
  .home-container .container.new-hero-banner .top-gradient {
    height: 147px;
    position: absolute;
    top: 0;
    z-index: 1;
    width: 101%;
    max-width: 101%;
    border-radius: 0;
  }
  @keyframes slideRightToLeft {
    0% {
      transform: translateX(100%);
    }
    100% {
      transform: translateX(0);
    }
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.detail-container {
  width: 100%;
  position: relative;
  min-height: 370px;
}
.detail-container .listing-container {
  top: 0;
  z-index: 1;
}

.detail-container.empty-pi-rail {
  padding-bottom: 5.3%;
}

.detail {
  min-height: 100px;
  width: 53%;
  padding: 0 0 45px 2.8%;
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: 2;
  padding-top: 5px;
}
.detail .detail-title .heading-title {
  font-size: 26px;
  font-family: volte_medium;
  color: #ffffff;
  line-height: 120%;
}
.detail .episode-free {
  font-size: 12px;
  background-color: #6B00DD;
  color: #fff;
  padding: 2px 5px;
  font-family: volte_medium;
  font-weight: 400;
  width: 144px;
  line-height: 14.4px;
}
.detail h3 {
  font-size: 26px;
  font-family: volte_medium;
  color: #ffffff;
  margin-top: 10%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.detail span.description {
  font-family: volte_reg;
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 120%;
  color: #ffffff;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}
.detail .detail-list {
  margin-bottom: 11px;
  display: flex;
  align-items: center;
}
.detail .detail-list span {
  display: inline-block;
  font-size: 16px;
  color: #ffffff;
  font-family: volte_medium;
  margin-right: 10px;
  align-content: center;
}
.detail .detail-list span.age-resptriction {
  border: 1px solid #ffffff;
  border-radius: 8px;
  padding: 1px 6px;
  line-height: 19px;
  padding: 3px 7px 0px;
}
.detail .tvod-expiry {
  color: #E56C6C;
  margin-bottom: 7px;
}
.detail .detail-title {
  display: flex;
  align-items: center;
  margin-bottom: 10px;
  margin-top: 10px;
  width: 100%;
}
.detail .detail-title img {
  width: 14%;
}
.detail .detail-title img.tatasky {
  width: 16%;
  margin-right: 6px;
}
.detail .detail-title img.circular-img {
  width: 40px;
  height: 40px;
  vertical-align: -11px;
  margin-right: 10px;
  border-radius: 100%;
  background-color: #000000;
  align-self: flex-start;
}
.detail .detail-title img.prime {
  width: 24px;
  margin-right: 5px;
  vertical-align: -7px;
}
.detail .detail-title .heading-title {
  font-size: 26px;
  line-height: 26px;
  color: #ffffff;
}
.detail .detail-title .crown-logo {
  margin-left: 10px;
  align-self: center;
  width: 24px;
  height: 24px;
}
.detail .pi-detail-lang .language-text {
  font-family: volte_medium;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  color: #ffffff;
}
.detail .pi-detail-lang .bullet-points {
  height: 6px;
  width: 6px;
  background-color: #ffffff;
}
.detail .language-section div {
  display: flex;
}
@media only screen and (min-width: 760px) and (max-width: 1260px) {
  .detail .language-section .audioImg {
    margin: -3px;
  }
}
.detail .detail-button {
  width: 100%;
  display: flex;
  margin-bottom: 20px;
  min-height: 60px;
}
.detail .detail-button .prime-entitled {
  background: #8e81a1;
  border: 2px solid #8e81a1;
}
.detail .detail-button .prime-entitled:hover {
  border: 2px solid #ffffff;
  transition: 0ms;
}
.detail .detail-button .website-button-configure {
  display: flex;
  margin-right: 20px;
}
.detail .detail-button .website-button-configure a > button {
  background: transparent;
  border: 1px solid #f3cbe3;
  font-family: volte_semiBold;
}
.detail .detail-button .website-button-configure .primary-btn:first-child {
  width: 197px;
}
.detail .detail-button .detail-button-container {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.detail .detail-button .detail-button-container .trailer-btn {
  background: transparent !important;
  border: 2px solid #f3cbe3;
  font-weight: 600;
  font-size: 16px;
  color: #F3CBE3;
}
.detail .detail-button .detail-button-container .trailer-btn:hover {
  background: #ffffff !important;
  color: #E796C7;
}
.detail .detail-button .detail-button-container .apple-btn {
  width: 201px;
  height: 46px;
  border: 2px solid #FFA800;
  background: none;
  border-radius: 100px;
}
.detail .detail-button .detail-button-container .apple-btn .button-text {
  background: linear-gradient(270deg, #FFA800 0%, #FFF389 45.31%, #FFA800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.detail .detail-button .detail-button-container .apple-btn:hover {
  width: 221px;
  height: 50.6px;
  padding: 14.3px 33px;
  border-radius: 110px;
  border: 2px solid #ffffff;
  transition: unset;
}
.detail .detail-button button {
  min-width: 165px;
  border-radius: 4px;
  font-size: 16px;
  font-family: volte_semiBold;
  cursor: pointer;
  border: 2px solid #e10092;
  line-height: 16px;
  padding: 13px;
  height: 45px;
}
@media only screen and (min-width: 760px) and (max-width: 1260px) {
  .detail .detail-button button {
    min-width: 185px;
    padding: 4px;
  }
}
.detail .detail-button button:hover {
  min-width: 185px;
  height: 50px;
  color: #ffffff;
  border: 2px solid #ffffff;
  transition: 0ms;
}
.detail .detail-button button.play-btn:before {
  content: "";
  background: url(/6ca05bdf64bd91c43817087438f4c192.svg);
  display: inline-block;
  width: 14px;
  height: 17px;
  margin-right: 9px;
  background-repeat: no-repeat;
  vertical-align: bottom;
}
.detail .detail-button button.icon-replay {
  position: relative;
  font-family: volte_semiBold !important;
  padding: 10px;
}
.detail .detail-button button.icon-replay .button-icon {
  position: relative;
  left: -6%;
}
.detail .detail-button button.icon-replay .button-icon .icon-replay {
  font-size: 20px;
}
.detail .detail-button button.icon-replay .button-icon .icon-replay .path1:before {
  opacity: 1;
}
.detail .detail-button button.icon-replay .button-text {
  position: relative;
  top: -4px;
}
.detail .detail-button .detail-button-container .pi_btn_wrapper {
  min-width: 320px;
  height: 72px;
  border-radius: 4px;
  background: #e10092;
  padding: 12px 16px 12px 16px;
  margin-top: -10px;
  color: #ffffff;
  text-align: center;
  font-family: volte_medium;
}
.detail .detail-button .detail-button-container .pi_btn_wrapper:hover {
  min-width: 320px;
  height: 72px;
  color: #ffffff;
  border: 2px solid #ffffff;
  transition: 0ms;
}
.detail .detail-button .detail-button-container .pi_btn_wrapper .pi_btn_primary {
  margin-bottom: 4px;
}
.detail .detail-button .detail-button-container .pi_btn_wrapper .pi_btn_primary img {
  width: 20px;
  height: 20px;
}
.detail .detail-button .detail-button-container .pi_btn_wrapper .pi_btn_primary span {
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  vertical-align: top;
  margin-left: 4px;
}
.detail .detail-button .detail-button-container .pi_btn_wrapper .pi_btn_secondary {
  font-size: 16px;
  font-weight: 600;
  line-height: 19.2px;
  margin-top: 4px;
}
.detail .detail-button .detail-button-container .trailer-btn {
  border-radius: 4px;
  margin-left: 20px;
}
.detail .movieButtonRight .movieBlock {
  display: flex;
  grid-template-columns: 1fr 1fr 1fr;
  grid-gap: 18px;
}
.detail .movieButtonRight .movieButtonContainer {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.detail .movieButtonRight .movieButtonContainer .imagesBlock {
  width: 24px;
  height: 24px;
}
.detail .movieButtonRight .icon-Binge-list::before {
  color: #ffffff !important;
}
.detail .movieButtonRight .icon-Binge-list-added:before {
  content: "\e9ef";
  color: #e10092;
}
.detail .movieButtonRight .icon-check:before {
  color: #ffffff !important;
}
.detail .movieButtonRight .icon-share::before {
  color: #ffffff !important;
}
.detail .movieButtonRight i.imagesBlock {
  font-size: 19px;
}
.detail .movieButtonRight .textBlock {
  opacity: 0.7;
  font-size: 12px;
  font-family: volte_reg;
  padding-top: 10px;
  text-align: center;
  overflow: hidden;
  width: 110px;
  min-width: 60px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  align-items: center;
  color: #ffffff;
}
.detail .movieButtonRight .textBlock:hover {
  font-weight: 600;
  opacity: 1;
  transition: 0ms;
}
.detail .movieButtonRight .movieButtonContainer:nth-child(3) > span {
  padding-top: 9.8px;
}
.detail .detail-info li {
  color: #ffffff;
  margin-bottom: 10px;
  font-family: volte_reg;
  font-size: 19px;
  line-height: 1.25;
  display: flex;
}
.detail .detail-info li span:first-child {
  font-family: volte_medium;
  font-size: 20px;
  width: 121px;
  text-transform: capitalize;
  vertical-align: top;
}
.detail .detail-info li span:last-child {
  width: 375px;
}
.detail .detail-info .tvod-expiry {
  color: #e5007d;
}
.detail .tooltip-text {
  width: 200px;
  position: absolute;
  left: 60px;
  top: 30%;
}

.detail-background {
  position: absolute;
  width: 64.3%;
  min-height: 462px;
  right: 0;
  top: -8%;
  background-size: cover;
  background-repeat: no-repeat;
}
.detail-background img {
  width: 100%;
  max-height: 462px;
  position: absolute;
}
.detail-background:before {
  z-index: 1;
  content: "";
  display: inline-block;
  position: absolute;
  width: 130%;
  height: 462px;
  top: 0;
  right: 0;
  background-image: linear-gradient(90deg, #020005 35.35%, rgba(29, 30, 48, 0) 100%);
}

.fav {
  width: 50px;
  display: inline-block;
  height: 50px;
  vertical-align: top;
  background-color: #444764;
  border-radius: 100%;
  position: relative;
  cursor: pointer;
}
.fav span {
  position: absolute;
  top: 27%;
  font-size: 20px;
  left: 31%;
}
.fav:hover {
  background-color: #5087c7;
}

.displayNone {
  display: none;
}

.desc {
  width: 100%;
  position: relative;
  max-width: 420px;
}
.desc .more-content {
  width: 110%;
  min-height: 6vh;
}
.desc .more-content > span > span:first-child {
  display: inline !important;
}
.desc .more-content > span > span:first-child .alwaysVisible {
  display: none !important;
}
.desc .more-content > span > span:last-child {
  position: static !important;
  visibility: visible !important;
}
.desc .more-less {
  margin: 0px 10px;
  border-radius: 20px;
  line-height: 120%;
  padding: 1px 7px 1px 5px;
  font-size: 13px;
  font-family: "sky_reg";
  height: 18px;
  width: 49px;
  color: #f3cbe3;
  border: 1px solid #f3cbe3;
}
.desc .more-less.visible-always {
  position: static;
  visibility: visible;
}

.no-content {
  width: 100%;
  height: 100px;
  font-family: volte_medium;
  /* background-color: red; */
  position: relative;
  top: 115px;
  bottom: 0;
  left: 0;
  font-size: 18px;
  color: white;
  margin: auto;
  text-align: center;
}

.broken-image {
  box-shadow: none !important;
  background-color: transparent !important;
}

.series-icon {
  font-size: 24px;
  position: absolute;
  left: 114px;
  top: 185px;
}

@media (min-width: 1600px) {
  .detail-background img {
    width: 99.5%;
    max-height: 462px;
  }
}
.upgrade-modal .icon-upgrade1,
.upgrade-modal .icon-my-subscription-1 {
  font-size: 82px;
}
.upgrade-modal h1,
.upgrade-modal p {
  font-family: volte_reg !important;
}

@media only screen and (max-width: 769px) {
  .detail {
    padding: 0 0 0 0;
  }
  .detail .mobile-border-bottom {
    border-bottom: 1px solid #564372;
    width: 100%;
    margin: 0 auto;
  }
  .detail .movieButtonRight {
    width: 100%;
  }
  .detail .movieButtonRight .movieButtonContainer {
    cursor: pointer;
    margin-top: 18px;
    margin-bottom: 18px;
    margin-right: 0;
  }
  .detail-container {
    margin-bottom: 0;
  }
  .detail-container .detail-background {
    position: relative;
    height: 200px;
    width: 100%;
    min-height: auto;
  }
  .detail-container .detail-background:before {
    z-index: 0;
    height: 443px;
    background-image: radial-gradient(circle at 53% 6%, rgba(29, 30, 48, 0.1), #1d1e30 52%, #1d1e30 60%);
  }
  .detail-container .detail {
    background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
    width: 100%;
    min-height: auto !important;
    margin-bottom: 15px;
  }
  .detail-container .detail h3 {
    margin-top: 5%;
    font-size: 30px;
  }
  .detail-container .detail .mobile-detail-section {
    padding: 0 2.8%;
    margin-top: 16px;
    margin-bottom: 7px;
  }
  .detail-container .detail .mobile-detail-section .heading-title {
    font-size: 22px;
    color: white;
  }
  .detail-container .detail .mobile-detail-section .image-crown-logo {
    flex: 1;
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
  }
  .detail-container .detail .mobile-detail-section .image-crown-logo .crown-logo {
    width: 24px;
    height: 24px;
    margin-top: 2px;
    position: relative;
    right: 0px;
  }
  .detail-container .detail .mobile-detail-section img.circular-img {
    width: 45px;
    height: 45px;
    border-radius: 42px;
    margin-right: 11px;
  }
  .detail-container .detail .episode-free-handling {
    margin-top: 10px !important;
  }
  .detail-container .detail .detail-list {
    margin-bottom: 5px;
    margin-top: 5px;
    align-items: center;
  }
  .detail-container .detail .detail-list span {
    font-size: 13px;
  }
  .detail-container .detail .detail-list span.age-resptriction {
    padding: 1px 5px;
  }
  .detail-container .detail .detail-button {
    margin-bottom: 0px;
  }
  .detail-container .detail .detail-button .detail-button-container {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .detail-container .detail .detail-button .detail-button-container .trailer-btn:hover {
    border: 2px solid #f3cbe3 !important;
    color: #f3cbe3;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure {
    padding: 0 2.8%;
    margin-bottom: unset;
    display: flex;
    justify-content: space-around;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure button {
    flex: 1;
    margin-left: 6px;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure button:hover {
    border: 2px solid #e10092;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.no-trailer {
    flex-direction: column;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.no-trailer .apple-btn {
    margin-top: 12px;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.no-trailer .apple-btn:hover {
    border: 2px solid #FFA800;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.no-trailer button {
    min-width: none;
    width: 100%;
    margin: 0;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.no-trailer button:hover {
    border: 2px solid #e10092;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.no-trailer button.prime-entitled:hover {
    border: 2px solid #8e81a1;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta {
    flex-direction: column;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta .pi_btn_wrapper {
    min-width: 300px;
    height: 61px;
    margin-top: unset;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta .pi_btn_wrapper:hover {
    border: 2px solid #e10092;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta .pi_btn_wrapper .pi_btn_primary img {
    width: 16px;
    height: 16px;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta .pi_btn_wrapper .pi_btn_primary span {
    font-size: 16px;
    line-height: 19.2px;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta .pi_btn_wrapper .pi_btn_secondary {
    font-size: 12px;
    line-height: 14.4px;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-button-configure.pi_page_cta .trailer-btn {
    margin-left: unset;
    margin-top: 14px;
  }
  .detail-container .detail .detail-button .detail-button-container .mobile-border-bottom {
    width: 100vw;
    margin-left: -10px;
  }
  .detail-container .detail .detail-button button {
    padding: 13px 0;
    height: auto;
    margin-right: 6px;
    font-size: 16px;
    min-height: 36px;
  }
  .detail-container .detail .detail-button button.icon-replay .button-icon .icon-replay {
    font-size: 20px;
  }
  .detail-container .detail .detail-button .fav {
    width: 36px;
    height: 36px;
  }
  .detail-container .detail .detail-button .fav span {
    top: 22%;
    left: 26%;
    font-size: 18px;
  }
  .detail-container .detail .detail-button .fav span.tooltip-text {
    top: 40px;
    left: -5px;
    font-size: 12px;
    width: max-content;
  }
  .detail-container .detail .desc {
    padding: 0 30px;
  }
  .detail-container .detail .movieButtonRight {
    margin-left: -10px;
  }
  .detail-container .detail .movieButtonRight .movieBlock {
    justify-content: center;
    align-items: center;
    background-color: #020005;
    width: 100vw;
  }
  .detail-container .detail .movieButtonRight .movieBlock .textBlock {
    width: 87px;
  }
  .detail-container .detail .detail-info li {
    margin-bottom: 5px;
  }
  .detail-container .detail .detail-info li span:first-child, .detail-container .detail .detail-info li span:last-child {
    font-size: 16px;
  }
  .mobile-detail-section {
    display: flex;
    margin-top: 16px;
  }
  .detail-background img {
    max-width: 100% !important;
    max-height: 100% !important;
  }
}
.more-less {
  margin-left: 2px;
}

@media only screen and (min-width: 770px) and (max-width: 1120px) {
  .detail-container .detail-background:before {
    height: 462px;
  }
  .detail-container.empty-pi-rail {
    padding-bottom: 12%;
  }
  .detail {
    width: 65%;
    min-height: auto;
  }
  .detail h3 {
    margin-top: 5%;
  }
  .detail .detail-list {
    margin-bottom: 10px;
  }
  .detail .detail-button {
    margin-bottom: 0;
  }
  .detail .desc {
    margin-bottom: 5px;
  }
  .detail .detail-info li {
    margin-bottom: 5px;
  }
}
@media only screen and (max-width: 480px) {
  .detail-container {
    top: -45px;
    margin-bottom: -2.6em;
  }
  .detail-container .detail .detail-list {
    flex-wrap: wrap;
  }
  .detail-container .detail .episode-free {
    font-size: 10px;
    padding: 2px 3px;
    font-weight: 500;
    width: 116px;
    margin-top: 15px;
    margin-left: 20px;
    line-height: 12px;
  }
  .detail-container .tvod-expiry {
    margin-left: 20px;
    font-weight: 400;
    font-size: 13px;
    line-height: 120%;
    font-family: volte_medium;
  }
  .pi-page-bottom-sheet .react-swipeable-view-container {
    transform: translate(0px, -100%) !important;
  }
  .crown-logo {
    position: absolute;
    right: 10px;
  }
  .trailer-btn {
    margin-left: 15px;
  }
  .description {
    width: 95%;
    display: inline-block;
    overflow: visible !important;
  }
  .pi-detail-lang {
    padding: 0 2.8%;
    margin-top: 15px;
    margin-bottom: 15px;
  }
  .pi-detail-lang .language-text {
    font-size: 12px !important;
    line-height: 14px !important;
    font-style: normal;
    font-weight: 500;
    letter-spacing: 0.188173px;
    color: #ffffff;
  }
  .mobile-button-configure.pi_page_cta {
    margin-bottom: 13px !important;
  }
  .mobile-button-configure .play-btn {
    margin-bottom: 13px !important;
  }
  .mobile-button-configure .play-btn.prime-entitled {
    margin-bottom: unset !important;
  }
  .mobile-button-configure a button {
    margin-right: 0 !important;
  }
  .detail-background {
    margin-top: 45px;
  }
  .detail-background img {
    max-width: 100% !important;
    min-height: 100% !important;
  }
  .desc {
    padding: 0 2.8% !important;
  }
  .desc .more-less {
    padding: 1px 7px 1px 5px;
    font-size: 12px;
  }
}
@media only screen and (max-width: 373px) {
  .detail-container .detail .detail-list span {
    font-size: 12px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

@media only screen and (max-width: 480px) {
  .qr-login-container {
    padding: 0px 20px 30px 20px;
  }
  .qr-login-container .header-logo img {
    height: 20px;
    width: 85px;
    object-fit: cover;
  }
  .qr-login-container .login-license {
    padding: 24px 0;
  }
  .qr-login-container .login-license .heading {
    color: #ffffff;
    font-family: volte_medium;
    font-style: normal;
    font-weight: 500;
    text-align: center;
    font-size: 20px;
    line-height: 24px;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .qr-login-container .login-license .sub-heading {
    font-family: volte_medium;
    font-size: 14px;
    font-weight: 500;
    line-height: 15.4px;
    text-align: center;
    color: #C7C0CF;
    margin: 0;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .qr-login-container .redirect-code {
    padding-bottom: 24px;
  }
  .qr-login-container .redirect-code p {
    font-family: volte_semiBold;
    font-size: 30px;
    font-weight: 600;
    line-height: 36px;
    text-align: center;
    color: #ffffff;
    letter-spacing: 12px;
  }
  .qr-login-container .button-container {
    padding-bottom: 24px;
  }
  .qr-login-container .button-container .sign-in-to-tv-btn {
    margin-bottom: 20px !important;
    width: 100%;
    height: 46px;
    border-radius: 4px;
    line-height: 18px;
    padding: 10px;
    margin: 0;
    background-color: #e10092;
    cursor: pointer;
    border: none !important;
    outline: none;
  }
  .qr-login-container .button-container .sign-in-to-tv-btn .button-text {
    font-family: volte_semiBold;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 19px;
    text-align: center;
    color: #ffffff;
  }
  .qr-login-container .button-container .cancel-cta {
    cursor: pointer;
    font-family: volte_semiBold;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 120%;
    color: #f3cbe3;
    font-weight: 600;
  }
  .qr-login-container .footer-text {
    font-family: volte_medium;
    font-size: 14px;
    font-weight: 500;
    line-height: 15.4px;
    text-align: center;
    color: #c7c0cf;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.home-page > div:nth-child(2) > div:nth-child(2) > div > div:nth-child(1) > div {
  background: white;
}

.bottomSheetHeading {
  font-family: volte_medium;
  font-size: 22px;
  color: #ffffff;
  padding-top: 13px;
  padding-bottom: 10px;
  line-height: 120%;
}

.bar {
  width: 35px;
  height: 4px;
  border-radius: 100px;
  background-color: #ffffff;
  margin: 14px auto;
  opacity: 50%;
}

.background-img {
  position: absolute;
  width: 100%;
  height: 400px;
  min-height: 400px;
  right: 0;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  opacity: 0.55;
  top: -14px;
}
.background-img img {
  width: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  height: 100%;
  object-fit: cover;
  object-position: 0%;
}

.bottom-sheet-block {
  height: auto;
}

.bottom-sheet-block-short .bg-wrapper {
  height: 135px;
}

.bottom-shadow {
  position: absolute;
  bottom: 0;
  height: 84px;
  width: 100%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 50.52%, #000000 100%);
  z-index: 1;
}
.bottom-shadow.drawer-shadow {
  height: 216px;
}

.login-bar {
  margin: 10px auto 20px auto;
}

.ReactSwipeableBottomSheet--open,
.ReactSwipeableBottomSheet--closed {
  max-height: inherit !important;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.fullscreen-bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(69.87deg, #070316 43.33%, #130837 71.53%) !important;
  overflow: hidden;
  z-index: 999999;
}

.fullscreen-bg__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100%;
  z-index: 999998;
  background: linear-gradient(69.87deg, #070316 43.33%, #130837 71.53%) !important;
}

.splash-type-image {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  object-fit: cover;
  /* Makes sure the image covers the container */
  object-position: center;
  overflow: hidden;
  z-index: 999999;
}

@media (min-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    height: 300%;
    top: -100%;
  }
}
@media (max-aspect-ratio: 16/9) {
  .fullscreen-bg__video {
    width: 300% !important;
    left: -100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.partner-nudge {
  width: 100%;
}
.partner-nudge .thumbnail {
  width: 570px;
  height: 92px;
  margin: auto;
  text-align: center;
  margin-top: 10px;
  margin-bottom: 20px;
}
.partner-nudge .thumbnail img {
  z-index: 2;
  position: relative;
  cursor: pointer;
  width: 100%;
}

@media only screen and (max-width: 480px) {
  .partner-nudge .thumbnail {
    width: 100%;
    padding: 0 10px;
    height: 79px;
    margin-top: 14px;
    margin-bottom: 13px;
  }
  .partner-nudge .thumbnail img {
    height: 100%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.live-detail-container {
  width: 100%;
  position: relative;
  min-height: 370px;
}

.live-detail {
  min-height: 100px;
  width: 53%;
  padding: 0 0 45px 2.8%;
  position: relative;
  display: flex;
  flex-direction: column;
  z-index: 2;
  padding-top: 35px;
}
.live-detail .live-detail-title {
  display: flex;
  align-items: center;
  margin: 20px 0 20px 0;
  width: 100%;
}
.live-detail .live-detail-title .live-detail-description {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  color: #FFFFFF;
}
.live-detail .live-detail-title .live-detail-description .live-block {
  display: flex;
}
.live-detail .live-detail-title .live-detail-description .live-block span {
  margin-left: 10px;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 142%;
  color: #C4C4C4;
}
.live-detail .live-detail-title .live-detail-description .live-audio {
  margin-top: 10px;
  display: flex;
}
.live-detail .live-detail-title .live-detail-description .live-audio img {
  width: 20px;
  height: 20px;
  margin-right: 8px;
}
.live-detail .live-detail-title .live-detail-description .live-audio span:first-child {
  line-height: 25px;
}
.live-detail .live-detail-title .live-detail-description .live-audio span.audio {
  color: #C4C4C4;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
}
.live-detail .live-detail-title .live-detail-description .powered-by {
  display: inline-flex;
}
.live-detail .live-detail-title .live-detail-description .powered-by span {
  font-family: volte_reg;
  font-size: 12px;
  font-weight: 500;
  line-height: 14.4px;
  text-align: center;
  margin: 1px 6px 0px 0px;
}
.live-detail .live-detail-title .live-detail-description .powered-by img {
  width: auto;
  height: 12px;
}
.live-detail .live-detail-title .heading-title {
  font-size: 26px;
  font-family: volte_medium;
  color: #ffffff;
  line-height: 120%;
  font-weight: 500;
  margin-bottom: 5px;
}
.live-detail .live-detail-title img {
  width: 14%;
}
.live-detail .live-detail-title img.circular-img {
  width: 60px;
  height: 60px;
  background: #FFFFFF;
  border-radius: 50%;
  margin-right: 14px;
  vertical-align: -11px;
  align-self: flex-start;
}
.live-detail h3 {
  font-size: 26px;
  font-family: volte_medium;
  color: #ffffff;
  margin-top: 10%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.live-detail .live-detail-tag {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  text-align: right;
  padding: 2px 3px;
  border-radius: 2px;
  width: auto;
  height: 23px;
  background: #6B00DD;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  color: #FFFFFF;
}
.live-detail .live-detail-tag::before {
  content: "";
  -webkit-border-radius: 0.375rem;
  border-radius: 50%;
  height: 5px;
  width: 5px;
  margin-right: 4px;
  background-color: #E56C6C;
}

.live-detail-background {
  position: absolute;
  width: 64.3%;
  min-height: 462px;
  right: 0px;
  top: -18%;
  background-size: cover;
  background-repeat: no-repeat;
}
.live-detail-background img {
  width: 100%;
  max-height: 462px;
  position: absolute;
}
.live-detail-background:before {
  z-index: 1;
  content: "";
  display: inline-block;
  position: absolute;
  width: 160%;
  height: 462px;
  top: 0;
  right: 0;
  background-image: linear-gradient(90deg, #020005 35.35%, rgba(29, 30, 48, 0) 100%);
}

.detail-button {
  width: 100%;
  display: flex;
  margin-bottom: 20px;
}
.detail-button .website-button-configure {
  display: flex;
  margin-right: 20px;
}
.detail-button .website-button-configure a > button {
  background: transparent;
  border: 1px solid #f3cbe3;
  font-family: volte_semiBold;
}
.detail-button .detail-button-container {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.detail-button .detail-button-container .trailer-btn {
  background: transparent !important;
  border: 2px solid #f3cbe3;
  font-weight: 600;
  font-size: 16px;
  color: #F3CBE3;
}
.detail-button .detail-button-container .trailer-btn:hover {
  border: 2px solid #ffffff;
  color: #ffffff;
}
.detail-button .detail-button-container .live_btn_wrapper {
  min-width: 320px;
  height: 72px;
  border-radius: 4px;
  background: #e10092;
  padding: 12px 16px 12px 16px;
  margin-top: unset;
  color: #ffffff;
  text-align: center;
  font-family: volte_medium;
  cursor: pointer;
}
.detail-button .detail-button-container .live_btn_wrapper:hover {
  color: #ffffff;
  border: 2px solid #ffffff;
  transition: 0ms;
  min-width: 320px;
  height: 72px;
}
.detail-button .detail-button-container .live_btn_wrapper .live_btn_primary {
  margin-bottom: 4px;
}
.detail-button .detail-button-container .live_btn_wrapper .live_btn_primary img {
  width: 20px;
  height: 20px;
}
.detail-button .detail-button-container .live_btn_wrapper .live_btn_primary span {
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
  vertical-align: top;
  margin-left: 4px;
}
.detail-button .detail-button-container .live_btn_wrapper .live_btn_secondary {
  font-size: 16px;
  font-weight: 600;
  line-height: 19.2px;
  margin-top: 4px;
}
.detail-button button {
  min-width: 280px;
  border-radius: 4px;
  font-size: 16px;
  font-family: volte_semiBold;
  cursor: pointer;
  border: 2px solid #e10092;
  line-height: 16px;
  padding: 13px;
  height: 45px;
}
.detail-button button:hover {
  color: #ffffff;
  border: 2px solid #ffffff;
  transition: 0ms;
  min-width: 300px;
  height: 50px;
}
.detail-button button.play-btn:before {
  content: "";
  background: url(/6ca05bdf64bd91c43817087438f4c192.svg);
  display: inline-block;
  width: 14px;
  height: 17px;
  margin-right: 9px;
  background-repeat: no-repeat;
  vertical-align: bottom;
}
.detail-button button.icon-replay {
  position: relative;
  font-family: volte_semiBold !important;
  padding: 10px;
}
.detail-button button.icon-replay .button-icon {
  position: relative;
  left: -6%;
}
.detail-button button.icon-replay .button-icon .icon-replay {
  font-size: 20px;
}
.detail-button button.icon-replay .button-icon .icon-replay .path1:before {
  opacity: 1;
}
.detail-button button.icon-replay .button-text {
  position: relative;
  top: -4px;
}

@media (min-width: 1600px) {
  .live-detail-background img {
    width: 99.5%;
    max-height: 462px;
  }
}
@media only screen and (max-width: 769px) {
  .live-detail {
    padding: 16px 2.8%;
  }
  .live-detail .mobile-border-bottom {
    border-bottom: 1px solid #564372;
    width: 90%;
    margin: 0 auto;
  }
  .live-detail .live-detail-tag {
    height: 16px;
    font-size: 10px;
    border-radius: 2px;
    font-weight: 100;
    line-height: 1px;
  }
  .live-detail .live-detail-title {
    margin: 0 0 16px 0;
  }
  .live-detail .live-detail-title .live-detail-description {
    font-size: 13px;
  }
  .live-detail .live-detail-title .live-detail-description .live-block span {
    font-size: 12px;
    margin-left: 4px;
  }
  .live-detail .live-detail-title .live-detail-description .live-audio {
    margin-top: 4px;
  }
  .live-detail .live-detail-title .live-detail-description .live-audio img {
    width: 10px;
    height: 10px;
    margin-right: 4px;
  }
  .live-detail .live-detail-title .live-detail-description .live-audio span:first-child {
    line-height: 17px;
  }
  .live-detail .live-detail-title .live-detail-description .live-audio span.audio {
    font-size: 12px;
    line-height: 120%;
  }
  .live-detail .live-detail-title .heading-title {
    font-size: 22px;
    margin-bottom: 4px;
  }
  .live-detail .live-detail-title img {
    width: 14%;
  }
  .live-detail .live-detail-title img.circular-img {
    width: 60px;
    height: 60px;
  }
  .live-detail-container {
    margin-bottom: 0;
  }
  .live-detail-container .live-detail-background {
    position: relative;
    height: 200px;
    width: 100%;
    min-height: auto;
    right: 0;
  }
  .live-detail-container .live-detail-background:before {
    z-index: 0;
    height: 370px;
    background-image: radial-gradient(circle at 53% 6%, rgba(29, 30, 48, 0.1), #1d1e30 52%, #1d1e30 60%);
  }
  .live-detail-container .live-detail {
    background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
    width: 100%;
    min-height: auto !important;
    margin-bottom: 15px;
  }
  .live-detail-container .live-detail h3 {
    margin-top: 5%;
    font-size: 30px;
  }
  .live-detail-container .live-detail .detail-list {
    margin-bottom: 5px;
    margin-top: 5px;
    align-items: center;
  }
  .live-detail-container .live-detail .detail-list span {
    font-size: 13px;
  }
  .live-detail-background img {
    max-width: 100% !important;
    max-height: 100% !important;
  }
  .detail-button {
    margin-bottom: 0px;
  }
  .detail-button .detail-button-container {
    width: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .detail-button .detail-button-container .trailer-btn:hover {
    border: 2px solid #f3cbe3 !important;
    color: #f3cbe3;
  }
  .detail-button .detail-button-container .mobile-button-configure {
    padding: 0 20px;
    margin-bottom: 20px;
    display: flex;
    justify-content: space-around;
  }
  .detail-button .detail-button-container .mobile-button-configure button {
    flex: 1;
    margin-left: 6px;
  }
  .detail-button .detail-button-container .mobile-button-configure button:hover {
    border: 2px solid #e10092;
  }
  .detail-button .detail-button-container .mobile-button-configure.no-trailer button {
    min-width: none;
    width: 100%;
  }
  .detail-button .detail-button-container .mobile-button-configure.no-trailer button:hover {
    border: 2px solid #e10092;
  }
  .detail-button button {
    padding: 13px 0;
    height: auto;
    margin-right: 6px;
    font-size: 16px;
    min-height: 36px;
    width: 100%;
  }
  .detail-button button.icon-replay .button-icon .icon-replay {
    font-size: 20px;
  }
  .detail-button .fav {
    width: 36px;
    height: 36px;
  }
  .detail-button .fav span {
    top: 22%;
    left: 26%;
    font-size: 18px;
  }
  .detail-button .fav span.tooltip-text {
    top: 40px;
    left: -5px;
    font-size: 12px;
    width: max-content;
  }
}
@media only screen and (min-width: 770px) and (max-width: 1120px) {
  .live-detail-container .live-detail-background:before {
    height: 420px;
  }
  .live-detail {
    width: 65%;
    min-height: auto;
  }
  .live-detail h3 {
    margin-top: 5%;
  }
  .detail-button {
    margin-bottom: 0;
  }
}
@media only screen and (max-width: 480px) {
  .live-detail-container {
    top: -45px;
    margin-bottom: -2.6em;
  }
  .live-detail-background {
    margin-top: 45px;
  }
  .live-detail-background img {
    max-width: 100% !important;
    min-height: 100% !important;
  }
  .detail-button .detail-button-container .live_btn_wrapper {
    min-width: 300px;
    height: 61px;
    margin-top: unset;
  }
  .detail-button .detail-button-container .live_btn_wrapper:hover {
    border: unset;
    height: 61px;
  }
  .detail-button .detail-button-container .live_btn_wrapper .live_btn_primary img {
    width: 16px;
    height: 16px;
  }
  .detail-button .detail-button-container .live_btn_wrapper .live_btn_primary span {
    font-size: 16px;
    line-height: 19.2px;
  }
  .detail-button .detail-button-container .live_btn_wrapper .live_btn_secondary {
    font-size: 12px;
    line-height: 14.4px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.amazon_wrapper .amazon_interstitial_Poster_Wrapper {
  width: 88%;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 40px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_poster_wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center;
  aspect-ratio: 1/0.133;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_poster_wrapper div {
  margin-right: 4px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_poster_wrapper div img {
  border-radius: 8px;
  width: 100%;
  height: 100%;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_logo_wrapper {
  width: 100%;
  text-align: center;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_logo_wrapper .amazon_logo {
  width: 180px;
  height: 60px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_description {
  display: block;
  font-weight: 500;
  font-size: 18.5px;
  font-family: volte_medium;
  color: #ffffff;
  line-height: 21.6px;
  text-align: center;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 30px;
  margin-bottom: 20px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper button {
  padding: 13px;
  border-radius: 4px;
  color: #ffffff;
  font-family: volte_semiBold;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper .amazon_primary_btn {
  background: #e10092;
  margin-bottom: 20px;
  border: none;
  width: 460px;
  margin-right: 0px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper .amazon_secondary_btn {
  border: 2px solid #f3cbe3;
  color: #f3cbe3;
  background: none;
  width: 460px;
  margin-right: 0px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_prime_lite {
  width: 79%;
  text-align: center;
  margin-bottom: 25px;
  height: 144px;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_prime_lite img {
  width: 100%;
  height: 100%;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_tnc_wrapper {
  display: flex;
  justify-content: center;
  font-weight: 500;
  font-size: 12px;
  font-family: volte_reg;
  color: #ffffff;
  line-height: 14.4px;
  text-align: center;
  flex-wrap: wrap;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_tnc_wrapper a {
  text-decoration: none;
  color: #E796C7;
  cursor: pointer;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_tnc_wrapper span {
  text-decoration: none;
  color: #E796C7;
  cursor: pointer;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_tnc_desc {
  font-weight: 500;
  font-size: 12px;
  font-family: volte_reg;
  color: #ffffff;
  line-height: 14.4px;
  text-align: center;
}
.amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_footer {
  margin-top: 5px;
  margin-bottom: 20px;
}

@media only screen and (max-width: 480px) {
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper {
    width: 100%;
    margin-bottom: 0px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_poster_wrapper {
    flex-wrap: wrap;
    height: 203px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_poster_wrapper div {
    width: 50%;
    margin-right: unset;
    aspect-ratio: unset;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_poster_wrapper div img {
    border-radius: unset;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_logo_wrapper .amazon_logo {
    width: 144px;
    height: 48px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper {
    margin-top: 20px;
    margin-bottom: 10px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper button {
    font-size: 16px;
    line-height: 19.2px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper .amazon_primary_btn {
    width: 320px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_button_wrapper .amazon_secondary_btn {
    width: 320px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_footer {
    font-size: 14px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper {
    margin: 0px 20px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_description {
    font-size: 16px;
    font-weight: 400;
    line-height: 19.2px;
    font-family: volte_reg;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_prime_lite {
    width: 100%;
    height: 90px;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_prime_lite img {
    width: 100%;
    height: 100%;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_tnc_desc {
    font-size: 10px;
    line-height: 12px;
    font-weight: 500;
  }
  .amazon_wrapper .amazon_interstitial_Poster_Wrapper .amazon_bottom_wrapper .amazon_tnc_wrapper {
    font-weight: 500;
    font-size: 10px;
    line-height: 12px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.interstitial_upper_wrapper .interstitial_poster_wrapper {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: center;
  aspect-ratio: 1/0.133;
}
.interstitial_upper_wrapper .interstitial_poster_wrapper div {
  margin-right: 4px;
}
.interstitial_upper_wrapper .interstitial_poster_wrapper div img {
  border-radius: 8px;
  width: 100%;
  height: 100%;
}
.interstitial_upper_wrapper .interstitial_poster_wrapper.no_steps_poster_wrapper {
  display: flex;
  flex-wrap: wrap;
  width: 600px;
  height: 338px;
}
.interstitial_upper_wrapper .interstitial_poster_wrapper.no_steps_poster_wrapper div {
  width: 50%;
  height: 50%;
  margin: unset;
}
.interstitial_upper_wrapper .interstitial_poster_wrapper.no_steps_poster_wrapper div img {
  border-radius: unset;
}
.interstitial_upper_wrapper .interstitial_logo_wrapper {
  width: 100%;
  text-align: center;
}
.interstitial_upper_wrapper .interstitial_logo_wrapper .interstitial_logo {
  width: 180px;
  height: 60px;
}

.interstitial_poster_wrapper.apple_wrapper div {
  margin-right: unset;
}
.interstitial_poster_wrapper.apple_wrapper div img {
  border-radius: unset;
}

@media only screen and (max-width: 480px) {
  .interstitial_upper_wrapper {
    width: 100%;
  }
  .interstitial_upper_wrapper .interstitial_poster_wrapper {
    flex-wrap: wrap;
    height: 203px;
  }
  .interstitial_upper_wrapper .interstitial_poster_wrapper div {
    width: 50%;
    margin-right: unset;
    aspect-ratio: unset;
  }
  .interstitial_upper_wrapper .interstitial_poster_wrapper div img {
    border-radius: unset;
  }
  .interstitial_upper_wrapper .interstitial_logo_wrapper .interstitial_logo {
    width: 144px;
    height: 48px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.browse-by-container.form-container {
  padding: 50px 0 0 0;
  margin-bottom: -8%;
  margin-top: 0;
}
.browse-by-container .seo-description-container {
  padding: 0 2.8%;
  padding-top: 18px;
}
.browse-by-container .seo-description-container.footer {
  padding: 30px 2.8%;
}
.browse-by-container .seo-hr {
  margin: 30px 0;
}
.browse-by-container .home-faq-container .horizontal-line {
  margin-bottom: 36px;
}
.browse-by-container .listing-block {
  display: inline-flex;
}
.browse-by-container .listing-landscape .listing-block {
  position: relative;
}
.browse-by-container .set-browse-popup {
  margin-top: 0px !important;
}
.browse-by-container .heading-section {
  padding: 0 2.8%;
}
.browse-by-container .heading-section h2 {
  font-size: 20px;
  font-family: volte_medium;
}
.browse-by-container .heading-section h2,
.browse-by-container .heading-section p {
  display: inline-block;
}
.browse-by-container .heading-section p {
  float: right;
}
.browse-by-container .heading-section p.heading-line {
  margin-top: 8px;
  margin-right: 9.3%;
}
.browse-by-container .heading-section p.heading-line:before {
  content: none;
}
.browse-by-container .browse-by-items-section {
  display: flex;
  width: 100%;
  margin-top: 20px;
}
.browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
  grid-template-columns: repeat(7, 1fr);
  grid-gap: 20px 30px;
  padding: 0% 2.8% 33px 2.8%;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv {
  width: 100%;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-gap: 20px;
  width: 100%;
  padding: 0% 2.8%;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block {
  display: block;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
  margin-right: 0;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .listing-item .episode-free {
  border-radius: 0px 0px 8px 0px;
  padding: 6px;
  width: auto;
  right: 0px;
  bottom: 0px;
  font-size: 12px;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover {
  width: 110%;
}
.browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .listing-block .overlap-hover .popover {
  width: 100%;
  margin-left: 11.2px;
}
.browse-by-container .list-heading {
  font-family: volte_medium;
  font-size: 12px;
  letter-spacing: 0.21px;
  color: #a3a6c2;
  padding-left: 0;
  margin-top: 4px;
}
.browse-by-container .language-filter {
  margin-top: 15px;
  overflow: hidden;
  white-space: nowrap;
  margin-bottom: 10px;
  width: 97%;
}
.browse-by-container .language-filter i {
  position: absolute;
  width: 34px;
  height: 34px;
  border: solid 1px #ffffff;
  background-color: #e10092;
  border-radius: 100%;
  cursor: pointer;
}
.browse-by-container .language-filter i:after {
  color: #ffffff;
  top: 7px;
  display: inline-block;
  position: relative;
  left: 11px;
}
.browse-by-container .language-filter .left-icon {
  margin-top: 6px;
}
.browse-by-container .language-filter .left-icon:after {
  content: "<";
}
.browse-by-container .language-filter .right-icon {
  margin-top: 6px;
  right: 2.8%;
}
.browse-by-container .language-filter .right-icon:after {
  content: ">";
}
.browse-by-container .language-filter li {
  cursor: pointer;
  display: inline-block;
  padding: 9px 18px;
  border-radius: 24.5px;
  box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.11), 0 0 2px 0 rgba(0, 0, 0, 0.12);
  font-size: 22px;
  color: #f3cbe3;
  line-height: 1.29;
  margin-right: 13px;
  border: 1px solid #f3cbe3;
  font-weight: 400;
  font-family: volte_reg;
}
.browse-by-container .language-filter li.active {
  background-color: #e5007d;
  border: 1px solid #e5007d;
}
.browse-by-container .language-filter li.active.genre-active {
  color: #ffffff;
}
.browse-by-container .language-filter li.active.genre-active span {
  padding-left: 10px;
  position: relative;
  top: 1.2px;
}
.browse-by-container .language-filter li.active.genre-active span .icon-close {
  position: unset;
  font-size: 17px;
  border: none;
  border-radius: unset;
  background-color: unset;
}
.browse-by-container .language-filter li:hover {
  color: #ffffff;
  border: 1px solid #ffffff;
}
.browse-by-container ul.listing-landscape {
  width: 100%;
}
.browse-by-container ul.listing-landscape .listing-square {
  margin-right: 30px;
  padding-bottom: 116%;
}
.browse-by-container ul.listing-landscape .listing-square .card-image,
.browse-by-container ul.listing-landscape .listing-square .place-holder-image {
  height: 82%;
}
.browse-by-container ul.listing-landscape .listing-square .game-detail {
  height: 16%;
}
.browse-by-container ul.listing-landscape .listing-square .games-favorite {
  width: 30px;
  height: 30px;
  bottom: 22%;
  position: absolute;
}
.browse-by-container ul.listing-landscape li, .browse-by-container ul.listing-landscape.card-image, .browse-by-container ul.listing-landscape.place-holder-image {
  width: 200px;
  height: auto;
  margin-right: 20px;
  margin-bottom: 20px;
  padding-bottom: 54.4%;
}
.browse-by-container ul.listing-landscape li .card-image,
.browse-by-container ul.listing-landscape li .place-holder-image, .browse-by-container ul.listing-landscape.card-image .card-image,
.browse-by-container ul.listing-landscape.card-image .place-holder-image, .browse-by-container ul.listing-landscape.place-holder-image .card-image,
.browse-by-container ul.listing-landscape.place-holder-image .place-holder-image {
  width: 100%;
  height: 100%;
  display: inline-block;
  transform: translateZ(0);
}
.browse-by-container ul.listing-landscape .overlap-hover {
  height: 100%;
}
.browse-by-container ul.listing-landscape .overlap-hover .popover {
  height: fit-content;
  width: 110%;
  margin-left: -11px;
  margin-top: -14px;
  padding-bottom: 5px;
}
.browse-by-container ul.listing-landscape .overlap-hover .popover .image-top {
  height: 67%;
}
.browse-by-container ul.listing-landscape .overlap-hover .popover .image-top img {
  height: 100%;
}
.browse-by-container .no-result-found {
  font-size: 35px;
  font-family: volte_medium;
  margin: auto;
  color: #ffffff;
  text-align: center;
  width: 100%;
  margin-bottom: 40px;
  position: relative;
  margin-top: 2.5%;
}
.browse-by-container .no-result-found p {
  width: 58%;
  margin: auto;
}

.load-more {
  margin-bottom: 25px;
}
.load-more img {
  height: auto;
  width: auto;
  position: inherit;
  cursor: pointer;
}

.filter-container {
  margin-top: 20px;
}
.filter-container .form-group {
  margin: 22px auto;
}

.set-genre-text {
  width: 100%;
  padding: 0 6.9% 30px 2.8%;
  position: absolute;
  display: flex;
  flex-direction: column;
  justify-content: center;
  z-index: 2;
  bottom: 0;
}
.set-genre-text .set-genre-text-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.set-genre-text .set-genre-text-inner h1 {
  font-size: 26px;
  font-family: volte_medium;
  color: #ffffff;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
.set-genre-text .set-genre-text-inner img {
  height: 44px;
  width: 65px;
}

.banner-height {
  height: 250px;
}
.banner-height .banner-on-header {
  position: absolute;
  width: 100%;
  top: 0;
}

.genre-languager-banner {
  position: relative;
  height: 294px;
}
.genre-languager-banner .genre-banner-img {
  position: absolute;
  width: 100%;
  min-height: 294px;
  right: 0;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
}
.genre-languager-banner .genre-banner-img:before {
  z-index: 1;
  content: "";
  display: inline-block;
  position: absolute;
  width: 101%;
  height: 294px;
  top: 0;
  right: 0;
}
.genre-languager-banner .genre-banner-img img {
  width: 100%;
  height: 294px;
  object-fit: fill;
}
.genre-languager-banner .genre-action-wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  bottom: 17px;
}
.genre-languager-banner .genre-action-wrapper .genre-action-image img {
  max-width: 205px;
  max-height: 94px;
  position: unset;
}
.genre-languager-banner .genre-action-wrapper .isGenre {
  bottom: 71px;
  font-size: 26px;
}
.genre-languager-banner .genre-action-wrapper .isGenre h1 {
  font-size: 26px;
  font-family: volte_medium;
}

@media only screen and (max-width: 480px) {
  .browse-by-container .filter-container .form-group {
    margin: 20px auto;
  }
  .browse-by-container .seo-description-container {
    padding: 0 2.8%;
    padding-top: 12px;
    margin: 0;
  }
  .browse-by-container .seo-description-container.footer {
    padding: 0px 2.8%;
    padding-top: 12px;
  }
  .browse-by-container .seo-hr {
    margin: 12px 0;
  }
  .browse-by-container .home-faq-container .horizontal-line {
    margin: 12px auto;
  }
  .browse-by-container ul.listing-landscape {
    width: 100%;
  }
  .browse-by-container ul.listing-landscape .listing-item {
    margin-bottom: 0px;
    padding-bottom: 56.4%;
  }
  .browse-by-container ul.listing-landscape li {
    margin-bottom: 40px;
    margin-right: 0;
  }
  .browse-by-container ul.listing-landscape .listing-square {
    margin-right: 0px;
    border-radius: 12px;
  }
  .browse-by-container ul.listing-landscape .listing-square .games-favorite {
    width: 22px;
    height: 22px;
    bottom: 48px;
  }
  .browse-by-container ul.listing-landscape img {
    width: 100%;
    height: 81%;
  }
  .set-genre-text {
    padding: 0 20px 9px 20px !important;
    bottom: 0;
  }
  .set-genre-text .set-genre-text-inner h1 {
    font-size: 20px;
    font-family: volte_medium;
    color: #ffffff;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .set-genre-text .set-genre-text-inner img {
    height: 23px;
    width: 35px;
  }
  .genre-languager-banner {
    height: 150px;
  }
  .genre-languager-banner .genre-banner-img {
    position: absolute;
    width: 100%;
    min-height: 150px;
    right: 0;
    top: 0;
    background-size: cover;
    background-repeat: no-repeat;
  }
  .genre-languager-banner .genre-banner-img:before {
    z-index: 1;
    content: "";
    display: inline-block;
    position: absolute;
    width: 101%;
    height: 150px;
    top: 0;
    right: 0;
  }
  .genre-languager-banner .genre-banner-img img {
    width: 100%;
    height: 150px;
    object-fit: fill;
  }
  .genre-languager-banner .genre-action-wrapper {
    bottom: 10px;
  }
  .genre-languager-banner .genre-action-wrapper .genre-action-image img {
    max-width: 96px;
    max-height: 44px;
  }
  .genre-languager-banner .genre-action-wrapper .isGenre {
    bottom: 21px;
    font-size: 20px;
  }
  .genre-languager-banner .genre-action-wrapper .isGenre h1 {
    font-size: 20px;
  }
  .browse-by-container .heading-section h2 {
    font-size: 14px;
  }
  .browse-by-container .language-filter {
    margin-bottom: 0;
    margin-top: 9px;
    overflow-x: scroll;
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    width: 100%;
    /* Firefox */
  }
  .browse-by-container .language-filter::-webkit-scrollbar {
    display: none;
  }
  .browse-by-container .language-filter li {
    padding: 5.5px 15px;
    margin-right: 7px;
    font-family: volte_reg;
    font-size: 16px;
  }
  .browse-by-container .language-filter li.active.genre-active {
    color: #ffffff;
    top: 0;
  }
  .browse-by-container .language-filter li.active.genre-active span {
    padding-left: 11px;
  }
  .browse-by-container .language-filter li.active.genre-active span .icon-close {
    font-size: 10px;
  }
  .set-genre-text {
    width: 100%;
    padding: 0 6.9% 9px 2.8%;
  }
  .banner-height {
    height: 160px;
  }
  .genre-revamp-container .genre-languager-banner {
    height: 122px;
  }
  .genre-revamp-container .genre-languager-banner .genre-banner-img {
    min-height: 122px;
  }
  .genre-revamp-container .genre-languager-banner .genre-banner-img:before {
    height: 122px;
  }
  .genre-revamp-container .genre-languager-banner .genre-banner-img img {
    height: 122px;
  }
}
@media only screen and (max-width: 768px) {
  .browse-by-container .no-result-found p {
    width: 90%;
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1920px) {
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, 1fr);
  }
}
@media only screen and (min-width: 1825px) and (max-width: 1920px) {
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(9, 1fr);
  }
}
@media only screen and (min-width: 1600px) and (max-width: 1824px) {
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(8, 1fr);
  }
}
@media only screen and (min-width: 1171px) and (max-width: 1340px) {
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(7, 1fr);
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component .game-detail {
    bottom: 4px;
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component .game-detail .game-detail-title {
    font-size: 14px;
  }
}
@media only screen and (min-width: 941px) and (max-width: 1170px) {
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .game-detail {
    bottom: 4px;
  }
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .game-detail .game-detail-title {
    font-size: 14px;
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(6, 1fr);
  }
}
@media only screen and (min-width: 768px) and (max-width: 940px) {
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(4, 1fr);
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(5, 1fr);
  }
}
@media only screen and (min-width: 481px) and (max-width: 767px) {
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 20px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
  .browse-by-container {
    padding: 0;
  }
  .browse-by-container h2 {
    width: 94%;
  }
  .browse-by-container .browse-by-items-section .listing-games-browse-by .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 16px;
  }
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component {
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 12px;
  }
  .browse-by-container .browse-by-items-section .infinite-scroll-component__outerdiv .infinite-scroll-component .episode-free {
    padding: 4px !important;
    font-size: 10px !important;
    border-radius: 0px 0px 6px 0px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.banner-container {
  width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
  position: relative;
  margin-bottom: 32px;
}
.banner-container .hb-slick-dots ul {
  padding: 0;
  display: flex;
  transition: all 0.32s;
  position: relative;
  margin: 0px;
  align-items: baseline;
  margin-top: 16px;
}
.banner-container .hb-slick-dots ul li {
  position: relative;
  display: flex;
  align-items: center;
  width: 20px;
  height: 20px;
  margin: 0 4px;
  padding: 0;
  transition: all 0.32s;
}
.banner-container .hb-slick-dots ul li button {
  font-size: 0;
  line-height: 0;
  display: block;
  padding: 0px;
  color: transparent;
  border: 0;
  outline: 0;
  background: 0 0;
  background: #8E81A1;
  width: 12px;
  height: 12px;
  border-radius: 100%;
  cursor: unset;
}
.banner-container .hb-slick-dots ul li.slick-active button {
  background: #F4F2F5;
  width: 14px;
  height: 14px;
  border-radius: 100%;
}
.banner-container .hb-slick-dots ul li.small button {
  width: 10px;
  height: 10px;
  border-radius: 100%;
}
.banner-container .slick-list .slick-slide .hero-banner {
  position: relative;
}
.banner-container .slick-list .slick-slide .hero-banner img:first-child {
  margin: auto;
  height: 95%;
  width: 100%;
  max-width: 98.6%;
  position: absolute;
  border-radius: 12px;
  transition: height 0.1s;
  height: 100%;
}
@media only screen and (max-width: 480px) {
  .banner-container .slick-list .slick-slide .hero-banner img:first-child {
    border-radius: 6px;
  }
}
.banner-container .slick-dot-container {
  height: 3px;
  width: 11px;
  background-color: #e5e7e9;
  border-radius: 4px;
}
.banner-container .slick-dot-container:hover {
  width: 14px;
  height: 6px;
}
.banner-container .slick-dots {
  white-space: nowrap;
  bottom: -30px;
}
.banner-container .slick-dots li {
  width: 12px;
  height: 8px;
}

.slick-slide img {
  margin: auto;
  height: 100%;
  width: 100%;
  position: absolute;
}

.banner-container .slick-list {
  position: relative;
}
.banner-container .slick-list .slick-slide {
  width: 56.33vw;
}

.slick-dots li.slick-active .slick-dot-container {
  background-color: #e10092;
}

@media only screen and (max-width: 480px) {
  .banner-container {
    margin-bottom: 10px;
  }
  .banner-container .hb-slick-dots ul {
    margin-top: 5px;
  }
  .banner-container .hb-slick-dots ul li {
    margin: 0 3px;
  }
  .banner-container .hb-slick-dots ul li button {
    width: 6px;
    height: 6px;
  }
  .banner-container .hb-slick-dots ul li.slick-active button {
    width: 8px;
    height: 8px;
  }
  .banner-container .hb-slick-dots ul li.small button {
    width: 4px;
    height: 4px;
  }
  .banner-container .slick-list .slick-slide .banner-provider-image {
    height: 32px;
    width: 32px;
    top: 12px;
    right: 12px;
  }
  .banner-container .slick-list .slick-slide .hero-banner img:first-child {
    max-width: 100%;
    height: 100%;
    border-radius: 0;
  }
  .banner-container .slick-list .slick-slide.slick-active .hero-banner:before {
    content: none;
  }
  .banner-container .slick-list .slick-slide.slick-active .hero-banner:after {
    content: none;
  }
}
@media only screen and (max-width: 768px) {
  .home-container .banner-container {
    padding: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.seo-title-container {
  padding: 30px 2.8%;
  padding-bottom: 25px;
}
.seo-title-container.seo-hide-description {
  visibility: hidden;
  height: 0px;
  margin: 0 !important;
  padding: 0 !important;
}
.seo-title-container h1, .seo-title-container p {
  font-family: volte_reg;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  color: #ffffff;
  margin-bottom: 2px;
}

@media only screen and (max-width: 480px) {
  .seo-description-container h1 {
    font-size: 18px;
    margin-bottom: 10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.plan-section {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0px;
  width: 500px;
}
.plan-section .plan-frame {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 18px 7px;
  gap: 16px;
  width: 166.6666666667px;
  height: 129px;
  background: #220046;
  border: 2px solid #564372;
}
.plan-section .plan-frame .plan-title {
  position: relative;
}
.plan-section .plan-frame .plan-title span {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 100%;
  display: flex;
  align-items: center;
  text-align: center;
  color: #ffffff;
}
.plan-section .plan-frame .plan-price {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
}
.plan-section .plan-frame .plan-price .starting-text {
  font-family: volte_light;
  font-style: normal;
  font-weight: 300;
  font-size: 12px;
  line-height: 100%;
  display: flex;
  align-items: center;
  text-align: center;
  color: #ffffff;
}
.plan-section .plan-frame .plan-price .price-text {
  font-family: volte_bold;
  font-style: normal;
  font-weight: 700;
  font-size: 20px;
  line-height: 120%;
  display: flex;
  align-items: center;
  text-align: center;
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

@media only screen and (max-width: 480px) {
  .plan-section {
    width: 100vw;
  }
  .plan-section .plan-frame {
    width: 33.3333333333vw;
  }
  .plan-section .plan-frame .plan-title span {
    font-size: 16px;
  }
  .plan-section .plan-frame .plan-price .starting-text {
    font-size: 8px;
  }
  .plan-section .plan-frame .plan-price .price-text {
    font-size: 16px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.subscription-seo-page-wrapper {
  align-items: center;
  padding: 0px 0px 103px;
}
.subscription-seo-page-wrapper .animation-plans-support-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0px;
  gap: 16px;
  margin-bottom: 32px;
}
.subscription-seo-page-wrapper .animation-banner-container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  padding: 0px;
  gap: 8px;
  max-width: 540px;
  max-height: 416px;
  margin-right: auto;
  margin-left: auto;
}
.subscription-seo-page-wrapper .animation-banner-container .banner-header {
  max-width: 540px;
  height: 40px;
  margin-right: auto;
  margin-left: auto;
}
.subscription-seo-page-wrapper .animation-banner-container .banner-header h2 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 32px;
  line-height: 1;
  color: #ffffff;
  mix-blend-mode: normal;
  letter-spacing: 0;
  white-space: nowrap;
}
.subscription-seo-page-wrapper .animation-banner-container .banner-header h2 span {
  font-family: "volte_semiBold";
  font-weight: 600;
}
.subscription-seo-page-wrapper .animation-banner-container .banner-header h2 span.golden {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.subscription-seo-page-wrapper .animation-banner-container .banner-animation-container {
  margin: 0 auto !important;
}
.subscription-seo-page-wrapper .animation-banner-container .banner-animation-container .banner-animation {
  width: 500px;
  height: 368px;
  z-index: 10;
}
.subscription-seo-page-wrapper .device-support-message {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  text-align: center;
  color: #F3CBE3;
}
.proceed-plan-cta {
  box-sizing: border-box;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 24px;
  gap: 10px;
  position: fixed;
  width: 100%;
  height: 103px;
  left: 0;
  bottom: 0px;
  background: #220046;
  border-radius: 0px;
  z-index: 100;
}
.proceed-plan-cta .primary-cta {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 16px;
  gap: 8px;
  width: 420px;
  min-width: 145px;
  max-width: 420px;
  height: 46px;
  background: #e10092;
  border-radius: 4px;
  border: none;
  cursor: pointer;
}
.proceed-plan-cta .primary-cta .label {
  font-family: "volte_semiBold";
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #ffffff;
}

@media only screen and (max-width: 480px) {
  .subscription-seo-page-wrapper {
    padding-bottom: 62px;
  }
  .subscription-seo-page-wrapper .animation-banner-container .banner-header {
    height: 24px;
  }
  .subscription-seo-page-wrapper .animation-banner-container .banner-header h2 {
    font-size: 20px !important;
  }
  .subscription-seo-page-wrapper .animation-banner-container .banner-animation-container .banner-animation {
    width: 328px !important;
    height: unset !important;
  }
  .subscription-seo-page-wrapper .animation-plans-support-container {
    gap: 12px;
    margin-bottom: 0;
  }
  .subscription-seo-page-wrapper .device-support-message {
    font-size: 14px;
    display: flex;
    align-items: center;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    gap: 18px;
    height: 214px;
    border: 1px solid #564372;
    border-radius: 8px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .playstore-item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0px 12px;
    gap: 4px;
    height: 99px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .playstore-item .playstore-rating-container {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 3.06px;
    height: 51px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .playstore-item .playstore-text-main {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 4px;
    height: 44px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .playstore-item .playstore-text-main .playstore-text {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 120%;
    display: flex;
    align-items: center;
    text-align: center;
    letter-spacing: -0.815537px;
    color: #F0F0F0;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .ui-divider {
    height: 99px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .downloads-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0px;
    gap: 4px;
    width: 136px;
    height: 77px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .downloads-item .downloads-number {
    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 0px;
    gap: 3.06px;
    height: 51px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .downloads-item .downloads-number .download-icon-app-download {
    padding-top: unset;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .downloads-item .downloads-text {
    width: 136px;
    height: 22px;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 120%;
    align-items: center;
    text-align: center;
    letter-spacing: -0.815537px;
    color: #F0F0F0;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .binge-container .binge-icons {
    justify-content: center;
    align-items: flex-start;
    align-content: center;
    padding: 0px;
    gap: 10.84px;
    height: 80.86px;
  }
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .binge-container .binge-icons img {
    margin: 0 auto;
  }
  .proceed-plan-cta {
    flex-wrap: wrap;
    align-content: flex-start;
    padding: 20px;
    gap: 0px 12px;
    height: 86px;
    border: 1px solid #564372;
  }
  .proceed-plan-cta .primary-cta {
    width: 320px;
    min-width: 120px;
  }
  .proceed-plan-cta .primary-cta .label {
    font-size: 16px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 360px) {
  .subscription-seo-page-wrapper .binge-rating-platform-faq-container .ui-container .playstore-item {
    padding: 0px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 340px) {
  .animation-banner-container .banner-header h2 {
    font-size: 18px !important;
  }
  .animation-banner-container .banner-animation-container .banner-animation {
    width: 320px !important;
    height: unset !important;
  }
}
@media only screen and (min-width: 480px) and (max-width: 780px) {
  .animation-banner-container {
    gap: 12px;
  }
  .animation-banner-container .banner-header {
    height: unset;
  }
  .animation-banner-container .banner-header h2 {
    font-weight: 500;
    font-size: 20px;
    line-height: 1.22;
    text-align: center;
  }
  .animation-banner-container .banner-animation-container .banner-animation {
    width: 328px;
    height: 241px;
  }
}
@media only screen and (min-width: 781px) and (max-width: 900px) {
  .animation-banner-container {
    max-height: unset;
  }
  .animation-banner-container .banner-header {
    max-width: 400px;
    height: unset;
  }
  .animation-banner-container .banner-header h2 {
    font-size: 20px;
  }
  .animation-banner-container .banner-animation-container .banner-animation {
    width: 328px;
    height: unset;
  }
}
@media only screen and (min-width: 901px) and (max-width: 1000px) {
  .animation-banner-container {
    max-height: unset;
  }
  .animation-banner-container .banner-header {
    max-width: 400px;
    height: unset;
  }
  .animation-banner-container .banner-header h2 {
    font-size: 20px;
  }
  .animation-banner-container .banner-animation-container .banner-animation {
    width: 328px;
    height: unset;
  }
}
@media only screen and (min-width: 1001px) and (max-width: 1100px) {
  .animation-banner-container {
    max-height: unset;
  }
  .animation-banner-container .banner-header {
    max-width: 400px;
    height: unset;
  }
  .animation-banner-container .banner-header h2 {
    font-size: 20px;
  }
  .animation-banner-container .banner-animation-container .banner-animation {
    width: 328px;
    height: unset;
  }
}
@media only screen and (min-width: 1101px) and (max-width: 1200px) {
  .animation-banner-container {
    max-height: unset;
  }
  .animation-banner-container .banner-header {
    max-width: 450px;
    height: unset;
  }
  .animation-banner-container .banner-header h2 {
    font-size: 25px;
  }
}
@media (min-width: 1600px) and (max-width: 1744px) {
  .animation-banner-container .banner-header {
    max-width: 725px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.seo-static-contr h1 {
  width: 94.3%;
  margin: auto;
  font-family: sky_med;
  margin-bottom: 7px;
  font-size: 22px;
  line-height: 120%;
  color: #eeeeff;
}
.seo-static-contr .search-container {
  margin-top: 0px;
}
.seo-static-contr .search-container .container-top {
  padding-bottom: 20px;
}
.seo-static-contr .search-container .container-top .grid-view {
  margin-top: 0;
}
.seo-static-contr .search-container .seo-description-container {
  padding: 0px 2.8% 7px 2.8%;
}
.seo-static-contr .search-container .seo-description-container.footer {
  margin-top: 20px;
  margin-bottom: 36PX;
}
.seo-static-contr .search-container .home-faq-container .horizontal-line {
  margin-bottom: 30px;
}

@media only screen and (max-width: 480px) {
  .seo-static-contr .search-container .container-top.search-result-list {
    padding-top: 0px !important;
  }
  .seo-static-contr .search-container .seo-description-container {
    padding: 0px 2.8% 0px 2.8%;
    margin-top: 12px;
  }
  .seo-static-contr .search-container .seo-description-container.footer {
    margin-top: 12px;
    margin-bottom: 12px;
  }
  .seo-static-contr .search-container .home-faq-container .horizontal-line {
    margin-top: 0px;
    margin-bottom: 12px;
  }
  .seo-static-contr h1 {
    font-size: 18px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.apple_wrapper .apple_interstitial_Poster_Wrapper {
  width: 88%;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 40px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_primary_description {
  display: block;
  font-weight: 500;
  font-size: 18.5px;
  font-family: volte_medium;
  color: #ffffff;
  line-height: 21.6px;
  text-align: center;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_sec_description {
  color: #ffffff;
  font-size: 26px;
  line-height: 31.7px;
  font-family: volte_medium;
  margin-bottom: 24px;
  text-align: center;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_button_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 24px;
  margin-bottom: 4px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_button_wrapper button {
  padding: 13px;
  border-radius: 4px;
  color: #ffffff;
  font-family: volte_semiBold;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_button_wrapper .apple_primary_btn {
  background: #e10092;
  margin-bottom: 20px;
  border: none;
  width: 460px;
  margin-right: 0px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_footer {
  margin-top: 5px;
  margin-bottom: 20px;
  font-size: 16px;
  color: #ffffff;
  line-height: 19.2px;
  width: 100%;
  font-family: volte_reg;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .steps-list .steps {
  display: flex;
  margin-bottom: 12px;
  font-size: 18px;
  font-weight: 500;
  width: 100%;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .steps-list .steps > div {
  color: #ffffff;
  margin-right: 16px;
  font-family: volte_medium;
  width: 60px;
  font-weight: 600;
  line-height: 19.8px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .steps-list .steps .step-info {
  color: #d6c6f4;
  text-align: left;
  width: 90%;
  line-height: 16.2px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_video_thumbnail {
  width: 600px;
  height: 337.5px;
  margin-bottom: 30px;
  cursor: pointer;
  position: relative;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_video_thumbnail img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_video_thumbnail img.apple_play_image {
  position: absolute;
  width: 60px;
  height: 60px;
  top: 139px;
  left: 270px;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_know_more_wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.apple_wrapper .apple_interstitial_Poster_Wrapper.no_steps_wrapper {
  width: 50%;
}

@media only screen and (max-width: 480px) {
  .apple_wrapper .apple_interstitial_Poster_Wrapper {
    width: 100%;
    margin-bottom: 0px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_button_wrapper {
    margin-top: 20px;
    margin-bottom: 5px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_button_wrapper button {
    font-size: 16px;
    line-height: 19.2px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_button_wrapper .apple_primary_btn {
    width: 320px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_footer {
    font-size: 14px;
    font-weight: 500;
    margin-top: 0px;
    margin-bottom: 0px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_sec_description {
    font-size: 20px;
    line-height: 24px;
    font-weight: 600;
    margin-bottom: 24px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_border_line {
    width: 100%;
    border-bottom: 1px solid #564372;
    margin-bottom: 24px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper {
    margin: 0px 20px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_primary_description {
    font-size: 16px;
    font-weight: 400;
    line-height: 19.2px;
    font-family: volte_reg;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_video_thumbnail {
    width: 300px;
    height: 168.75px;
    margin-bottom: 24px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_video_thumbnail img {
    width: 100%;
    height: 100%;
    border-radius: 4.09px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_video_thumbnail img.apple_play_image {
    position: absolute;
    width: 40px;
    height: 40px;
    top: 63.92px;
    left: 129.55px;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .steps-list .steps {
    display: flex;
    margin-bottom: 12px;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 12.6px;
    width: 100%;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .steps-list .steps > div {
    margin-right: 10px;
    width: 15%;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .steps-list .steps .step-info {
    width: 85%;
  }
  .apple_wrapper .apple_interstitial_Poster_Wrapper .apple_bottom_wrapper .apple_footer {
    font-size: 12px;
    line-height: 14.4px;
    font-weight: 400;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.container-download {
  display: flex;
  justify-content: center;
  color: #fff;
  border-radius: 13px;
  border: 1.6px solid #564372;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  padding: 23.5px;
  width: 532px;
}

.content-app-download {
  display: flex;
  gap: 32px;
  border-radius: 16px;
  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
  max-width: 800px;
}

.google-play-app-download {
  width: 164px;
}

.app-store-app-download {
  width: 164px;
}

.download-section {
  margin-bottom: 16px;
  font-size: 24px;
  line-height: 28.8px;
  font-weight: 600;
}

.store-buttons {
  display: flex;
  gap: 14px;
  flex-direction: column;
}

.store-div {
  display: flex;
  justify-content: center;
}

button {
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
}

button img {
  width: 150px;
  height: auto;
}

.qr-code {
  display: flex;
  justify-content: center;
}

.scanner-image-app-download {
  width: 116px !important;
  height: 116px !important;
  border-radius: 11px;
}

.hero-app-download {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30px 0;
}

.hero-content {
  max-width: 600px;
  margin-right: auto;
  margin-left: 50px;
  flex-direction: column;
  gap: 70px;
}

.banner-container-app-download {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 auto !important;
}

.banner-gif {
  position: absolute;
  top: 39%;
  left: 50%;
  transform: translateX(-50%);
  width: 360px;
  height: 259px;
  z-index: 10;
}

.banner-image-app-download {
  width: 528px;
  color: white;
}

.hero-app-download h1 {
  font-family: volte_reg;
  font-size: 32px;
  line-height: 1.5;
  margin-bottom: 65px;
}

.hero-app-download h1 span {
  color: #e10092;
  font-family: "volte_semiBold";
}

.hero-app-download h1 span.golden {
  background: linear-gradient(270deg, #ffa800 0%, #fff389 45.31%, #ffa800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.hero-app-download h1 span:last-child {
  margin-left: 8px;
}

.playstore-rating {
  font-size: 65px;
  font-weight: bold;
  color: rgb(246, 231, 1);
  text-shadow: 2.56px 1.46px 0px rgb(225, 0, 146);
}

.playstore-star {
  font-size: 28px;
  color: rgb(243, 203, 227);
}

.ui-divider-download {
  width: 2px;
  background-color: rgb(86, 67, 114);
  height: 166px;
}

.faq-border {
  border: none !important;
  padding: 15px 11.8% 0px 11.8% !important;
}

.faq-section-main .home-faq-container {
  padding-bottom: 55px;
}

@media (min-width: 1745px) {
  .hero-content {
    max-width: fit-content !important;
  }
  .content-app-download {
    gap: 100px !important;
  }
}
@media (min-width: 1600px) and (max-width: 1744px) {
  .hero-content {
    max-width: 725px;
  }
  .container-download {
    width: inherit;
  }
  .content-app-download {
    gap: 65px !important;
  }
}
@media only screen and (min-width: 781px) and (max-width: 900px) {
  .hero-content {
    margin-left: 20px;
    margin-right: 20px;
    max-width: 400px;
    gap: 10px;
  }
  .banner-image-app-download {
    width: 300px;
  }
  .hero-app-download h1 {
    font-size: 15px;
  }
  .container-download {
    padding: 12px;
    width: inherit;
  }
  .download-section {
    font-size: 14px;
  }
  .banner-gif {
    top: 16%;
    width: 250px;
  }
}
@media only screen and (min-width: 901px) and (max-width: 1000px) {
  .hero-content {
    max-width: 400px;
    gap: 20px;
  }
  .banner-image-app-download {
    width: 350px;
  }
  .hero-app-download h1 {
    font-size: 20px;
  }
  .container-download {
    padding: 12px;
    width: inherit;
  }
  .download-section {
    font-size: 14px;
  }
  .banner-gif {
    top: 22%;
    width: 300px;
  }
}
@media only screen and (min-width: 1001px) and (max-width: 1100px) {
  .hero-content {
    max-width: 400px;
    gap: 20px;
  }
  .banner-image-app-download {
    width: 350px;
  }
  .hero-app-download h1 {
    font-size: 20px;
  }
  .container-download {
    padding: 12px;
    width: inherit;
  }
  .download-section {
    font-size: 14px;
  }
  .banner-gif {
    top: 22%;
    width: 300px;
  }
}
@media only screen and (min-width: 1101px) and (max-width: 1200px) {
  .hero-content {
    max-width: 450px;
    gap: 60px;
  }
  .banner-image-app-download {
    width: 470px;
  }
  .hero-app-download h1 {
    font-size: 25px;
  }
  .container-download {
    padding: 12px;
    width: inherit;
  }
  .download-section {
    font-size: 18px;
  }
  .banner-gif {
    top: 34%;
  }
}
@media only screen and (min-width: 320px) and (max-width: 780px) {
  .scanner-image-app-download {
    width: 98px !important;
    height: 98px !important;
    border-radius: 11px;
  }
  .hero-app-download {
    flex-direction: column-reverse;
    padding: unset;
  }
  .hero-content {
    padding-left: 10px;
    padding-right: 10px;
    gap: 20px;
    margin-left: unset;
    margin-right: unset;
  }
  .hero-app-download h1 {
    font-size: 20px;
    line-height: 25px;
    text-align: center;
  }
  .banner-image-app-download {
    width: 360px;
  }
  .download-section {
    font-size: 16px;
    line-height: 19.2px;
    margin-top: 5px;
    margin-bottom: 15px;
  }
  .content-app-download {
    display: flex;
    gap: 24px;
    border-radius: 16px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
    max-width: 800px;
  }
  .container-download {
    padding: 12px;
    width: inherit;
  }
  .google-play-app-download {
    width: 118px;
  }
  .app-store-app-download {
    width: 118px;
  }
  .ui-divider-download {
    height: 138px;
  }
  .faq-border {
    border: none !important;
    padding: 20px 0 0 0 !important;
  }
  .faq-section-main .home-faq-container {
    padding-bottom: 60px;
    margin-bottom: 0;
  }
  .faq-section-main .home-faq-container .home-faq h2 {
    font-family: "volte_semiBold";
  }
  .playstore-rating {
    font-size: 42px;
  }
  .banner-gif {
    width: 220px;
    height: 161px;
    top: 41%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.you-tube-contr {
  width: 640px;
  max-width: 100%;
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
.you-tube-contr iframe {
  height: 380px;
  border-radius: 10px;
}
@media screen and (max-width: 940px) {
  .you-tube-contr iframe {
    height: 320px;
  }
}
@media screen and (max-width: 480px) {
  .you-tube-contr iframe {
    height: 180px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.help-center-container {
  min-height: 100vh;
  background: #fff;
}
.help-center-container i {
  font-style: italic;
}
.help-center-container .small {
  font-size: 80%;
  font-weight: 400;
  font-family: volte_reg, Tahoma, sans-serif;
  color: #1d1e30;
}
.help-center-container .mT0 {
  margin-top: 0;
}
.help-center-container .mT5 {
  margin-top: 5px;
}
.help-center-container .mT10 {
  margin-top: 10px;
}
.help-center-container .mT15 {
  margin-top: 15px;
}
.help-center-container .mT20 {
  margin-top: 20px;
}
.help-center-container .mT25 {
  margin-top: 25px;
}
.help-center-container .mT30 {
  margin-top: 30px;
}
.help-center-container .mTn15 {
  margin-top: -15px;
}
.help-center-container .mB5 {
  margin-bottom: 5px;
}
.help-center-container .mB20 {
  margin-bottom: 20px;
}
.help-center-container .pT0 {
  padding-top: 0;
}
.help-center-container .pB0 {
  padding-bottom: 0;
}
.help-center-container .pB20 {
  padding-bottom: 20px;
}
.help-center-container .pL3 {
  padding-left: 3px;
}
.help-center-container section {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  display: block;
  padding-top: 40px;
  padding-bottom: 40px;
  position: relative;
  font-family: volte_reg;
}
.help-center-container section .heading-md {
  margin-bottom: 20px;
}
.help-center-container section .heading-md .heading1 {
  font-size: 20px;
  padding: 0;
  color: #220046;
  word-break: break-word;
}
.help-center-container section .heading-md .heading2 {
  display: block;
  font-size: 18px;
  margin-top: 8px;
  color: rgba(255, 255, 255, 0.5);
}
.help-center-container .btn {
  margin: 0;
  display: inline-flex;
  justify-content: center;
  position: relative;
  padding: 0 32px;
  box-sizing: border-box;
  min-width: 64px;
  height: 45px;
  line-height: 45px;
  overflow: hidden;
  vertical-align: middle;
  border-radius: 22px;
  font-size: 18px;
  text-transform: none;
  box-shadow: none;
  border: 0;
  text-decoration: none;
  cursor: pointer;
}
.help-center-container .btn-primary {
  background: rgb(80, 135, 199);
}
.help-center-container .btn-secondary {
  background: transparent;
  color: rgb(80, 135, 199);
  box-shadow: none;
  border: 0;
  padding: 0;
  height: auto;
  line-height: inherit;
  border-radius: inherit;
}
.help-center-container .btn-secondary:hover {
  box-shadow: none;
}
.help-center-container .btn.inactive {
  background: rgb(82, 84, 122);
  border: 1px solid transparent;
  color: #ffffff;
}
.help-center-container .btn-outline-primary {
  border: 1px solid #fff;
  color: #ffffff;
}
.help-center-container .btn-sm {
  padding: 8px 20px;
  min-width: max-content;
  height: auto;
  line-height: inherit;
}
.help-center-container .btn-tertiary {
  background: transparent;
  border: 1px solid #e10092;
  color: #e10092;
  font-family: volte_medium;
}
.help-center-container .btn-tertiary:hover {
  background: #e10092;
  color: #ffffff;
  border: 1px solid transparent;
}
.help-center-container .container {
  width: 996px;
  max-width: 100%;
  margin-right: auto;
  margin-left: auto;
}
.help-center-container section {
  padding-top: 40px;
  padding-bottom: 40px;
  position: relative;
}
.help-center-container section.wrapper-background {
  background: #fff;
}
@media screen and (min-width: 769px) and (max-width: 1023px) {
  .help-center-container .container {
    padding: 0 24px;
  }
}
@media screen and (max-width: 768px) {
  .help-center-container body {
    font-size: 16px;
  }
  .help-center-container p {
    line-height: 18px;
  }
  .help-center-container .for-desktop {
    display: none;
  }
  .help-center-container .for-mobile {
    display: block;
  }
  .help-center-container .btn {
    font-size: 14px;
    width: auto;
    height: 45px;
    padding: 0 32px;
    line-height: 45px;
  }
  .help-center-container .category-header .text-contr {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(100% - 15px);
    font-size: 28px;
    font-family: "SkyTextMedium";
  }
  .help-center-container .page-header {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .help-center-container .did-you-know .heading-md {
    padding-left: 0;
  }
  .help-center-container section {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .help-center-container .main-container {
    position: relative;
  }
  .help-center-container .container {
    padding: 0 10px;
  }
  .help-center-container .autocomplete-wrapper {
    width: calc(100% + 10px);
  }
  .help-center-container .autocomplete-wrapper li {
    padding: 8px 0;
  }
  .help-center-container .location-search-reasult.fix {
    left: -10px;
    width: 100vw;
    height: calc(100vh - 200px);
  }
  .help-center-container .suggest-contr {
    width: calc(100% + 10px);
  }
  .help-center-container .no-result {
    width: calc(100% + 10px);
  }
  .help-center-container .heading-md {
    margin-bottom: 15px;
    text-align: left;
  }
  .help-center-container .heading-md .heading1 {
    font-size: 22px;
    padding: 0;
    padding: 0;
    font-size: 22px;
  }
  .help-center-container .heading-md .heading2 {
    margin-top: 8px;
    padding: 0;
    font-size: 22px;
  }
  .help-center-container .get-help-parent .heading-md .heading1 {
    font-size: 22px;
    padding: 0;
  }
  .help-center-container .why-ts h2.heading1.gradient {
    font-size: 22px;
    padding: 0;
  }
  .help-center-container .card-sm .card-header {
    padding: 16px;
  }
  .help-center-container .card-sm .card-body {
    padding: 16px;
  }
  .help-center-container .card-sm .card-footer {
    padding: 16px;
  }
  .help-center-container .heading-sm .heading1 {
    padding: 0;
    font-size: 22px;
  }
  .help-center-container .heading-sm .heading2 {
    padding: 0;
    font-size: 22px;
  }
  .help-center-container .top-fix {
    padding: 0;
    font-size: 22px;
  }
  .help-center-container .vdo-btn-contr {
    margin-top: 20px;
  }
  .help-center-container .form-control {
    font-size: 14px;
  }
  .help-center-container input.form-control {
    font-size: 14px;
  }
  .help-center-container input.form-control::placeholder {
    font-size: 14px;
  }
  .help-center-container .location-details {
    width: 100%;
    height: 33px;
  }
  .help-center-container .location-details .icon-contr {
    line-height: 33px;
    height: 33px;
  }
  .help-center-container .location-info-contr {
    width: 100%;
    margin: 0 auto;
  }
  .help-center-container .location-info-contr.fix .back-btn-arrow {
    position: relative;
    float: left;
    top: 5px;
  }
  .help-center-container .location-info-contr.fix .location-details {
    width: calc(100% - 44px);
    float: left;
    margin-right: 15px;
  }
  .help-center-container .icon-close-1 {
    font-size: 16px;
  }
  .help-center-container .icon-close-1:before {
    color: #ffffff;
  }
  .help-center-container .modal-body {
    padding: 60px 20px 48px;
    width: 100%;
    margin: 0 auto;
  }
  .help-center-container .modal-dialog {
    margin: 0;
  }
  .help-center-container .most-search {
    width: 100%;
    align-items: flex-start;
    flex-direction: column;
  }
  .help-center-container .most-search ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin: -5px;
    width: 100%;
    margin-top: 5px;
  }
  .help-center-container .you-can-outer {
    flex-wrap: wrap;
  }
  .help-center-container .you-can-outer .card-outer {
    width: 100%;
    border-radius: 10px;
    display: flex;
  }
  .help-center-container .you-can-outer .card .card-body {
    font-size: 14px;
    padding: 15px;
  }
  .help-center-container .you-can-outer .card .card-body .text-area {
    width: calc(100% - 70px);
  }
  .help-center-container .you-can-outer .card .card-body .cta-area {
    width: 90px;
    text-align: center;
  }
  .help-center-container .ticket-compact.archive {
    padding: 15px;
  }
  .help-center-container .ticket-compact.archive .request-top .img-contr {
    margin-right: 10px;
  }
  .help-center-container .ticket-compact.archive .request-top .text-contr {
    width: calc(100% - 110px);
    flex-direction: column;
    margin-right: 10px;
    align-items: flex-start;
  }
  .help-center-container .ticket-compact.archive .request-top .heading {
    font-size: 22px;
    padding-bottom: 10px;
    padding-top: 0;
    padding-right: 0;
    margin-right: 0;
    border-right: none;
  }
  .help-center-container .ticket-compact.archive .request-top .cta span {
    display: none;
  }
  .help-center-container .resolve-contr .solve .solve-down {
    flex-direction: column;
  }
  .help-center-container .not-found {
    padding: 20px 10px;
  }
  .help-center-container .request-detail .link {
    font-size: 14px;
  }
  .help-center-container .mCSB_inside > .mCSB_container {
    margin-right: 12px;
  }
  .help-center-container .embed-video {
    width: 100%;
    height: 250px;
  }
  .help-center-container .upgrade-contr {
    width: 100%;
  }
  .help-center-container .upgrade-contr .card-body {
    flex-direction: column;
    align-items: flex-start;
  }
  .help-center-container .upgrade-contr .card-body .icon-contr img {
    width: auto;
  }
  .help-center-container .promo-card:after {
    bottom: 15px;
    right: -15px;
  }
}
@media screen and (max-width: 599px) {
  .help-center-container .btn {
    width: 100%;
  }
  .help-center-container .acc-collapsed:before {
    top: 10px;
  }
  .help-center-container .acc-expanded:before {
    top: 10px;
  }
  .help-center-container .accordion-main .card-body {
    padding-top: 10px;
  }
  .help-center-container .content-page .heading-md {
    text-align: left;
  }
  .help-center-container .ticket-outer {
    display: flex;
    flex-direction: column;
  }
  .help-center-container .ticket {
    background: #fff;
    padding: 10px;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6);
    width: 100%;
  }
  .help-center-container .ticket .content-area .request-detail {
    margin: 10px -10px;
  }
  .help-center-container .ticket .content-area .request-detail .req-contr {
    flex-direction: column;
  }
  .help-center-container .ticket .content-area .request-top {
    margin-top: 0;
  }
  .help-center-container .ticket .content-area .request-status {
    margin-right: -10px;
  }
  .help-center-container .ticket .content-area .request-status .data {
    line-height: 16px;
    font-size: 12px;
    padding: 2px 7px;
  }
  .help-center-container .request .nav-tabs {
    margin: 0 -10px 20px;
  }
  .help-center-container #outage {
    width: 100%;
    margin: 0 auto;
    padding-bottom: 30px;
  }
  .help-center-container .outage-banner-outer .container {
    padding: 0;
  }
  .help-center-container .outage-card1 .text-contr {
    font-size: 14px;
  }
  .help-center-container .outage-card2 .text-contr {
    font-size: 14px;
  }
  .help-center-container .outage-card2 .text-contr .heading {
    font-family: sky_med, sans-serif;
    margin-bottom: 5px;
    color: #ffffff;
  }
  .help-center-container .outage-card2 .text-contr .text-inner {
    flex-direction: column;
  }
  .help-center-container .outage-card2 .text-contr .link-contr {
    width: 130px;
    font-size: 14px;
  }
  .help-center-container .slick-dots {
    bottom: 12px;
  }
  .help-center-container .ticket-compact .content-area .request-top .active {
    line-height: 16px;
    font-size: 12px;
  }
  .help-center-container .open-chat .card-body {
    width: 360px;
    padding: 10px 15px;
  }
  .help-center-container .other-topic-tags ul li a {
    font-size: 14px;
    border-radius: 13px;
    height: 30px;
    line-height: 30px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.header-hc header {
  cursor: pointer;
  margin: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  display: block;
  display: flex;
  display: -webkit-flex;
  align-items: center;
  width: 100%;
  padding-left: 36px;
  padding-right: 36px;
  background: linear-gradient(60deg, #080010 0%, #1f0040 100%) !important;
  top: -72px;
  height: 69px;
}
.header-hc .logo-contr {
  padding-top: 20px;
  padding-bottom: 0;
  background: linear-gradient(60deg, rgb(17, 0, 35) 0%, rgb(32, 0, 66) 100%);
  z-index: 3;
  position: relative;
}
.header-hc .back {
  display: flex;
  align-items: center;
  text-decoration: none;
}
.header-hc .back img {
  margin-right: 15px;
}
.header-hc .for-mobile {
  display: none;
}
@media screen and (max-width: 768px) {
  .header-hc .for-desktop {
    display: none;
  }
  .header-hc .for-mobile {
    display: block;
    border-bottom: 0.2px solid #2f285a;
  }
  .header-hc .logo-contr {
    padding: 10px;
  }
  .header-hc header {
    display: flex;
    display: -webkit-flex;
    align-items: flex-end;
    width: 100%;
    height: 57px;
    font-family: sky_med;
    font-size: 18px;
    padding-bottom: 10px;
    padding-top: 20px;
    background: #1d1e30;
    z-index: 2;
    padding-left: 15px;
    padding-right: 15px;
  }
  .header-hc header a {
    font-size: 18px;
    color: #ffffff;
    font-family: sky_med;
  }
  .header-hc header a:hover {
    color: #ffffff;
  }
}

@media only screen and (max-width: 480px) {
  .container.back_arrow_container {
    display: flex;
  }
  .container.back_arrow_container .back_arrow {
    width: 20px;
    height: 20px;
    margin: 0px 0px 0px 0px;
    width: 41%;
  }
  .container.back_arrow_container .back_arrow img {
    width: 20px;
    height: 100%;
  }
  .container.back_arrow_container .back {
    width: 60%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.top-header-download .download-container {
  position: fixed;
  height: 45px;
  top: 0;
  background: linear-gradient(294.99deg, #020005 0%, #220046 100%);
  color: #ffffff;
  width: 100%;
  padding-left: 27px;
  padding-right: 16px;
  z-index: 1001;
}
.top-header-download .download-container .text-size {
  font-size: 14px;
  font-weight: 400;
  font-family: volte_medium;
}
.top-header-download .d-flex {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.top-header-download .download-close-container {
  height: 35px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.top-header-download .close-btn {
  height: 12px;
  width: 12px;
  margin-left: 15px;
}
.top-header-download .apple-store {
  width: 100px;
  height: 34px;
}
.top-header-download .play-store {
  width: 111px;
  height: 34px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.payment-redirection-wrapper .payment-redirection-background {
  position: absolute;
  width: 100%;
  min-height: 488px;
  right: 0;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
}
.payment-redirection-wrapper .payment-redirection-background img {
  width: 100%;
  max-height: 488px;
  position: absolute;
}
.payment-redirection-wrapper .payment-redirection-verbiage {
  position: relative;
  top: 50vh;
  color: white;
  text-align: center;
}
.payment-redirection-wrapper .payment-redirection-verbiage .loader-container {
  position: absolute;
  bottom: 71px;
  height: unset;
}
.payment-redirection-wrapper .payment-redirection-verbiage .loader-container .scroll-loader {
  width: 220px;
  height: 220px;
}
.payment-redirection-wrapper .payment-redirection-verbiage .redirection-title {
  font-family: volte_semiBold;
  font-weight: 700;
  font-size: 26px;
  line-height: 120%;
  letter-spacing: 0px;
}
.payment-redirection-wrapper .payment-redirection-verbiage .redirection-sub-title {
  font-family: volte_reg;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 0px;
  padding-top: 16px;
}

@media only screen and (max-width: 480px) {
  .payment-redirection-wrapper .payment-redirection-background img {
    max-height: fit-content;
  }
  .payment-redirection-wrapper .payment-redirection-verbiage {
    top: 45vh;
  }
  .payment-redirection-wrapper .payment-redirection-verbiage .loader-container {
    bottom: 69px;
  }
  .payment-redirection-wrapper .payment-redirection-verbiage .loader-container .scroll-loader {
    width: 120px;
    height: 120px;
  }
  .payment-redirection-wrapper .payment-redirection-verbiage .redirection-title {
    font-weight: 600;
    font-size: 24px;
  }
  .payment-redirection-wrapper .payment-redirection-verbiage .redirection-sub-title {
    font-size: 20px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.managed-app-container {
  padding-top: 1px;
}
.managed-app-container .logo-container {
  padding-left: 70px;
  margin-top: -3%;
  position: relative;
}
.managed-app-container .logo-container div:nth-child(1) {
  width: 108px;
  height: 25px;
  cursor: pointer;
}
.managed-app-container .logo-container div:nth-child(1) img {
  width: 100%;
}
.managed-app-container .logo-container div:nth-child(2) {
  cursor: pointer;
  width: 18px;
  height: 18px;
  margin-top: 28px;
}
.managed-app-container .logo-container div:nth-child(2) img {
  width: 100%;
}
.managed-app-container .iframe-container {
  display: flex;
  justify-content: center;
  height: 100vh;
}
.managed-app-container .iframe-container iframe {
  margin-top: 10px;
}
.managed-app-container .portal-background {
  position: absolute;
  width: 100%;
  min-height: 488px;
  right: 0;
  top: -4.5rem;
  background-size: cover;
  background-repeat: no-repeat;
}
.managed-app-container .portal-background img {
  width: 100%;
  max-height: 488px;
  position: absolute;
}

@media only screen and (max-width: 480px) {
  .managed-app-container .logo-container {
    display: flex;
    flex-direction: row-reverse;
    width: 105px;
    padding-left: 0;
    margin-top: -7%;
  }
  .managed-app-container .logo-container div:nth-child(1) {
    padding-left: 15px;
    width: 69px;
    height: 16px;
  }
  .managed-app-container .logo-container div:nth-child(2) {
    width: 15px;
    height: 15px;
    margin-top: 0px;
  }
  .managed-app-container .iframe-container {
    margin-top: 20px;
  }
  .managed-app-container .iframe-container iframe {
    margin-top: 10px;
    width: 90%;
  }
  .managed-app-container .portal-background {
    opacity: 0.55;
    top: -45px;
  }
  .managed-app-container .portal-background img {
    object-fit: contain;
  }
  .managed-app-container .hide-background-img img {
    display: none;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.validate-smart-tv-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 17px 20px;
  min-height: 100vh;
  background: linear-gradient(250deg, rgb(2, 0, 5) 0%, rgb(34, 0, 70) 100%);
}
.validate-smart-tv-container .logo-header {
  margin-bottom: 40px;
}
.validate-smart-tv-container .smart-tv-logo {
  margin-bottom: 35px;
}
.validate-smart-tv-container h4 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 20px;
  margin-bottom: 8px;
}
.validate-smart-tv-container h5 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 120%;
  text-align: center;
  color: #FFFFFF;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

section.more-way-tohelp1 {
  background: #fff;
}
section.more-way-tohelp1 .heading-md {
  position: relative;
}
section.more-way-tohelp1 .heading-md .heading1,
section.more-way-tohelp1 .heading-md .heading-sm .heading1 {
  color: #220046;
  margin-bottom: 0;
  font-size: 35px;
  font-family: volte_reg, Tahoma, sans-serif;
}
section.more-way-tohelp1 ul {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
section.more-way-tohelp1 .helpcard-item-wrapper {
  background: rgb(51, 53, 77);
  position: relative;
  width: calc(33.33% - 10px);
  margin: 5px;
  border-radius: 6px;
}
section.more-way-tohelp1 .helpcard-item-wrapper:hover {
  cursor: pointer;
}
section.more-way-tohelp1 .helpcard-item-wrapper span {
  font-family: volte_medium, sans-serif;
}
section.more-way-tohelp1 .helpcard-item-wrapper a {
  color: #1d1e30;
  width: 100%;
  padding: 10px 15px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
  border: 0;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  text-decoration: none;
}
section.more-way-tohelp1 .helpcard-item-wrapper a:hover {
  background: #f4f2f6;
  transition-property: background;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
section.more-way-tohelp1 .helpcard-item-wrapper a:hover .text-contr span {
  font-family: volte_semiBold, sans-serif;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
section.more-way-tohelp1 .helpcard-item-wrapper a .text-contr {
  display: flex;
  align-items: center;
  font-size: 18px;
  font-family: sky_reg, Tahoma, sans-serif;
}
@media screen and (max-width: 768px) {
  section.more-way-tohelp1 .helpcard-item-wrapper a .text-contr {
    font-size: 16px;
  }
}
section.more-way-tohelp1 .helpcard-item-wrapper a .text-contr .icon-Partner-apps {
  padding-right: 0px;
}
section.more-way-tohelp1 .helpcard-item-wrapper a .icon-contr {
  height: 40px;
  width: 40px;
  display: flex;
  margin-right: 10px;
  justify-content: center;
  align-items: center;
  background: #594074;
  border-radius: 50%;
}
section.more-way-tohelp1 .helpcard-item-wrapper a .icon-contr img {
  max-width: 60%;
  opacity: 0.8;
}
section.more-way-tohelp1 .helpcard-item-wrapper a .icon-partner-apps {
  padding-right: 0px !important;
}
section.more-way-tohelp1 .helpcard-item-wrapper a .arrow-contr {
  height: 16px;
  display: inline-block;
}
section.more-way-tohelp1 .helpcard-item-wrapper a .arrow-contr img {
  max-height: 100%;
}
@media screen and (max-width: 768px) {
  section.more-way-tohelp1 .heading-md {
    margin-bottom: 15px;
    text-align: left;
  }
  section.more-way-tohelp1 .heading-md .heading1 {
    font-size: 20px;
  }
  section.more-way-tohelp1 ul {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
  }
  section.more-way-tohelp1 .helpcard-item-wrapper {
    width: 100%;
    position: relative;
    border-bottom: 1px solid #bdbdbd;
    background: transparent;
    margin: 0;
    border-radius: 0;
  }
  section.more-way-tohelp1 .helpcard-item-wrapper:last-child {
    border-bottom: none;
  }
  section.more-way-tohelp1 .helpcard-item-wrapper:last-child a {
    padding-bottom: 0;
  }
  section.more-way-tohelp1 .helpcard-item-wrapper a {
    width: 100%;
    padding: 10px 0;
    box-shadow: none;
    border-radius: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

section.help-video-card-section.video-wrapper .container {
  width: 996px;
}
section.help-video-card-section.video-wrapper.altBg {
  background: rgba(34, 0, 70, 0.1);
}
section.help-video-card-section.video-wrapper.altBg.wrapper-background {
  background-color: #ffffff;
}
section.help-video-card-section.video-wrapper .heading-md {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  text-decoration: none;
}
section.help-video-card-section.video-wrapper .heading-md .heading1 {
  color: #220046;
  position: relative;
  z-index: 2;
  font-family: volte_reg, Tahoma, sans-serif;
  margin-bottom: 0;
  font-size: 35px;
}
section.help-video-card-section.video-wrapper .icon-Partner-apps {
  padding-right: 5px;
}
section.help-video-card-section.video-wrapper .video-contr {
  max-width: 100%;
  margin-top: 10px;
}
section.help-video-card-section.video-wrapper .video-contr.landing-page {
  display: flex;
  align-items: flex-end;
}
section.help-video-card-section.video-wrapper .video-contr.see-all-page {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
}
section.help-video-card-section.video-wrapper .video-contr .slick-initialized .slick-slide {
  width: 249px !important;
}
section.help-video-card-section.video-wrapper .video-contr .slick-arrow {
  width: 24px;
  height: 24px;
  display: block !important;
  z-index: 1;
}
section.help-video-card-section.video-wrapper .video-contr .slick-disabled {
  display: none !important;
}
section.help-video-card-section.video-wrapper .video-contr .li {
  margin: 5px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper {
  padding: 11px;
  display: flex;
  align-items: center;
  background: #fff;
  margin-bottom: 10px;
  border-radius: 8px;
  box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6);
  margin: 5px;
  width: 239px !important;
  max-height: 217px;
  min-height: 212px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper:hover {
  background: linear-gradient(180deg, rgb(8, 0, 16) 0%, rgb(31, 0, 64) 100%) !important;
  cursor: pointer;
  color: #ffffff;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper:hover a {
  color: #ffffff;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper a {
  color: #1d1e30;
  display: flex;
  flex-direction: column;
  text-decoration: none;
  font-family: volte_medium;
  text-decoration: none;
  font-style: normal;
  transition-property: color;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .img-contr {
  position: relative;
  height: 122px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .img-contr img {
  border-radius: 6px;
  max-width: 100%;
  height: 100%;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .img-contr .video-icon {
  font-size: 36px;
  top: 50%;
  left: 50%;
  right: 0;
  transform: translate(-50%, -50%);
  text-align: center;
  position: absolute;
  z-index: 2;
  width: 40px;
  height: 40px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .img-contr .video-icon .play-icon {
  content: "";
  position: absolute;
  background-image: url(/82c02356ff762a5ea927ea1f3e9d1f21.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  height: 100%;
  width: 100%;
  left: 0;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .text-contr {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 10px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .text-contr .text {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  white-space: normal;
  overflow: hidden;
  font-weight: 400;
  line-height: 100%;
  font-size: 18px;
  font-family: volte_reg, Tahoma, sans-serif;
  height: 36px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper .text-contr .time-duration {
  font-size: 14px;
  margin-top: 12px;
  font-family: volte_reg, Tahoma, sans-serif;
  min-height: 14px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper a.view-all {
  color: #e10092;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 14px;
  width: 100%;
  height: 190px;
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper.view-all-card-btn {
  border: 1px solid #e10092;
  border-radius: 5px;
}
@media screen and (max-width: 480px) {
  section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper.view-all-card-btn {
    height: 135px;
  }
}
section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper.view-all-card-btn:hover {
  background: #fff !important;
}
section.help-video-card-section.video-wrapper .help-video-rail {
  overflow-x: scroll;
  overflow-y: hidden;
}
section.help-video-card-section.video-wrapper .help-video-rail li {
  flex: 0 0 auto;
}
section.help-video-card-section.video-wrapper .help-video-rail::-webkit-scrollbar {
  display: none;
}
section.help-video-card-section.video-wrapper .slick-slide img {
  margin: auto;
  height: 100%;
  cursor: pointer;
  width: 100%;
  position: static;
}
section.help-video-card-section.video-wrapper .vdo-btn-contr {
  margin-top: 20px;
  display: flex;
  justify-content: center;
}
section.help-video-card-section.video-wrapper .arrow-icon {
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  section.help-video-card-section.video-wrapper .heading-md {
    margin-bottom: 15px;
    text-align: left;
    display: flex;
  }
  section.help-video-card-section.video-wrapper .heading-md .heading1 {
    font-size: 20px;
  }
  section.help-video-card-section.video-wrapper .heading-md .arrow-icon {
    margin: 5px;
  }
}
@media screen and (max-width: 599px) {
  section.help-video-card-section.video-wrapper .video-contr {
    display: flex;
    overflow-x: scroll;
    overflow-y: hidden;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper {
    width: 149px !important;
    flex: 0 0 auto;
    margin: 5px;
    max-height: 140px;
    min-height: 135px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper a.view-all {
    height: 100% !important;
    font-size: 14px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper .img-contr {
    max-width: 100%;
    height: 79px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper .img-contr .video-icon {
    height: 30px;
    width: 30px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper .text-contr {
    padding-top: 8px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper .text-contr .text {
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    overflow: hidden;
    height: 30px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper .text-contr .time-duration {
    margin-top: 0;
    font-size: 10px;
  }
  section.help-video-card-section.video-wrapper .video-contr li.helpvideo-item-wrapper .text-contr .cta-contr {
    width: auto;
  }
  section.help-video-card-section.video-wrapper .video-contr::-webkit-scrollbar {
    display: none;
  }
}
@media only screen and (min-width: 941px) and (max-width: 1170px) {
  section.help-video-card-section.video-wrapper .video-contr.see-all-page {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 10px;
  }
  section.help-video-card-section.video-wrapper .video-contr.see-all-page li.helpvideo-item-wrapper {
    height: 100% !important;
    width: 100% !important;
    margin: 0;
  }
  section.help-video-card-section.video-wrapper .video-contr.see-all-page li.helpvideo-item-wrapper .img-contr img {
    width: 100%;
  }
}
@media only screen and (min-width: 481px) and (max-width: 940px) {
  section.help-video-card-section.video-wrapper .video-contr.see-all-page {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 8px;
  }
  section.help-video-card-section.video-wrapper .video-contr.see-all-page li.helpvideo-item-wrapper {
    height: 100% !important;
    width: 100% !important;
    margin: 0;
  }
  section.help-video-card-section.video-wrapper .video-contr.see-all-page li.helpvideo-item-wrapper .img-contr img {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  section.help-video-card-section.video-wrapper .video-contr.see-all-page {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-gap: 8px;
  }
  section.help-video-card-section.video-wrapper .video-contr.see-all-page li.helpvideo-item-wrapper {
    height: 100% !important;
    width: 100% !important;
    margin: 0;
  }
  section.help-video-card-section.video-wrapper .video-contr.see-all-page li.helpvideo-item-wrapper .img-contr img {
    width: 100%;
  }
  section.help-video-card-section.video-wrapper .video-contr .helpvideo-item-wrapper.view-all-card-btn {
    height: 135px;
  }
}
@media screen and (min-width: 600px) and (max-width: 800px) {
  section.help-video-card-section.video-wrapper .video-contr .slick-arrow.slick-next {
    right: -10px;
  }
  section.help-video-card-section.video-wrapper .video-contr .slick-arrow.slick-prev {
    left: -10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.helpful-tracker-container {
  margin-top: 20px;
}
.helpful-tracker-container.container {
  padding-bottom: 20px !important;
}
.helpful-tracker-container .resolve-contr {
  background: #f4f2f6 !important;
  padding: 10px;
  border-radius: 6px;
  margin-top: 10px;
  width: 480px;
  max-width: 100%;
}
.helpful-tracker-container .resolve-contr.more-help-contr {
  width: 100%;
  padding: 25px 20px;
  margin-top: 40px;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper .label-text {
  font-size: 18px;
  font-family: volte_medium, sans-serif;
  font-weight: 400;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful {
  display: inline-block;
  margin-left: 30px;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li {
  height: 40px;
  width: 40px;
  display: inline-block;
  background: #fff;
  padding: 10px;
  border-radius: 50%;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li .thumb-up {
  background-image: url(/a0fe8cc01d98a58cc66ed569db0b984e.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li .thumb-down {
  background-image: url(/f2b3f8c58940a54b3d46dbf40bf1e88e.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  width: 20px;
  height: 20px;
  cursor: pointer;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li.active {
  background: #fff;
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li.active .thumb-up {
  background-image: url(/b6868522c708df0f8995cd51e738d2f8.svg);
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li.active .thumb-down {
  background-image: url(/e0f86e267a5bc24608692c5e73ae0c62.svg);
}
.helpful-tracker-container .resolve-contr .issue-resolve-wrapper ul.helpful li + li {
  margin-left: 10px;
}
.helpful-tracker-container .resolve-contr .topic {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 10px;
}
.helpful-tracker-container .resolve-contr .topic .text-contr {
  width: calc(100% - 50px);
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .text {
  width: calc(100% - 50px);
  font-size: 18px;
  font-family: volte_reg, tahoma, sans-serif;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .text-ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr {
  width: 140px;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr .btn-tertiary {
  background: transparent;
  border: 1px solid #e10092;
  color: #e10092;
  text-decoration: none;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr .btn-tertiary:hover {
  background: #e10092;
  border: 1px solid transparent;
  color: #fff;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr .btn-sm {
  padding: 8px 20px;
  min-width: max-content;
  height: auto;
  line-height: inherit;
  margin-right: 0;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr .btn {
  margin: 0;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  vertical-align: middle;
  border-radius: 22px;
  font-size: 18px;
  text-transform: none;
  box-shadow: none;
  font-family: volte_medium;
}
.helpful-tracker-container .resolve-contr .topic .link-contr {
  width: 120px;
  text-align: center;
  position: relative;
}
.helpful-tracker-container .resolve-contr .topic .link-contr .active {
  content: "";
  position: absolute;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  background: #00a000;
  top: 4px;
  right: 0;
}
.helpful-tracker-container .resolve-contr .topic .icon-contr {
  width: 32px;
  margin-right: 15px;
  display: flex;
  position: relative;
  height: 32px;
  background: #d1d1d1;
  border-radius: 50%;
  text-align: center;
  justify-content: center;
}
.helpful-tracker-container .resolve-contr .topic .icon-contr img {
  max-width: 100%;
}
.helpful-tracker-container .resolve-contr .topic .icon-contr .active {
  background: #0cc042;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  right: -4px;
}
.helpful-tracker-container .resolve-contr .solve {
  margin-top: 0px;
}
.helpful-tracker-container .resolve-contr .solve .solve-down {
  display: flex;
  margin-top: 0px;
  align-items: center;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form {
  display: block;
  margin-top: 10px;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form p {
  font-family: volte_medium;
  font-size: 16px;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form p + p {
  margin-top: 10px;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form textarea {
  margin-top: 5px !important;
  padding: 5px 5px 5px 12px;
  resize: none;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control,
.helpful-tracker-container .resolve-contr .hc-feedback-form input.form-control {
  display: block;
  width: 100%;
  height: auto;
  line-height: 18px;
  background-color: #F9F8FA;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  box-sizing: border-box;
  margin: 0;
  font-family: volte_reg;
  font-size: 14px;
  /* width */
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control::placeholder,
.helpful-tracker-container .resolve-contr .hc-feedback-form input.form-control::placeholder {
  color: #ccc;
  font-size: 14px;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control::-webkit-scrollbar,
.helpful-tracker-container .resolve-contr .hc-feedback-form input.form-control::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  cursor: pointer;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control::-webkit-scrollbar-thumb,
.helpful-tracker-container .resolve-contr .hc-feedback-form input.form-control::-webkit-scrollbar-thumb {
  background: #f4f2f6;
  border-radius: 0;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control:hover::-webkit-scrollbar-thumb,
.helpful-tracker-container .resolve-contr .hc-feedback-form input.form-control:hover::-webkit-scrollbar-thumb {
  background: #cccccc;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control::-webkit-scrollbar-track,
.helpful-tracker-container .resolve-contr .hc-feedback-form input.form-control::-webkit-scrollbar-track {
  box-shadow: none;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .form-control:focus {
  background-color: #fff;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .error {
  display: flex;
  font-size: 14px !important;
  color: #e56c6c;
  font-family: "volte_medium" !important;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .bottom {
  margin-top: 10px;
  font-family: volte_reg;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form .button {
  background: #E10092 !important;
  color: #fff;
  cursor: pointer;
  border: 0;
  border-radius: 22px;
  font-size: 18px;
  font-weight: 600;
  font-family: volte_reg;
  padding: 8px 20px;
  min-width: max-content;
  height: auto;
  line-height: inherit;
}
.helpful-tracker-container .resolve-contr .hc-feedback-form button:disabled {
  opacity: 0.65;
  pointer-events: none;
}
.helpful-tracker-container .resolve-contr .feedback-success-card {
  width: 100%;
  padding: 10px !important;
  background: #fff !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6) !important;
  margin-top: 10px;
  border: 0;
}
.helpful-tracker-container .resolve-contr .feedback-success-card .card-body {
  display: flex;
  align-items: center;
  padding-bottom: 0 !important;
  padding: 15px;
  padding-top: 0;
}
.helpful-tracker-container .resolve-contr .feedback-success-card .card-body .icon-contr {
  width: 40px;
  height: 40px;
  margin-right: 20px;
}
.helpful-tracker-container .resolve-contr .feedback-success-card .card-body .icon-contr img {
  width: 100%;
  height: 100%;
}
.helpful-tracker-container .resolve-contr .feedback-success-card .card-body .text-contr {
  width: calc(100% - 50px);
}
.helpful-tracker-container .resolve-contr .feedback-success-card .card-body .text-contr p {
  line-height: 24px;
  font-family: volte_medium;
}
.helpful-tracker-container .resolve-contr .feedback-success-card .card-body .text-contr p + p {
  margin-top: 15px;
  font-family: volte_reg;
}
.helpful-tracker-container .chatboticon {
  height: 85px;
  width: 85px;
  position: absolute;
  bottom: 20px;
  right: 20px;
  cursor: pointer;
}
.helpful-tracker-container .chatboticon img {
  height: 100%;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .helpful-tracker-container .resolve-contr.solve .solve-down {
    flex-direction: column;
  }
  .helpful-tracker-container .resolve-contr .help-center-container .btn-sm {
    padding: 8px 20px !important;
    min-width: max-content;
    height: auto;
    line-height: inherit;
  }
  .helpful-tracker-container .resolve-contr .issue-resolve-wrapper .label-text {
    font-size: 16px;
  }
  .helpful-tracker-container .resolve-contr .hc-feedback-form .error {
    font-size: 12px !important;
  }
  .helpful-tracker-container .resolve-contr .hc-feedback-form .button {
    font-size: 14px;
  }
  .helpful-tracker-container .resolve-contr .feedback-success-card .card-body .icon-contr {
    width: 35px;
    height: 35px;
  }
  .helpful-tracker-container .resolve-contr .feedback-success-card .card-body .text-contr p {
    font-size: 16px;
    line-height: 18px;
  }
}

@media screen and (max-width: 768px) {
  .helpful-tracker-container .chatboticon {
    position: fixed;
    bottom: 20px;
    right: 20px;
  }
  .helpful-tracker-container .resolve-contr.more-help-contr {
    width: 100%;
    padding: 20px 10px;
  }
  .helpful-tracker-container .resolve-contr .topic {
    margin-top: 10px;
  }
  .helpful-tracker-container .resolve-contr .topic .text-contr .text {
    font-size: 16px;
  }
  .helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr {
    width: 144px;
  }
  .helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr .btn {
    background: transparent;
    border: 1px solid #e10092;
    color: #e10092;
    text-decoration: none;
    padding: 9px 20px;
    font-size: 14px;
    width: auto;
    height: auto;
    line-height: 20px;
    min-width: max-content;
  }
  .helpful-tracker-container .resolve-contr .topic .text-contr .cta-contr .btn-sm {
    height: auto;
    line-height: inherit;
  }
  .helpful-tracker-container .resolve-contr .solve {
    margin-top: 0;
  }
  .helpful-tracker-container .resolve-contr .solve .solve-down {
    display: flex;
    margin-top: 0px;
    align-items: center;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.video-detail-page .result-section .indv-video-contr .body-contr .content-detail div {
  font-family: volte_reg, Tahoma;
  font-size: 18px;
  line-height: 24px;
  color: #1D1E30;
}
@media screen and (max-width: 768px) {
  .video-detail-page .result-section .indv-video-contr .body-contr .content-detail div {
    font-size: 16px;
    line-height: 22px;
  }
}

.related-video-section {
  background-color: #ffffff;
}
.related-video-section .horizontal-line {
  border-bottom: 1px solid #e0e5eb;
  box-shadow: 0px -1px 7.2px 2px #ced4da;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.user-comment1,
.agent-comment1 {
  width: 500px;
  max-width: 100%;
}

.light {
  background: #F4F2F6;
}

.agent-comment1 {
  position: relative;
  padding: 10px;
  border-radius: 3px;
}
.agent-comment1 .top {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.agent-comment1 .top .user-shortname {
  height: 28px;
  width: 28px;
  border-radius: 50%;
  line-height: 30px;
  text-align: center;
  background: #6B00DD;
  color: #fff;
  margin-right: 10px;
  font-size: 14px;
}
.agent-comment1 .top .user-shortname .username-text {
  height: 28px;
  width: 28px;
  border-radius: 50%;
  line-height: 30px;
  text-align: center;
  background: #E10092;
  color: #fff;
  margin-right: 10px;
  font-size: 14px;
}
.agent-comment1 .top .user-shortname .logged-out-profile {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  text-align: center;
  cursor: pointer;
  background-color: #E10092;
  border: 0.5px solid #E10092;
}
.agent-comment1 .top .user-name {
  font-size: 14px;
  font-family: volte_medium, sans-serif;
}
.agent-comment1 .comments {
  font-size: 14px;
  font-family: volte_medium, sans-serif;
  word-wrap: break-word;
  white-space: normal;
}
.agent-comment1 .time {
  font-size: 14px;
  color: #575757;
  margin-top: 5px;
  font-family: volte_medium, sans-serif;
}

.user-comment1 {
  position: relative;
  padding: 10px;
}
.user-comment1 .top {
  display: flex;
  align-items: center;
  margin-bottom: 5px;
}
.user-comment1 .top .user-shortname {
  height: 28px;
  width: 28px;
  border-radius: 50%;
  line-height: 30px;
  text-align: center;
  background: #E10092 !important;
  color: #fff;
  margin-right: 10px;
  font-size: 14px;
}
.user-comment1 .top .user-name {
  font-size: 14px;
  font-family: volte_medium, sans-serif;
}
.user-comment1 .comments {
  font-size: 14px;
  font-family: volte_medium, sans-serif;
  font-weight: none;
}
.user-comment1 .time {
  font-size: 14px;
  color: #575757;
  margin-top: 5px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

section.altBg {
  background: rgba(34, 0, 70, 0.1);
}
section.faq-wrapper .heading-md {
  position: relative;
}
section.faq-wrapper .heading-md .heading1 {
  color: #1d1e30;
  position: relative;
  z-index: 2;
  font-size: 35px !important;
  font-family: volte_reg !important;
}
section.faq-wrapper .heading-md:before {
  content: "";
  position: absolute;
  left: -4px;
  top: -15px;
  width: 80px;
  height: 80px;
  z-index: 0;
}
section.faq-wrapper .heading-md .heading1,
section.faq-wrapper .heading-md .heading-sm .heading1 {
  margin-bottom: 0;
  font-size: 35px;
  font-family: sky_reg, Tahoma, sans-serif;
}
section.faq-wrapper .accordion {
  position: relative;
  background: #fff;
  border: 0;
  border-radius: 8px;
  box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6);
}
section.faq-wrapper .accordion.active-Faq-btn {
  overflow: hidden;
  max-height: 2000px;
  transition: max-height 2s ease-in-out;
}
section.faq-wrapper .accordion.close-Faq-btn {
  overflow: hidden;
  max-height: 240px;
  transition: max-height 6s cubic-bezier(0, 1, 0, 1);
}
section.faq-wrapper .accordion .card {
  border: 0;
  border-bottom: 1px solid #dbdbdb;
  background: transparent;
  font-size: 18px;
}
section.faq-wrapper .accordion .card:last-child {
  border-bottom: none;
}
section.faq-wrapper .accordion .card .card-header {
  padding: 0;
  border: 0;
  background: transparent;
}
section.faq-wrapper .accordion .card .card-header:first-child {
  border-radius: 0;
}
section.faq-wrapper .accordion .card .card-header div {
  color: #1d1e30;
  display: block;
  padding: 17.5px;
  cursor: pointer;
  position: relative;
  border-radius: 8px;
  justify-content: space-between;
}
section.faq-wrapper .accordion .card .card-header div .arrow-icon {
  width: 15px;
  padding-bottom: 1px;
}
section.faq-wrapper .accordion .card .card-header div .accordion-title {
  font-size: 18px;
  font-weight: 400;
  font-family: volte_reg;
  margin-right: 8px;
  color: #1d1e30;
}
section.faq-wrapper .accordion .card .card-header div .active-accordion-title {
  font-family: volte_medium, sans-serif;
  height: auto;
}
section.faq-wrapper .accordion .card .card-body {
  padding: 15px;
  padding-top: 0;
  color: #1d1e30;
}
section.faq-wrapper .accordion .card .card-body div {
  font-size: 18px;
  font-family: volte_reg, Tahoma, sans-serif;
  line-height: 24px;
}
section.faq-wrapper .accordion .card .card-body .delete-account {
  margin-top: 10px;
}
section.faq-wrapper .accordion .card .card-body .delete-account.delete-acc-disable {
  width: fit-content;
  cursor: not-allowed;
}
section.faq-wrapper .accordion .card .card-body .delete-account a {
  text-decoration: none;
}
section.faq-wrapper .accordion .card .card-body .delete-account .link-disable {
  pointer-events: none;
  cursor: not-allowed;
  color: #766a84;
}
section.faq-wrapper .accordion .card .card-body .delete-account p {
  color: #e10092;
}
section.faq-wrapper .accordion .card .card-body .delete-account p span {
  cursor: pointer;
}
section.faq-wrapper .accordion .card .collapse-show {
  overflow: hidden;
  max-height: 1000px;
  transition: max-height 2s ease-in-out;
}
section.faq-wrapper .accordion .card .collapse-hide {
  overflow: hidden;
  max-height: 0px;
  transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
}
section.faq-wrapper .accordion .acc-last-card {
  border-bottom: none;
}
section.faq-wrapper .no-border {
  border-radius: 0;
  box-shadow: none;
}
section.faq-wrapper .no-border .card .card-header div {
  padding-left: 0px;
}
section.faq-wrapper .no-border .card .card-body {
  padding-left: 0px;
}
section.faq-wrapper .view-more-btn {
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  section.faq-wrapper .view-more-btn {
    width: 100% !important;
  }
  section.faq-wrapper .view-more-btn:hover .btn {
    background: transparent;
    border: 1px solid #e10092;
    color: #e10092;
  }
  section.faq-wrapper .heading-md {
    margin-bottom: 15px;
    text-align: left;
  }
  section.faq-wrapper .heading-md .heading1 {
    padding: 0;
    font-size: 20px !important;
  }
  section.faq-wrapper .heading-md .heading2 {
    margin-top: 8px;
    font-size: 22px;
  }
  section.faq-wrapper .accordion.close-Faq-btn {
    max-height: 320px;
  }
  section.faq-wrapper .accordion .card .card-header div .accordion-title {
    font-size: 16px;
  }
  section.faq-wrapper .accordion .card .card-body div {
    font-size: 16px;
    line-height: 18px;
  }
  section.faq-wrapper .view-more-btn {
    width: max-content;
  }
  section.faq-wrapper .view-more-btn a.btn {
    height: auto;
    line-height: inherit;
    padding: 8px 20px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.search-screen-container {
  min-height: 100vh;
  background: linear-gradient(60deg, rgb(8, 0, 16) 0%, rgb(31, 0, 64) 100%) !important;
}

section.search-section {
  padding-top: 40px;
  padding-bottom: 40px;
  background: linear-gradient(60deg, rgb(8, 0, 16) 0%, rgb(31, 0, 64) 100%) !important;
  color: #fff;
}
section.search-section .search-container {
  width: 996px;
  padding-left: 0;
  padding-right: 0;
  margin: auto;
}
section.search-section .search-container .heading-md {
  text-align: center;
  z-index: 3;
  position: relative;
  padding-left: 0;
}
section.search-section .search-container .heading-md .heading1 {
  font-size: 35px;
  color: #ffffff;
  font-family: volte_reg;
  letter-spacing: -1px;
}
section.search-section .search-container .location-info-contr {
  margin: 0 auto 20px;
  display: flex;
  align-items: center;
  position: relative;
  max-width: 100%;
  z-index: 3;
  transition: width 0.1s ease-in-out;
  width: 100%;
}
section.search-section .search-container .location-info-contr .location-details {
  max-width: 100%;
  width: 68.5%;
  margin: 0 auto;
  background: #fff;
  height: 48px;
  display: flex;
  box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.1);
  border-radius: 6px;
}
section.search-section .search-container .location-info-contr .location-details .search-add {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 24px);
}
section.search-section .search-container .location-info-contr .location-details .search-add .form-control,
section.search-section .search-container .location-info-contr .location-details .search-add input.form-control {
  display: block;
  width: 100%;
  height: 20px;
  padding: 5px 5px 5px 12px;
  line-height: 18px;
  background-color: transparent;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
  text-overflow: ellipsis;
  box-sizing: border-box;
  margin: 0;
  font-size: 18px;
  font-family: volte_reg, Tahoma, sans-serif;
}
@media screen and (max-width: 768px) {
  section.search-section .search-container .location-info-contr .location-details .search-add .form-control,
  section.search-section .search-container .location-info-contr .location-details .search-add input.form-control {
    font-size: 14px;
  }
}
@supports (-webkit-touch-callout: none) {
  @media screen and (max-width: 768px) {
    section.search-section .search-container .location-info-contr .location-details .search-add .form-control,
    section.search-section .search-container .location-info-contr .location-details .search-add input.form-control {
      font-size: 14px;
    }
  }
}
section.search-section .search-container .location-info-contr .location-details .search-add input[type=text]:focus:not([readonly]) {
  background: transparent;
}
section.search-section .search-container .location-info-contr .location-details .search-add .form-control::-webkit-input-placeholder {
  color: #b3b3b3;
  opacity: 1;
  font-family: SkyTextRegular, sans-serif;
}
section.search-section .search-container .location-info-contr .location-details .search-add .form-control.active::-webkit-input-placeholder,
section.search-section .search-container .location-info-contr .location-details .search-add .form-control:focus {
  color: #1d1e30 !important;
  opacity: 1;
  font-family: SkyTextRegular, sans-serif;
}
section.search-section .search-container .location-info-contr .location-details .search-add select.form-control,
section.search-section .search-container .location-info-contr .location-details .search-add input.form-control {
  height: auto !important;
  appearance: none;
}
section.search-section .search-container .location-info-contr .location-details .icon-contr {
  padding: 0;
  line-height: 48px;
  height: 48px;
  float: left;
  position: relative;
  display: flex;
  align-items: center;
}
section.search-section .search-container .location-info-contr .location-details .search-global {
  padding: 0 0 0 12px;
}
section.search-section .search-container .location-info-contr .location-details .search-speaker {
  padding: 0 12px;
}
section.search-section .search-container .location-info-contr .location-details .search-back {
  padding: 0 0 0 12px;
}
section.search-section .search-container .location-info-contr .location-details .search-close {
  height: 13px;
  width: 13px;
}
section.search-section .search-container .location-info-contr .location-details .search-back a {
  height: 13px !important;
}
section.search-section .search-container .location-info-contr .location-details .icon-contr a {
  display: flex;
  opacity: 0.7;
  height: 18px;
}
section.search-section .search-container .location-info-contr .location-details .icon-contr a .search-close {
  height: auto;
}
section.search-section .search-container.search-inner-page .search-global-back {
  margin-right: 10px;
  position: absolute;
  cursor: pointer;
}
section.search-section .search-container img {
  cursor: pointer;
}
section.search-section .search-container .most-search {
  margin-top: 16px;
  width: 70%;
  max-width: 100%;
  display: flex;
  align-items: center;
}
section.search-section .search-container .most-search .heading-md {
  margin-bottom: 0;
  margin-right: 20px;
  width: 100px;
  text-align: left;
  position: relative;
  z-index: 0;
}
section.search-section .search-container .most-search .heading1 {
  font-size: 14px !important;
  font-family: volte_medium, sans-serif;
}
section.search-section .search-container .most-search ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin: -5px;
  width: calc(100% - 100px);
}
section.search-section .search-container .most-search ul li {
  margin: 5px;
  background: rgb(51, 53, 77);
  border-radius: 14px;
  float: left;
  border: 1px solid rgb(68, 71, 100);
}
section.search-section .search-container .most-search ul li a {
  padding: 0 15px;
  font-size: 14px;
  display: inline-block;
  color: rgb(163, 166, 194);
  height: 28px;
  line-height: 30px;
}
section.search-section .search-container .most-search ul li a:hover {
  color: #ffffff;
}
section.search-section .search-container .searched-data-block {
  width: 70%;
  display: block;
  margin: auto;
  max-height: 100vh;
  min-height: 100vh;
  padding: 15px;
}
section.search-section .search-container .searched-data-block .heading-md {
  margin-bottom: 15px !important;
}
section.search-section .search-container .searched-data-block .heading-md .heading1 {
  font-family: volte_medium, sans-serif !important;
}
section.search-section .search-container .searched-data-block .searched-data {
  height: 75vh;
  overflow-y: auto;
}
section.search-section .search-container .searched-data-block .searched-data ul li {
  border-bottom: 0.5px solid #3a2053;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgb(163, 166, 194);
  padding: 8px 0;
  font-size: 18px;
  box-sizing: border-box;
  cursor: pointer;
  font-style: normal;
  transition-property: color;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
section.search-section .search-container .searched-data-block .searched-data ul li span:first-child {
  width: calc(100% - 40px);
  font-size: 18px;
  font-family: volte_medium, sans-serif;
}
section.search-section .search-container .searched-data-block .searched-data ul li span.video-tag {
  height: 20px;
  padding: 2px 10px;
  font-size: 12px;
  margin-left: 10px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  color: rgb(163, 166, 194);
}
section.search-section .search-container .searched-data-block .searched-data ul li span.video-tag .video-icon {
  display: inline-block;
  text-align: center;
  height: 15px;
  margin-right: 8px;
}
section.search-section .search-container .searched-data-block .searched-data ul li span.video-tag .video-icon img {
  max-height: 100%;
}
section.search-section .search-container .searched-data-block .nores-outer {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center;
  margin-top: 20px;
  word-break: break-word;
}
section.search-section .search-container .searched-data-block .nores-outer .heading {
  font-size: 20px;
  font-family: volte_medium, sans-serif;
  margin-bottom: 5px;
}
section.search-section .search-container .searched-data-block .nores-outer .text {
  font-family: volte_reg, sans-serif;
}
section.search-section .search-container .searched-data-block .nores-icon {
  height: 70px;
  width: 70px;
  margin-bottom: 20px;
}
section.search-section .search-container .searched-data-block .nores-icon img {
  max-width: 100%;
  width: 70px;
}
section.search-section .search-container .searched-data-block .mostly-asked section .container {
  padding: 0;
}
section.search-section .search-container .searched-data-block .mostly-asked section h2 {
  color: #ffffff;
  font-size: 18px !important;
  font-family: volte_medium, sans-serif;
  margin-bottom: 15px;
  text-align: left;
}
section.search-section .search-container .searched-data-block .mostly-asked section.faq-wrapper .accordion {
  box-shadow: none;
  max-height: calc(100vh - 120px);
  overflow: auto;
}
@media screen and (max-width: 768px) {
  section {
    padding-top: 30px;
    padding-bottom: 30px;
    position: relative;
  }
  section.search-section {
    padding: 30px 10px;
    position: relative;
    background: linear-gradient(60deg, rgb(8, 0, 16) 0%, rgb(31, 0, 64) 100%) !important;
    color: #fff;
  }
  section.search-section .search-container {
    width: 100%;
    padding: 0;
  }
  section.search-section .search-container .heading-md {
    margin-bottom: 15px;
  }
  section.search-section .search-container .heading-md .heading1 {
    font-size: 20px;
  }
  section.search-section .search-container .location-info-contr {
    width: 100%;
    margin: 0 auto;
    padding: 0;
  }
  section.search-section .search-container .location-info-contr .search-global-back {
    margin-right: 10px;
  }
  section.search-section .search-container .location-info-contr .location-details {
    width: 100%;
    height: 33px;
  }
  section.search-section .search-container .location-info-contr .location-details .icon-contr {
    line-height: 33px;
    height: 33px;
  }
  section.search-section .search-container.search-inner-page .search-global-back {
    position: relative;
  }
  section.search-section .search-container .searched-data-block {
    width: 100%;
    padding: 15px 10px;
    min-height: 100vh;
  }
}
@media screen and (min-width: 769px) and (max-width: 1023px) {
  section.search-section .search-container {
    width: 100%;
    padding: 0 24px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.reopen-modal .modal-body-container {
  width: 100%;
  position: fixed;
  bottom: 0;
  height: 100vh;
  display: flex;
  justify-content: center;
  overflow: hidden;
  z-index: 10001;
  text-align: center;
  left: 0;
  animation: fadeInDown 0.8s;
}
.reopen-modal .popup-body {
  position: fixed;
  border-radius: 5px;
  width: 498px;
  line-height: 1.4;
  background: #fff;
  border: 0.11rem solid rgba(0, 0, 0, 0.1);
  overflow: hidden;
  animation: fadeInDown 1s;
  margin: 29px;
  padding-bottom: 20px;
}
@keyframes fadeInDown {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
.reopen-modal .modal-fullbody {
  padding: 0 15px 0 20px;
}
.reopen-modal .modal-header.ticketinfo {
  height: 38px;
  width: 230px;
  border-radius: 0 0 70px 0;
  background: rgb(19, 0, 40);
  background: linear-gradient(90deg, rgb(19, 0, 40) 0%, rgb(34, 0, 70) 100%);
  color: #fff;
  display: flex;
  align-items: center;
  padding: 12px 22px 12px 20px;
}
.reopen-modal .modal-header.ticketinfo:before {
  content: "";
  position: absolute;
  z-index: 1;
  height: 160px;
  width: 250px;
  border-radius: 0 0 70px 0;
  left: 0;
  top: -120px;
  background: linear-gradient(90deg, rgb(19, 0, 40) 0%, rgb(34, 0, 70) 100%);
  overflow: hidden;
}
.reopen-modal .hovering {
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  width: 171px;
  height: 22px;
}
.reopen-modal .requestId {
  white-space: nowrap;
  display: inline-block;
  width: 171px;
}
.reopen-modal .requestId:not(:hover) {
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 3px;
  font-size: 17px;
}
.reopen-modal .requestId:hover {
  overflow: initial;
  animation-name: marqee;
  animation-duration: 4s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  margin-top: 3px;
  font-size: 17px;
}
.reopen-modal .ticketpara {
  line-height: 45px;
  font-size: 17px;
  display: flex;
}
.reopen-modal .reopencomment {
  display: flex;
  color: #1d1e30;
  font-weight: 1000;
  font-size: 17px;
}
.reopen-modal .form-control {
  width: 100%;
  height: 20px;
  padding: 5px 5px 5px 12px;
  line-height: 18px;
  background-color: transparent;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  box-sizing: border-box;
  color: #495057;
  font-size: 18px;
}
.reopen-modal textarea {
  height: 100px !important;
}
.reopen-modal textarea:focus {
  outline: none !important;
  border: 1px solid #80bdff;
  box-shadow: 0 0 10px #80bdff;
}
.reopen-modal .error {
  display: flex;
  font-size: 12px;
  color: #e56c6c;
}
.reopen-modal .suggestion {
  display: flex;
  font-size: 12px;
}
.reopen-modal .bottom {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
  font-family: volte_reg;
}
.reopen-modal .button {
  min-width: calc(40% - 26px);
  height: 44px;
  line-height: 37px;
  margin: 6px;
  cursor: pointer;
  border-radius: 20px;
  border: 1px solid #e10092;
  font-size: 17px;
  font-family: volte_reg;
  font-weight: 600;
}
.reopen-modal .button.reopen {
  background: #e10092 !important;
  color: #fff;
}
.reopen-modal .button.close {
  color: #e10092;
  background-color: #fff;
}
.reopen-modal .button.close:hover {
  background: #e10092 !important;
  color: #fff;
}
@media screen and (max-width: 530px) {
  .reopen-modal .popup-body {
    border-radius: 15px 15px 0 0;
    width: 100%;
    margin: -1px auto;
    animation: animatebottom 1s;
  }
  @keyframes animatebottom {
    from {
      bottom: -300px;
      opacity: 0;
    }
    to {
      bottom: 0;
      opacity: 1;
    }
  }
  .reopen-modal .button {
    width: calc(100% - 24px);
    font-size: 15px;
  }
  .reopen-modal p {
    line-height: 18px;
  }
  .reopen-modal .ticketpara {
    line-height: 18px;
    margin: 10px 0 10px 0px;
  }
  .reopen-modal .form-control {
    font-size: 14px;
  }
  .reopen-modal .bottom {
    display: block;
  }
  .reopen-modal .modal-header.ticketinfo {
    padding: 15px 0 10px 22px;
  }
  .reopen-modal .error {
    display: flex;
  }
  .reopen-modal .requestId:not(:hover) {
    margin-top: 0px;
  }
}
@media screen and (max-width: 365px) {
  .reopen-modal .ticketpara {
    line-height: 18px;
    font-size: 15px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.stepper-wrapper .stepper-head {
  display: flex;
  position: relative;
  width: 100%;
  user-select: none;
  /* styles of vertical stepper */
}
.stepper-wrapper .stepper-head.vertical-stepper-head {
  flex-direction: column;
  width: auto;
  margin-top: 20px;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step {
  display: flex;
  text-align: start;
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.is-complete::after {
  border-left: 2px solid #66C300;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.is-active::after {
  border-left: 2px solid #ccc;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.is-complete .stepper-indicator-info {
  border-color: #66C300;
  background-color: #66C300;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.is-warning .stepper-label {
  padding-inline-start: 0.5rem;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.is-warning .stepper-indicator-info {
  border: 1px solid #ff9000;
  left: -4px;
  background-color: #fff;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.is-warning .stepper-indicator-info::after {
  background: #ff9000;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step:after {
  content: " ";
  position: absolute;
  left: 1.1rem;
  right: auto;
  top: 1rem;
  bottom: -0.5rem;
  width: 0;
  height: auto;
  border-left: 2px solid #ccc;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-step.rightToLeft:after {
  right: 1.5rem;
  left: auto;
}
.stepper-wrapper .stepper-head.vertical-stepper-head .stepper-label {
  padding-inline-start: 1rem;
  margin-bottom: 15px;
  margin-top: 3px;
}
.stepper-wrapper .stepper-head.vertical-stepper-head + .stepper-body {
  margin-inline-start: 3.5rem;
}
.stepper-wrapper .stepper-head .stepper-step {
  position: relative;
  text-align: center;
  padding: 0.5rem;
  flex-basis: 100%;
  padding-bottom: 0;
}
.stepper-wrapper .stepper-head .stepper-step.rightToLeft:after {
  left: -50%;
}
.stepper-wrapper .stepper-head .stepper-step.is-complete::after {
  background-color: #66C300;
}
.stepper-wrapper .stepper-head .stepper-step.is-complete .stepper-indicator-info {
  border-color: #66C300;
  background-color: #66C300;
}
.stepper-wrapper .stepper-head .stepper-step.is-active::after {
  background-color: #ccc;
}
.stepper-wrapper .stepper-head .stepper-step.is-warning .stepper-indicator-info {
  border: 1px solid #ff9000;
  width: 30px;
  height: 30px;
  position: relative;
  bottom: 4px;
  background-color: #fff;
}
.stepper-wrapper .stepper-head .stepper-step.is-warning .stepper-indicator-info::after {
  content: ".";
  width: 20px;
  height: 20px;
  display: inline-block;
  border-radius: 50%;
  background: #ff9000;
  position: absolute;
}
.stepper-wrapper .stepper-head .stepper-step.is-error .stepper-indicator-info {
  border-color: #e95a4b;
  background-color: #e95a4b;
}
.stepper-wrapper .stepper-head .stepper-step.is-error .stepper-label {
  color: #e95a4b;
}
.stepper-wrapper .stepper-head .stepper-step:after {
  content: " ";
  position: absolute;
  left: 50%;
  top: 5rem;
  width: 100%;
  height: 1.8px;
  background-color: #ccc;
  z-index: 1;
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
  .stepper-wrapper .stepper-head .stepper-step:after {
    top: 5.5rem;
  }
}
.stepper-wrapper .stepper-head .stepper-step:last-child:after {
  display: none;
}
.stepper-wrapper .stepper-head .stepper-indicator {
  position: relative;
  display: block;
  z-index: 2;
}
.stepper-wrapper .stepper-head .stepper-indicator-info {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid #ccc;
  border-radius: 50%;
  background-color: #fff;
  font-size: 1rem;
  line-height: 2.5rem;
  text-align: center;
  color: #fff;
  z-index: 2;
}
.stepper-wrapper .stepper-head .stepper-indicator-info .icon-check::before {
  color: #fff;
}
.stepper-wrapper .stepper-head .stepper-indicator-info .stepper-tick {
  font-size: 10px;
  padding-right: 2px;
  padding-top: 1px;
}
.stepper-wrapper .stepper-head .stepper-label {
  position: relative;
  display: block;
  margin: 1rem 0;
  z-index: 2;
}
.stepper-wrapper .stepper-head .stepper-label .step-label {
  font-size: 16px;
  margin-bottom: 2px;
  font-family: volte_medium;
}
.stepper-wrapper .stepper-head .stepper-label .step-date {
  font-size: 12px;
  font-family: volte_reg;
}
.stepper-wrapper .stepper-head .stepper-label .step-date.is-close {
  visibility: hidden;
}
.stepper-wrapper .stepper-body {
  flex: 1;
  min-height: 100px;
  padding: 10px 0;
}

.stepper-with-feedback {
  width: 100%;
}
@media only screen and (max-width: 480px) {
  .stepper-with-feedback {
    width: 40%;
  }
}

.stepper-with-image-block {
  width: 98%;
}
@media only screen and (min-width: 481px) and (max-width: 715px) {
  .stepper-with-image-block .stepper-head .is-date-excceed {
    bottom: 40px;
  }
}
@media only screen and (min-width: 716px) and (max-width: 768px) {
  .stepper-with-image-block .stepper-head .is-date-excceed {
    bottom: 8px;
  }
}
.stepper-with-image-block .stepper-head .is-date-excceed .stepper-indicator {
  bottom: 10px;
}
.stepper-with-image-block .step-date div {
  width: 100%;
}
.stepper-with-image-block .step-date div span {
  display: block;
}
@media only screen and (max-width: 480px) {
  .stepper-with-image-block {
    width: 100%;
  }
  .stepper-with-image-block .step-date div span {
    display: inline;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.ticket-feedback-form {
  width: 41.1%;
  height: 141px;
  border-radius: 6px;
  background: #F4F4F4;
  padding: 10px 6px;
  position: relative;
  right: 35px;
  bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: 15px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2509803922);
}
.ticket-feedback-form .heading {
  font-family: "volte_semiBold";
  font-size: 14px;
  font-weight: 500;
  line-height: 16.8px;
  text-align: center;
}
.ticket-feedback-form ul.feedback-icons {
  display: inline-block;
  margin-top: 12px;
  margin-bottom: 12px;
}
.ticket-feedback-form ul.feedback-icons li {
  height: 28px;
  width: 28px;
  display: inline-block;
}
.ticket-feedback-form ul.feedback-icons li .thumb-up {
  background-image: url(/c1a86663a87d0aec1476f8fa226e6780.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.ticket-feedback-form ul.feedback-icons li .thumb-down {
  background-image: url(/db0f7962dfda6d675fca1d3b4e9b93dc.svg);
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  width: 100%;
  height: 100%;
  cursor: pointer;
}
.ticket-feedback-form ul.feedback-icons li + li {
  margin-left: 20px;
}
.ticket-feedback-form .footer {
  font-family: "volte_reg";
  font-size: 12px;
  font-weight: 400;
  line-height: 13.2px;
  text-align: center;
}

.s360-ticket-block {
  bottom: 2px;
}

@media only screen and (max-width: 480px) {
  .ticket-feedback-form {
    width: 100%;
    position: inherit;
    margin-left: 10px;
    max-width: 195px;
  }
}
@media only screen and (min-width: 480px) and (max-width: 960px) {
  .ticket-feedback-form {
    position: inherit;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.search-result-container .top-result-wrapper .search-result {
  padding-top: 0;
}
.search-result-container .top-result-wrapper .top-result .rs-heading {
  color: #ffffff;
  font-size: 18px;
  font-family: volte_medium, sans-serif;
  margin-bottom: 15px;
}
.search-result-container .top-result-wrapper .rs-heading {
  color: #1d1e30;
}
.search-result-container .top-result-wrapper .sub-section {
  padding: 15px 0;
  border-radius: 10px;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section {
  margin-top: 20px;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section h3 {
  font-size: 18px;
  margin-bottom: 5px;
  font-family: volte_medium, sans-serif;
  color: #1d1e30;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .content-detail {
  font-family: volte_reg, Tahoma;
  font-size: 18px;
  line-height: 22px;
}
@media screen and (max-width: 768px) {
  .search-result-container .top-result-wrapper .sub-section .sub-cat-section .content-detail {
    font-size: 16px;
    line-height: 22px;
  }
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .delete-account {
  margin-top: 10px;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .delete-account.delete-acc-disable {
  width: fit-content;
  cursor: not-allowed;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .delete-account a {
  text-decoration: none;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .delete-account .link-disable {
  pointer-events: none;
  cursor: not-allowed;
  color: #766a84;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .delete-account p {
  color: #e10092;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section .delete-account p span {
  cursor: pointer;
}
.search-result-container .top-result-wrapper .sub-section .sub-cat-section + .sub-cat-section {
  margin-top: 30px;
}
.search-result-container .top-result-wrapper .sub-section.top-result {
  padding: 10px 15px 15px;
}
.search-result-container .top-result-wrapper .sub-section + .sub-section {
  margin-top: 10px;
}
.search-result-container .top-result {
  background: #fff;
  padding: 10px 15px 15px;
  position: relative;
  overflow: hidden;
}
.search-result-container .top-result p {
  line-height: 22px;
}
.search-result-container .top-result:before {
  content: "";
  position: absolute;
  z-index: 1;
  background: #1d1e30;
  height: 160px;
  width: 230px;
  border-radius: 0 0 70px 0;
  left: 0;
  top: -120px;
}
.search-result-container .top-result .content-area {
  position: relative;
  z-index: 2;
}
.search-result-container .top-result .content-area ol, .search-result-container .top-result .content-area ul {
  padding-left: 15px;
  list-style-type: inherit;
  list-style: inherit;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.help-center-container.category-page section.page-header .category-header .img-contr {
  background: #594074 !important;
}
.help-center-container.category-page .category-helpful-tracker {
  margin-top: 41px;
  padding-bottom: 18px;
}
.help-center-container.category-page .container {
  width: 996px;
  max-width: 100%;
  position: relative;
  margin-right: auto;
  margin-left: auto;
}
.help-center-container.category-page .subCategory-faq-wrapper {
  background: #fff;
}
@media screen and (max-width: 768px) {
  .help-center-container.category-page section {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .help-center-container.category-page .category-helpful-tracker {
    margin-top: 30px;
    padding-bottom: 10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.video-see-all-page section.page-header .category-header .img-contr {
  background: #594074 !important;
}
.video-see-all-page .view-less {
  background: rgba(34, 0, 70, 0.1) !important;
  text-align: center;
  padding-bottom: 20px;
}
.video-see-all-page section.help-video-card-section.video-wrapper.altBg {
  min-height: 95vh;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.modal-open {
  overflow: hidden;
}

.ticket {
  background: #ffffff;
  padding: 15px;
  position: relative;
  overflow: hidden;
  margin-bottom: 20px;
  border-radius: 10px;
  box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6);
  margin-bottom: 20px;
}
.ticket .collapse-show {
  max-height: 1000px;
  transition: max-height 7s ease-out;
}
.ticket .collapse-hide {
  overflow: hidden;
  max-height: 0px;
  transition: max-height 3s cubic-bezier(0, 1, 0, 1);
}
.ticket .active-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ticket:before {
  content: "";
  position: absolute;
  z-index: 1;
  height: 160px;
  width: 250px;
  border-radius: 0 0 70px 0;
  left: 0;
  top: -120px;
  background: linear-gradient(90deg, rgb(19, 0, 40) 0%, rgb(34, 0, 70) 100%);
  overflow: hidden;
}
.ticket .wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-left: 10px;
}
.ticket .wrapper .link-view {
  color: #e10092;
  cursor: pointer;
  text-decoration: none;
  font-style: normal;
  transition-property: color;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  font-size: 18px;
}
.ticket .wrapper .request-detail .req-contr .label {
  color: rgb(163, 166, 194) !important;
}
.ticket .content-area {
  position: relative;
  z-index: 2;
}
.ticket .content-area .request-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-top: -5px;
  font-size: 18px;
}
.ticket .content-area .request-top .data {
  line-height: 26px;
  text-align: center;
  border-radius: 0 0 0 3px;
  padding: 2px 10px;
  color: #1d1e30;
  font-size: 18px;
  font-family: volte_reg !important;
}
.ticket .content-area .request-top .done {
  background: rgba(34, 0, 70, 0.5);
  color: #ffffff;
}
.ticket .content-area .request-top .active {
  background: #6b00dd;
  color: #ffffff;
}
.ticket .content-area .request-top .reject {
  background: #ffa200;
}
.ticket .content-area .request-top a {
  font-size: 14px;
}
.ticket .content-area .request-top .label {
  font-family: volte_medium, sans-serif;
  display: flex;
  align-items: center;
  margin-right: 3px;
  color: #ffffff;
}
.ticket .content-area .request-top .label .marquee {
  cursor: default;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  width: 171px;
  height: 22px;
}
.ticket .content-area .request-top .label .marquee-hover {
  cursor: pointer;
}
.ticket .content-area .request-top .label .marquee-hover span:not(:hover) {
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 3px;
}
.ticket .content-area .request-top .label .marquee-hover span:hover {
  overflow: initial;
  animation-name: marqee;
  animation-duration: 4s;
  animation-timing-function: linear;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: normal;
  margin-top: 3px;
}
.ticket .content-area .request-top .label span {
  white-space: nowrap;
  display: inline-block;
  width: 171px;
}
@keyframes marqee {
  0% {
    transform: translateX(0%);
  }
  90% {
    transform: translateX(-150%);
  }
  95% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(0%);
  }
}
.ticket .content-area .request-top .active-status .data {
  padding: 2px 5px !important;
  border-radius: 0 0 3px 3px;
}
.ticket .content-area .request-top .request-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: -10px;
  margin-right: -15px;
}
.ticket .content-area .request-top .request-status .data {
  padding: 2px 10px;
}
.ticket .content-area .info-data {
  margin-top: 20px;
  font-size: 18px;
  font-family: volte_medium, sans-serif !important;
}
.ticket .content-area .label {
  font-family: volte_medium, sans-serif;
  color: #1d1e30;
  display: flex;
  align-items: center;
  margin-right: 3px;
}
.ticket .content-area .label img {
  margin-right: 10px;
}
.ticket .content-area .info-data {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  font-family: volte_medium, sans-serif;
}
.ticket .content-area .info-data img {
  margin-right: 10px;
}
.ticket .content-area .request-detail {
  display: flex;
  flex-wrap: wrap;
  margin: 15px -10px;
  font-size: 18px;
}
.ticket .content-area .request-detail .req-contr {
  margin: 0px 20px 0 10px;
  padding-right: 20px;
  border-right: 1px solid #e1e1e1;
  display: flex;
  align-items: baseline;
}
.ticket .content-area .request-detail .req-contr .label {
  color: #1d1e30;
}
.ticket .content-area .request-detail .req-contr .data {
  text-align: center;
  border-radius: 0 0 0 3px;
  color: #1d1e30;
  font-size: 18px;
  font-family: volte_reg !important;
}
.ticket .content-area .request-detail .req-contr .done {
  background: rgba(29, 30, 48, 0.5);
}
.ticket .content-area .request-detail .req-contr .active {
  background: #04aa6d;
}
.ticket .content-area .request-detail .req-contr .reject {
  background: #ffa200;
}
.ticket .content-area .request-detail .req-contr:last-child {
  margin-left: 0;
  padding-right: 0px;
  border-right: none;
}
.ticket .content-area .date-extended-msg {
  width: 60%;
}
.ticket .content-area .date-extended-msg .label {
  display: block;
}
.ticket .content-area .request-view {
  border-top: 1px solid #e1e1e1;
  padding: 10px;
  margin: 10px -10px -10px;
}
.ticket .content-area .request-view .sts-comment {
  margin: 10px 0;
  text-decoration: none;
  font-style: normal;
}
.ticket .content-area .request-view .sts-comment p {
  line-height: 24px;
  font-size: 18px;
  color: #1d1e30;
  font-family: volte_reg, "Tahoma";
}
.ticket .content-area .request-view .cta-contr {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
.ticket .content-area .request-view .link-view {
  color: #e10092;
  cursor: pointer;
  text-decoration: none;
  font-style: normal;
  transition-property: color;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  font-size: 18px;
  font-family: volte_medium;
}
.ticket .content-area .request-view .link-view:hover {
  text-decoration: none !important;
  transition-property: background;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.ticket .content-area .request-view .reopen-btn {
  color: #e10092;
  cursor: pointer;
  text-decoration: none;
  font-style: normal;
  transition-property: color;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  font-size: 18px;
  font-family: volte_medium;
}
.ticket .content-area .request-view .reopen-btn:hover {
  text-decoration: none !important;
  transition-property: background;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.ticket .content-area .request-view .sts-comment .img-contr {
  margin-top: 10px;
}
.ticket .content-area .request-view .sts-comment .img-contr a {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  position: relative;
}
.ticket .content-area .request-view .sts-comment .img-contr img {
  width: 360px;
  max-width: 100%;
}
.ticket .content-area .request-view .sts-comment .icon-contr {
  margin-top: 5px;
  display: block;
  background: "rgb(181 181 181 / 50%)";
  padding: 5px;
  border-radius: 50%;
  height: 30px;
  width: 30px;
  line-height: 26px;
  text-align: center;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.ticket .content-area .request-view .sts-comment .icon-contr img {
  width: 80%;
}
.ticket .content-area .request-view .sts-comment .container {
  margin: 50px;
  max-width: 700px;
}
.ticket .content-area .request-view .sts-comment .container img {
  width: 100%;
}
.ticket .img-container {
  position: relative;
  width: 360px;
  height: 290px;
  padding-top: 10px;
}
.ticket .img-container .img-banner {
  width: 100%;
  height: 100%;
}
.ticket .img-container .img-zoom {
  margin-top: 5px;
  display: block;
  background: rgba(181, 181, 181, 0.5);
  padding: 5px;
  border-radius: 50%;
  height: 30px;
  width: 30px;
  line-height: 26px;
  text-align: center;
  position: absolute;
  bottom: 10px;
  right: 10px;
}
.ticket .img-container .img-zoom img {
  width: 80%;
  max-width: 100%;
}
.ticket .status-close .sts-comment {
  position: relative;
}
.ticket .status-close .sts-comment:after {
  content: "";
  position: absolute;
  bottom: -10px;
  right: -10px;
  background-image: url(/d76a26e85221ed37a4bf070d9c2e67fe.svg) !important;
  background-repeat: no-repeat;
  background-position: 0 0;
  background-size: contain;
  width: 100px;
  height: 58px;
}

@media screen and (max-width: 768px) {
  .container {
    position: relative;
    padding: 0 10px;
  }
}
@media screen and (max-width: 599px) {
  .container {
    padding: 0 10px;
  }
  .ticket {
    background: #ffffff;
    padding: 10px;
    position: relative;
    overflow: hidden;
    margin-bottom: 20px;
    border-radius: 10px;
    box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6);
    width: 100%;
  }
  .ticket:before {
    content: "";
  }
  .ticket .wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: 10px;
  }
  .ticket .wrapper .link-view {
    font-size: 14px;
  }
  .ticket .content-area {
    position: relative;
    z-index: 2;
  }
  .ticket .content-area .request-top {
    margin-top: 0px;
    font-size: 16px;
  }
  .ticket .content-area .request-top .ticket-no {
    margin-top: 3px;
  }
  .ticket .content-area .request-top .request-status {
    margin-right: -10px;
  }
  .ticket .content-area .request-top .request-status .label {
    font-size: 16px;
  }
  .ticket .content-area .request-top .request-status .data {
    line-height: 16px;
    font-size: 12px;
    padding: 2px 7px;
  }
  .ticket .content-area .info-data {
    font-size: 16px;
    margin-top: 25px;
  }
  .ticket .content-area .label {
    font-size: 16px;
  }
  .ticket .content-area .request-detail {
    margin: 10px -10px;
    font-size: 18px;
  }
  .ticket .content-area .req-contr-active {
    flex-direction: row !important;
  }
  .ticket .content-area .request-detail .req-contr {
    flex-direction: column;
    margin: 0px 9px 0 9px;
    padding-right: 10px;
  }
  .ticket .content-area .request-detail .req-contr .label {
    font-size: 14px;
  }
  .ticket .content-area .request-detail .req-contr .data {
    font-size: 16px;
  }
  .ticket .content-area .date-extended-msg-home {
    width: 75%;
  }
  .ticket .content-area .date-extended-msg {
    width: 44%;
  }
  .ticket .content-area .request-view .link-view {
    font-size: 16px;
  }
  .ticket .content-area .request-view .sts-comment p {
    font-size: 16px;
    line-height: 16px;
  }
  .ticket .status-close .sts-comment:after {
    content: "";
  }
  .ticket .img-container {
    position: relative;
    width: 99%;
    height: 265px;
    padding-top: 10px;
  }
  .ticket .img-container .img-banner {
    width: 100%;
    height: 100%;
  }
  .ticket .img-container .img-zoom {
    margin-top: 5px;
    display: block;
    background: rgba(181, 181, 181, 0.5);
    padding: 5px;
    border-radius: 50%;
    height: 30px;
    width: 30px;
    line-height: 26px;
    text-align: center;
    position: absolute;
    bottom: 10px;
    right: 10px;
  }
  .ticket .img-container .img-zoom img {
    width: 80%;
    max-width: 100%;
  }
  .modal :nth-child(1) .modal-content {
    margin: auto;
    display: block;
    width: 340px !important;
    height: 282px !important;
  }
  .modal :nth-child(1) .close-wrapper {
    margin: auto;
    width: 340px !important;
    padding: 5px;
    transition: 0.3s;
    display: flex;
    justify-content: flex-end;
  }
  .modal :nth-child(1) .close-wrapper .close {
    height: 30px;
    width: 30px;
  }
}
#overlay-modal {
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  background-color: #000;
  opacity: 0.8;
}

.overlay,
.modal-content,
#caption,
.close {
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}

.out {
  animation-name: zoom-out;
  animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
  from {
    -webkit-transform: scale(1);
  }
  to {
    -webkit-transform: scale(2);
  }
}
@keyframes zoom {
  from {
    transform: scale(0.4);
  }
  to {
    transform: scale(1);
  }
}
@keyframes zoom-out {
  from {
    transform: scale(1);
  }
  to {
    transform: scale(0);
  }
}
#myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
  display: block;
}

/* The Modal (background) */
.modal {
  display: none;
  position: absolute;
  z-index: 1000;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  overflow: auto;
}
.modal :nth-child(1) {
  position: relative;
}
.modal :nth-child(1) .modal-content {
  margin: auto;
  display: block;
  width: 885px;
  height: 734px;
}
.modal :nth-child(1) .close-wrapper {
  margin: auto;
  width: 885px;
  padding: 5px;
  transition: 0.3s;
  display: flex;
  justify-content: flex-end;
}
.modal :nth-child(1) .close-wrapper .close {
  border: 2px solid;
  display: flex;
  border-radius: 50%;
  height: 30px;
  width: 30px;
  padding: 5px;
  color: #f1f1f1;
  font-size: 40px;
  font-weight: bold;
  text-align: end;
}
.modal :nth-child(1) .close-wrapper .close:hover,
.modal :nth-child(1) .close-wrapper .close:focus {
  color: #bbb;
  text-decoration: none;
  cursor: pointer;
}

@media only screen and (max-width: 700px) {
  .modal-content {
    width: 100%;
    height: 100%;
  }
}
@media (min-width: 300px) and (max-width: 370px) {
  .ticket .content-area .request-detail .req-contr .data,
  .ticket .content-area .info-data {
    font-size: 14px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.past-request-container .ticket-compact {
  background: #fff;
  padding: 20px;
  position: relative;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 2px 10px 0 rgba(206, 210, 218, 0.6);
  margin: 0 auto;
}
.past-request-container .ticket-compact .content-area {
  position: relative;
  z-index: 2;
}
.past-request-container .ticket-compact .content-area .request-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
}
.past-request-container .ticket-compact .content-area .request-top .img-contr {
  margin-right: 20px;
  width: 30px;
}
.past-request-container .ticket-compact .content-area .request-top .text-contr {
  width: calc(100% - 180px);
  display: flex;
  align-items: center;
}
.past-request-container .ticket-compact .content-area .request-top .heading {
  font-size: 22px;
  padding-bottom: 20px;
  padding-top: 20px;
  line-height: 16px;
  padding-right: 30px;
  margin-right: 30px;
  border-right: 1px solid rgba(34, 0, 70, 0.5);
  color: rgb(34, 0, 70);
  font-family: volte_medium, sans-serif;
}
.past-request-container .ticket-compact .content-area .request-top .info-txt {
  font-family: volte_reg, Tahoma, sans-serif;
  color: #1d1e30;
  font-size: 18px;
}
.past-request-container .ticket-compact .content-area .request-top .label {
  margin-top: -5px;
}
.past-request-container .ticket-compact .content-area .btn {
  margin: 0;
  display: inline-flex;
  justify-content: center;
  position: relative;
  box-sizing: border-box;
  overflow: hidden;
  vertical-align: middle;
  border-radius: 22px;
  font-size: 18px;
  text-transform: none;
  box-shadow: none;
  font-family: volte_medium;
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}
.past-request-container .ticket-compact .content-area .btn .btn-tertiary {
  background: transparent;
  border: 1px solid #e10092 !important;
  color: #e10092 !important;
}
.past-request-container .ticket-compact .content-area .btn .btn-sm {
  padding: 8px 20px;
  min-width: max-content;
  height: auto;
  line-height: inherit;
}

@media screen and (max-width: 599px) {
  .past-request-container .ticket-compact {
    padding: 15px;
  }
  .past-request-container .ticket-compact .content-area {
    font-size: 16px;
  }
  .past-request-container .ticket-compact .content-area .request-top {
    font-size: 16px;
  }
  .past-request-container .ticket-compact .content-area .request-top .img-contr {
    margin-right: 10px;
    font-size: 16px;
  }
  .past-request-container .ticket-compact .content-area .request-top .text-contr {
    width: calc(100% - 110px);
    flex-direction: column;
    margin-right: 10px;
    align-items: flex-start;
  }
  .past-request-container .ticket-compact .content-area .request-top .text-contr .heading {
    font-size: 22px;
    padding-bottom: 10px;
    padding-top: 0;
    padding-right: 0;
    margin-right: 0;
    border-right: none;
  }
  .past-request-container .ticket-compact .content-area .request-top .text-contr .info-txt {
    font-size: 16px;
  }
  .past-request-container .ticket-compact .content-area .btn {
    font-size: 14px;
    width: 0;
  }
  .past-request-container .ticket-compact .content-area .btn .btn-tertiary {
    background: #e10092;
    color: #fff !important;
  }
  .past-request-container .ticket-compact .content-area .btn .btn-sm {
    padding: 8px 20px;
    min-width: max-content;
    height: auto;
    line-height: inherit;
    width: fit-content;
  }
  .past-request-container .ticket-compact .content-area .btn .pl3 {
    display: none;
  }
  .past-request-container .ticket-compact .content-area .btn .cta {
    width: fit-content;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.hm-ticket-wrapper {
  background: rgba(34, 0, 70, 0.1);
  padding-bottom: 0;
  padding-top: 30px;
}
.hm-ticket-wrapper .container.home-ticket-container {
  width: 1050px;
}
.hm-ticket-wrapper .container.home-ticket-container .view-all {
  display: flex;
  margin-bottom: 20px;
  width: 97%;
  justify-content: end;
  align-items: baseline;
}
.hm-ticket-wrapper .container.home-ticket-container .view-all p {
  cursor: pointer;
  color: #E10092;
  font-family: volte_medium;
  text-decoration: none;
  font-style: normal;
  transition-property: color;
  transition-duration: 0.5s;
  transition-timing-function: ease;
  font-size: 16px;
}
.hm-ticket-wrapper .container.home-ticket-container .view-all p:hover {
  color: #fd9ddb;
  text-decoration: none;
  transition-property: background;
  transition-duration: 0.5s;
  transition-timing-function: ease;
}
.hm-ticket-wrapper .container.home-ticket-container .view-all img {
  width: 8px;
  margin-left: 8px;
  position: relative;
  top: 1px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket {
  margin-bottom: 23px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .content-area .request-top .ticket-no .label img {
  width: 15px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .content-area .request-top .done {
  background: rgba(29, 30, 48, 0.5);
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .wrapper {
  margin-bottom: -25px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .collapse-show {
  transition: max-height 12s ease-out;
  max-height: 4000px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .collapse-show.unset-transition {
  transition: unset;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .collapse-hide {
  transition: max-height 1.8s cubic-bezier(0, 1, 0, 1);
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .collapse-hide.unset-transition {
  transition: max-height 0.2s cubic-bezier(0, 1, 0, 1);
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view {
  border: unset;
  padding: unset;
  margin: unset;
  display: flex;
  flex-direction: column-reverse;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .sts-comment {
  margin-top: -5px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .cta-contr {
  width: 100%;
  justify-content: end;
  position: relative;
  top: -12px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .cta-contr .reopen-btn {
  padding-left: 15px;
  display: block;
  margin-left: 15px;
  border-left: 1px solid #ccc;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .ticket-status-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .ticket-wrapper-with-Feedback {
  display: flex;
  flex-direction: row;
  align-items: center;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .ticket-wrapper-with-Feedback .ticket-image-block {
  width: 20.8%;
  height: 165px;
  border-radius: 6px;
  opacity: 0px;
  box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.2509803922);
  background: #F4F4F4;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: relative;
  bottom: 35px;
  right: -1px;
  max-width: 168px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .ticket-wrapper-with-Feedback .ticket-image-block .image-text {
  font-family: "volte_reg";
  font-size: 18px;
  font-weight: 500;
  line-height: 21.6px;
  text-align: center;
  margin-bottom: 12px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .ticket-wrapper-with-Feedback .ticket-image-block img {
  cursor: pointer;
  width: 32.16px;
  height: 41.76px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .ticket-wrapper-with-Feedback .ticket-image-block input[type=file] {
  display: none;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-arrow {
  height: 24px;
  width: 24px;
  top: 44%;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-prev {
  left: 0;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-next {
  right: 0;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-dots li button:before {
  content: "";
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-dots {
  bottom: 0;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-dots li {
  height: 10px;
  width: 10px;
  margin: 0 8px;
  border-radius: 50%;
  background: #ccc;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-dots li.slick-active {
  background: #E10092;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-list {
  width: 94.9%;
  margin: 0 auto;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-slide img {
  position: unset;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-active {
  margin-right: 10px;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-active img {
  position: unset;
}
.hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-disabled {
  display: none !important;
}

@media screen and (max-width: 480px) {
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider:hover .slick-arrow {
    display: none !important;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket {
    margin-bottom: 23px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .content-area .request-top .label img {
    height: 15px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .content-area .request-top .done {
    background: rgba(29, 30, 48, 0.5);
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .content-area .request-detail .is-reopen {
    visibility: hidden;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .cta-contr {
    top: -2px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .cta-contr.cta-reopen {
    justify-content: flex-start;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .cta-contr .link-view {
    font-size: 14px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .request-view .cta-contr .reopen-btn {
    font-size: 14px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .ticket-wrapper-with-Feedback {
    justify-content: space-between;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .ticket-wrapper-with-Feedback .ticket-image-block {
    width: 100% !important;
    height: 167px !important;
    max-width: 136px !important;
    margin: 0 10px 0 6px;
    bottom: 0px !important;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .ticket .ticket-wrapper-with-Feedback .ticket-image-block .image-text {
    font-size: 14px !important;
    line-height: 16.8px !important;
    margin-bottom: 9.9px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-list {
    width: 100%;
  }
}
@media screen and (min-width: 481px) and (max-width: 768px) {
  .hm-ticket-wrapper .container.home-ticket-container .ticket-wrapper-with-Feedback .ticket-image-block {
    width: 100% !important;
    height: 167px !important;
    max-width: 136px !important;
    margin: 0 10px 0 6px;
  }
  .hm-ticket-wrapper .container.home-ticket-container .ticket-wrapper-with-Feedback .ticket-image-block .image-text {
    font-size: 14px !important;
    line-height: 16.8px !important;
    margin-bottom: 9.9px;
  }
}
@media screen and (min-width: 600px) and (max-width: 1024px) {
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-list {
    width: 96.9%;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-prev {
    left: -1%;
    display: block !important;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-prev.slick-disabled {
    display: none !important;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-next {
    right: -1%;
    display: block !important;
  }
  .hm-ticket-wrapper .container.home-ticket-container .slick-slider .slick-next.slick-disabled {
    display: none !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.sticky-chatnow {
  position: sticky;
  bottom: 1px;
  z-index: 2;
}

.ticket-card-container {
  background: rgba(34, 0, 70, 0.1);
  margin-bottom: -20px;
  padding-top: 30px;
}

.ticket-card-bottom {
  padding-bottom: 30px;
}
.ticket-card-bottom .ticket {
  margin: 0;
}

.outage-banner-section .slick-track {
  background-color: #eaebef;
}
.outage-banner-section .slick-arrow {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
}
.outage-banner-section .slick-arrow:before {
  content: "";
  border: solid #fff;
  border-width: 0 4px 4px 0;
  display: inline-block;
  padding: 3px;
  width: 100%;
  height: 100%;
  border-radius: 3px;
  box-shadow: none;
}
.outage-banner-section .slick-arrow.slick-prev, .outage-banner-section .slick-arrow.slick-next {
  background-color: transparent !important;
}
.outage-banner-section .slick-prev {
  left: 10%;
  top: 45%;
}
.outage-banner-section .slick-next {
  right: 10%;
  top: 45%;
}
.outage-banner-section .slick-prev:hover,
.outage-banner-section .slick-next:hover {
  width: 8px;
  height: 8px;
}
.outage-banner-section .slick-prev:before {
  transform: rotate(135deg);
  -webkit-transform: rotate(135deg);
}
.outage-banner-section .slick-next:before {
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}
.outage-banner-section .slick-next:hover:before {
  margin-left: 0;
}
.outage-banner-section .slick-dots li.slick-active button:before {
  color: #ffffff;
}
.outage-banner-section ul.slick-dots {
  z-index: 10;
  display: block;
  position: absolute;
  bottom: 2px;
}
.outage-banner-section ul.slick-dots li {
  margin: 0;
}
.outage-banner-section ul.slick-dots li.slick-active button:before {
  color: #e10092;
}
.outage-banner-section ul.slick-dots li button:before {
  color: #ccc;
}
.outage-banner-section p {
  width: 100%;
  padding: 40px 10px 40px 10px;
  text-align: center;
}
.outage-banner-section p span {
  width: 60%;
  display: block;
  text-align: center;
  margin: auto;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  height: 20px;
  cursor: pointer;
  font-family: volte_reg, Tahoma;
  font-weight: 600;
}

.icon-Partner-apps {
  padding-right: 5px;
}

.icon-Content-related {
  padding-right: 5px;
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.nudge-container {
  position: fixed;
  bottom: 8%;
  z-index: 999;
  background: linear-gradient(294.99deg, #a22736 0%, #220046 100%);
  width: 640px;
  height: 79px;
  border: 1px solid #564372;
  border-radius: 8px;
  padding: 10px 11px 10px 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  left: 50%;
  transform: translateX(-50%);
}
.nudge-container .img-container {
  width: 40px;
  height: 40px;
}
.nudge-container .img-container img {
  width: 100%;
}
.nudge-container .text-container {
  flex: 2;
  padding-left: 15px;
}
.nudge-container .text-container p:first-child {
  font-weight: 500;
  font-size: 14px;
  line-height: 110%;
  color: #ffffff;
  font-family: volte_reg;
}
.nudge-container .text-container p:nth-child(2) {
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  font-family: volte_semiBold;
  color: #F3CBE3;
  cursor: pointer;
  width: 0;
  padding-top: 2px;
}
.nudge-container .cross-icon-container {
  height: 100%;
  padding-top: 8px;
}
.nudge-container .cross-icon-container .cross-icon {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
.nudge-container .cross-icon-container .cross-icon img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 480px) {
  .nudge-container {
    width: 90%;
    padding: 10px 16px 10px 12px;
  }
  .nudge-container .img-container {
    width: 24px;
    height: 24px;
  }
  .nudge-container .text-container {
    padding-left: 10px;
  }
  .nudge-container .text-container p:first-child {
    font-size: 14px;
  }
  .nudge-container .text-container p:nth-child(2) {
    font-size: 16px;
    padding-top: 2px;
  }
  .nudge-container .cross-icon-container {
    padding-top: 9px;
  }
  .nudge-container .cross-icon-container .cross-icon {
    width: 10px;
    height: 10px;
  }
}
@media only screen and (max-width: 768px) {
  .nudge-container {
    bottom: 9%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.renew-nudge-container {
  position: fixed;
  bottom: 8%;
  z-index: 999;
  background: linear-gradient(294.99deg, #a22736 0%, #220046 100%);
  width: 640px;
  height: auto;
  border: 1px solid #564372;
  border-radius: 10px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  left: 50%;
  transform: translateX(-50%);
}
.renew-nudge-container .circular-text-count {
  transform: rotate(90deg) translate(4px, -110px);
  font-size: 35px;
}
.renew-nudge-container .circular-text-days {
  transform: rotate(90deg) translate(-15px, -86px);
  font-size: 18px;
}
.renew-nudge-container .img-container {
  width: 50px;
  height: 50px;
}
.renew-nudge-container .img-container img {
  width: 100%;
  height: 100%;
}
.renew-nudge-container .text-container {
  width: 80%;
  padding-left: 10px;
}
.renew-nudge-container .text-container p:first-child {
  color: #ffffff;
  font-family: volte_reg;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
}
.renew-nudge-container .text-container p:nth-child(2) {
  font-family: volte_medium;
  color: #FFFFFF;
  padding-top: 2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 15.4px;
  text-align: left;
}
.renew-nudge-container .text-container span {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.renew-nudge-container .text-container span p:first-child {
  font-family: volte_semiBold;
  color: #F3CBE3;
  padding-top: 2px;
  font-size: 16px;
  font-weight: 600;
  line-height: 19.2px;
}
.renew-nudge-container .text-container span img {
  width: 16px;
  height: 14px;
  margin-left: 6px;
}
.renew-nudge-container .cross-icon-container {
  height: 100%;
  position: absolute;
  top: 12px;
  right: 16px;
}
.renew-nudge-container .cross-icon-container .cross-icon {
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.renew-nudge-container .cross-icon-container .cross-icon img {
  width: 100%;
  height: 100%;
}

.pending-cart-transaction {
  position: fixed;
  bottom: 8%;
  z-index: 999;
  background: linear-gradient(294.99deg, #a22736 0%, #220046 100%);
  width: 640px;
  height: auto;
  border: 1px solid #564372;
  border-radius: 10px;
  display: flex;
  align-items: center;
  left: 50%;
  transform: translateX(-50%);
  padding: 12px 20px;
}
.pending-cart-transaction .img-container {
  width: 50px;
  height: 50px;
}
.pending-cart-transaction .img-container img {
  width: 100%;
  height: 100%;
}
.pending-cart-transaction .text-container {
  width: 80%;
  padding-left: 12px;
}
.pending-cart-transaction .text-container p:first-child {
  color: #FFFFFF;
  font-family: volte_medium;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  letter-spacing: 0px;
}
.pending-cart-transaction .text-container p:nth-child(2) {
  color: #ffffff;
  padding-top: 5px;
  font-size: 18px;
  line-height: 120%;
  font-family: volte_reg;
  font-weight: 500;
  font-size: 18px;
  line-height: 120%;
  letter-spacing: 0px;
}
.pending-cart-transaction .text-container .primary-btn {
  width: 92px;
  height: 31px;
  border-radius: 4px;
  padding: 4px;
  margin: 5px 0px 0px 0px;
  border: none;
}
.pending-cart-transaction .text-container .primary-btn span {
  font-family: volte_semiBold;
  font-weight: 600;
  font-size: 16px;
  line-height: 120%;
  letter-spacing: 0px;
  text-align: center;
  justify-content: center;
}
.pending-cart-transaction .text-container .primary-btn:hover {
  border: none;
}
.pending-cart-transaction .cross-icon-container {
  height: 100%;
  position: absolute;
  top: 12px;
  right: 16px;
  width: 18px;
  height: 18px;
}
.pending-cart-transaction .cross-icon-container .cross-icon {
  cursor: pointer;
  width: 100%;
  height: 100%;
}
.pending-cart-transaction .cross-icon-container .cross-icon img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 480px) {
  .renew-nudge-container {
    width: 90%;
    bottom: 10%;
    padding: 11px 15px 10px 15px;
  }
  .renew-nudge-container .img-container {
    width: 40px;
    height: 40px;
  }
  .renew-nudge-container .text-container {
    padding-left: 8px;
    width: 75%;
  }
  .renew-nudge-container .text-container p:first-child {
    font-size: 16px;
    line-height: 19.2px;
  }
  .renew-nudge-container .text-container p:nth-child(2) {
    font-size: 14px;
  }
  .renew-nudge-container .text-container span p:first-child {
    line-height: 19.2px;
  }
  .renew-nudge-container .cross-icon-container {
    top: 11px;
    right: 15px;
  }
  .renew-nudge-container .cross-icon-container .cross-icon {
    width: 10px;
    height: 10px;
  }
  .pending-cart-transaction {
    width: 95%;
    bottom: 10%;
    padding: 12px 16px 12px 16px;
  }
  .pending-cart-transaction .img-container {
    width: 40px;
    height: 40px;
  }
  .pending-cart-transaction .text-container {
    padding-left: 8px;
    width: 82%;
  }
  .pending-cart-transaction .text-container p:first-child {
    font-size: 16px;
  }
  .pending-cart-transaction .text-container p:nth-child(2) {
    font-size: 14px;
    padding-top: 2px;
  }
  .pending-cart-transaction .text-container .primary-btn {
    width: 61px;
    height: auto;
    margin-top: 2px;
    padding: 0px;
  }
  .pending-cart-transaction .text-container .primary-btn span {
    font-size: 12px;
  }
  .pending-cart-transaction .cross-icon-container {
    width: 12px;
    height: 12px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.renew-nudge-container {
  position: fixed;
  bottom: 8%;
  z-index: 999;
  background: linear-gradient(294.99deg, #a22736 0%, #220046 100%);
  width: 640px;
  height: auto;
  border: 1px solid #564372;
  border-radius: 10px;
  padding: 12px 16px;
  display: flex;
  align-items: center;
  left: 50%;
  transform: translateX(-50%);
}
.renew-nudge-container .circular-text-count {
  transform: rotate(90deg) translate(4px, -110px);
  font-size: 35px;
}
.renew-nudge-container .circular-text-days {
  transform: rotate(90deg) translate(-15px, -86px);
  font-size: 18px;
}
.renew-nudge-container .img-container {
  width: 50px;
  height: 50px;
}
.renew-nudge-container .img-container img {
  width: 100%;
  height: 100%;
}
.renew-nudge-container .text-container {
  width: 80%;
  padding-left: 10px;
}
.renew-nudge-container .text-container p:first-child {
  color: #ffffff;
  font-family: volte_reg;
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
}
.renew-nudge-container .text-container p:nth-child(2) {
  font-family: volte_medium;
  color: #FFFFFF;
  padding-top: 2px;
  font-size: 14px;
  font-weight: 500;
  line-height: 15.4px;
  text-align: left;
}
.renew-nudge-container .text-container span {
  display: flex;
  align-items: center;
  cursor: pointer;
}
.renew-nudge-container .text-container span p:first-child {
  font-family: volte_semiBold;
  color: #F3CBE3;
  padding-top: 2px;
  font-size: 16px;
  font-weight: 600;
  line-height: 19.2px;
}
.renew-nudge-container .text-container span img {
  width: 16px;
  height: 14px;
  margin-left: 6px;
}
.renew-nudge-container .cross-icon-container {
  height: 100%;
  position: absolute;
  top: 12px;
  right: 16px;
}
.renew-nudge-container .cross-icon-container .cross-icon {
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.renew-nudge-container .cross-icon-container .cross-icon img {
  width: 100%;
  height: 100%;
}

@media only screen and (max-width: 480px) {
  .renew-nudge-container {
    width: 90%;
    bottom: 10%;
    padding: 11px 15px 10px 15px;
  }
  .renew-nudge-container .img-container {
    width: 40px;
    height: 40px;
  }
  .renew-nudge-container .text-container {
    padding-left: 8px;
    width: 75%;
  }
  .renew-nudge-container .text-container p:first-child {
    font-size: 16px;
    line-height: 19.2px;
  }
  .renew-nudge-container .text-container p:nth-child(2) {
    font-size: 14px;
  }
  .renew-nudge-container .text-container span p:first-child {
    line-height: 19.2px;
  }
  .renew-nudge-container .cross-icon-container {
    top: 11px;
    right: 15px;
  }
  .renew-nudge-container .cross-icon-container .cross-icon {
    width: 10px;
    height: 10px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.payment-container-flow {
  display: flex;
  width: 490px;
  padding: 16px 12px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  background: #EFE8FB;
  margin-top: -27px;
}
.payment-container-flow .payment-heading {
  color: #000;
  text-align: center;
  font-family: volte_medium;
  font-size: 20px;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
  margin-bottom: 24px;
}
.payment-container-flow .btn-wrapper-installation {
  display: flex;
  padding: 11.387px 50.863px;
  justify-content: center;
  align-items: center;
  gap: 5.211px;
  border-radius: 4px;
  background-blend-mode: normal, overlay;
  background: #e10092;
  font-size: 16px;
  border: solid 2px #e10092;
  cursor: pointer;
  margin-bottom: 12px;
  margin-right: 0;
}
.payment-container-flow .fire-stick-prompt {
  display: flex;
  width: 422px;
  padding-right: 0px;
  align-items: center;
  gap: 12px;
  height: 56px;
  margin-bottom: 24px;
  border-radius: 4px;
  background: #D6C6F4;
}
.payment-container-flow .fire-stick-prompt .bandage-image {
  z-index: 1;
  width: 80.64px;
  height: 56px;
}
.payment-container-flow .fire-stick-prompt .fire-stick-prompt-text {
  color: #564372;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  border-radius: 4px;
  padding-right: 34px;
  font-family: volte_reg;
}
.payment-container-flow .fire-stick-prompt .fire-stick-prompt-text b {
  font-family: volte_medium;
}
.payment-container-flow .payment-note {
  width: 422px;
  gap: 5px;
  color: #220046;
  font-family: volte_medium;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 120%;
  margin-bottom: 24px;
  display: -webkit-inline-box;
}
.payment-container-flow .payment-note .note {
  color: #220046;
  font-family: volte_medium;
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}
.payment-container-flow .not-now {
  color: #E10092;
  text-align: center;
  font-family: volte_medium;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  cursor: pointer;
}

@media screen and (max-width: 599px) {
  .payment-container-flow {
    display: flex;
    width: 90%;
    padding: 16px 12px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 0px;
  }
  .payment-container-flow .payment-heading {
    color: #000;
    text-align: center;
    font-family: volte_reg;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 140%;
    margin-bottom: 18px;
    width: 299px;
  }
  .payment-container-flow .fire-stick-prompt {
    width: 100%;
    height: 50px;
    margin-bottom: 18px;
    border-radius: 4px;
  }
  .payment-container-flow .fire-stick-prompt .fire-stick-prompt-text {
    font-size: 10px;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    padding-right: 25px;
  }
  .payment-container-flow .fire-stick-prompt .bandage-image {
    width: 72px;
    height: 50px;
  }
  .payment-container-flow .payment-note {
    width: 100%;
    margin-bottom: 18px;
    font-size: 8px;
    font-style: normal;
    font-weight: 500;
    line-height: 120%;
    padding-right: 15px;
  }
  .payment-container-flow .payment-note .note {
    font-size: 8px;
    font-weight: 600;
  }
  .payment-container-flow .btn-wrapper-installation {
    display: flex;
    margin: 0 auto;
    width: 95%;
    padding: 15px 67px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
  }
  .payment-container-flow .btn-wrapper-installation .button-text {
    white-space: nowrap;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.payment-successful-container {
  position: absolute;
  z-index: 1;
  top: -4em;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(2, 0, 5, 0.35);
  display: flex;
  flex-direction: column;
  align-items: center;
}
.payment-successful-container .payment-successful {
  width: 640px;
  height: 288px;
  align-items: center;
  display: flex;
  flex-direction: column;
  left: calc(50% - 320px);
  top: calc(45% - 144px);
  padding: 30px 62px;
  position: absolute;
}
.payment-successful-container .payment-successful.ftv-upsell-block {
  position: unset;
}
.payment-successful-container .payment-successful img {
  width: 40px;
  height: 40px;
  margin-bottom: 10px;
}
.payment-successful-container .payment-successful span {
  font-family: volte_medium;
  font-style: normal;
  font-weight: normal;
  text-align: center;
  color: #ffffff;
  line-height: 120%;
}
.payment-successful-container .payment-successful .payment-pri-text {
  font-size: 26px;
  margin-bottom: 10px;
}
.payment-successful-container .payment-successful .payment-sec-text {
  font-size: 20px;
  margin-bottom: 30px;
  font-family: volte_medium;
  color: #ffffff;
  opacity: 0.8;
}
@media only screen and (min-width: 640px) {
  .payment-successful-container .payment-successful .payment-sec-text {
    padding: 0 20px;
  }
}
.payment-successful-container .payment-successful .payment-ter-text {
  font-size: 16px;
  color: #c7c0cf;
  font-family: volte_medium;
  margin-bottom: 20px;
}
.payment-successful-container .payment-successful .btn {
  width: 280px;
  margin: 0;
}
.payment-successful-container .payment-successful .btn.payment-success-cta {
  width: 290px;
  border-radius: 4px !important;
  padding: 15px 67px 15px 67px;
}

.plan-success-modal .popupSec .modal-body p.extra-instructions-text {
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  color: #c7c0cf;
  margin-bottom: 30px;
}
.plan-success-modal .popupSec .modal-body p.instructions-text {
  font-size: 16px !important;
  font-style: normal;
  font-weight: 500 !important;
  line-height: 120% !important;
  color: #c7c0cf;
}
.plan-success-modal .popupSec .modal-body p:last-child {
  margin-bottom: 30px;
}

.alert-modal.plan-success-modal .popupSec .modal-body .btn-group .btn {
  width: 280px;
  border-radius: 4px !important;
}

.large-screen-advertising-wrapper .payment-successful {
  height: auto;
  top: calc(45% - 280px);
}
.large-screen-advertising-wrapper .payment-successful .large-screen-advertising-image {
  width: 100%;
  height: 295px;
  margin-bottom: 20px;
}

.large-screen-popup-wrapper .instructions-text p {
  margin-bottom: 10px;
}
.large-screen-popup-wrapper .instructions-text img {
  width: 100% !important;
  height: 295px;
}

@media only screen and (max-width: 640px) {
  .payment-successful-container {
    background: rgba(2, 0, 5, 0.45) !important;
  }
  .payment-successful-container .payment-successful {
    width: 100%;
    left: 0;
  }
  .payment-successful-container .payment-successful.ftv-upsell-block {
    margin-top: 24px;
    padding: 30px 62px;
    width: 320px;
  }
  .payment-successful-container .payment-successful .payment-sec-text {
    font-size: 16px;
  }
  .payment-successful-container .payment-successful span {
    width: 320px;
  }
  .payment-successful-container .payment-successful .btn.payment-success-cta {
    width: 320px !important;
    padding: 13px !important;
  }
  .payment-successful-container .payment-successful .large-screen-advertising-image {
    height: 149px;
    width: 320px;
  }
  .plan-success-modal .popupSec {
    width: 90%;
  }
  .plan-success-modal .popupSec .modal-body .alert-icon {
    font-size: 36px;
  }
  .plan-success-modal .popupSec .modal-body .alert-icon .get-icon-success-tick i:before {
    font-size: 30px;
  }
  .plan-success-modal .popupSec .modal-body h1 {
    font-size: 22px;
  }
  .plan-success-modal .popupSec .modal-body p.extra-instructions-text {
    font-size: 16px;
    margin: 0px;
  }
  .plan-success-modal .popupSec .modal-body p.instructions-text {
    font-size: 12px !important;
    font-style: normal;
    font-weight: 400 !important;
    line-height: 120% !important;
    margin-top: 10px;
    margin-bottom: 0 !important;
  }
  .large-screen-advertising-wrapper .payment-successful {
    height: auto;
    top: calc(45% - 240px);
  }
  .large-screen-popup-wrapper .instructions-text img {
    height: 149px !important;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.payment-progress-wrapper {
  position: relative;
  top: 40vh;
}
.payment-progress-wrapper .loader-container {
  position: absolute;
  bottom: 30px;
  height: unset;
}
.payment-progress-wrapper p {
  width: 100%;
  color: white;
  position: relative;
  padding-top: 10px;
  text-align: center;
  font-family: volte_medium !important;
  z-index: 1;
}
.payment-progress-wrapper p.in-progress-pri {
  font-size: 26px;
  font-weight: 500;
  padding-top: 30px;
}
.payment-progress-wrapper p.in-progress-sec {
  font-size: 20px;
  font-weight: 500;
}
.payment-progress-wrapper p.progress-timer {
  font-size: 16px;
  font-weight: 500;
  color: #d6c6f4;
}

.payment-fail-wrapper {
  z-index: 1;
  display: flex;
  position: relative;
  flex-direction: column;
  align-items: center;
  top: 31vh;
  color: #ffffff;
  font-family: volte_medium;
  text-align: center;
}
.payment-fail-wrapper i.icon-alert-upd {
  font-size: 46px;
}
.payment-fail-wrapper i.icon-alert-upd:before {
  color: #A3A6C2;
}
.payment-fail-wrapper .fail-pri {
  font-size: 26px;
  font-weight: 500;
  padding-top: 10px;
}
.payment-fail-wrapper .fail-sec {
  font-weight: 500;
  font-size: 20px;
  line-height: 110%;
  padding-top: 10px;
}
.payment-fail-wrapper .primary-btn {
  border-radius: 4px;
  padding: 15px 67px;
  margin-top: 20px;
}
.payment-fail-wrapper .not-now {
  font-size: 16px;
  color: #f3cbe3;
  font-weight: 600;
  line-height: 120%;
  padding-top: 6px;
  cursor: pointer;
}

@media only screen and (max-width: 480px) {
  .payment-progress-wrapper {
    top: 40vh;
  }
  .payment-progress-wrapper .loader-container {
    bottom: 50px;
  }
  .payment-fail-wrapper {
    top: 30vh;
  }
  .payment-fail-wrapper .fail-pri {
    font-size: 20px;
  }
  .payment-fail-wrapper .fail-sec {
    font-size: 14px;
    padding-top: 12px;
  }
  .payment-fail-wrapper .primary-btn {
    padding: 13px 91px;
  }
  .payment-fail-wrapper .not-now {
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
  box-sizing: border-box;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1, h2, h3, h4, h5, h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active, select:focus, select:active, button.btn:focus, button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

@font-face {
  font-family: "sky_reg";
  src: url(/af80c018da3e3742f6bcf4ecfc329346.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "sky_med";
  src: url(/615404d8063680e0cb68beb55c15c96a.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "sky_bold";
  src: url(/4ca661b7a15d4a0ee744615d9f9ccf84.ttf) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "sky_italic";
  src: url(/31d6cfe0d16ae931b73c59d7e0c089c0.ttf) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "icomoon";
  src: url(/4525a954cbe5c383de67ff089ad00ee0.eot);
  src: url(/4525a954cbe5c383de67ff089ad00ee0.eot#iefix) format("embedded-opentype"), url(/8b4e5eb3579e711e238fb488b30abeee.ttf) format("truetype"), url(/9f791e831b25893236ce68e4ea963879.woff) format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "volte_reg";
  src: url(/571797379b832bca58eec4781df136b9.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "volte_medium";
  src: url(/571797379b832bca58eec4781df136b9.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "volte_light";
  src: url(/42bacbfcb839c75af628b0d01e62e912.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "volte_semiBold";
  src: url(/09034d40a8246b7f0d39a63c4a169816.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "volte_bold";
  src: url(/f7ec6201e9df24efcd0e3288cf196f14.woff) format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "password_mask";
  src: url(data:font/woff;charset:utf-8;base64,d09GRgABAAAAAAusAAsAAAAAMGgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADsAAABUIIslek9TLzIAAAFEAAAAPgAAAFZjRmM5Y21hcAAAAYQAAAgCAAArYmjjYVVnbHlmAAAJiAAAAEEAAABQiOYj2mhlYWQAAAnMAAAALgAAADYOxVFUaGhlYQAACfwAAAAcAAAAJAqNAyNobXR4AAAKGAAAAAgAAAAIAyAAAGxvY2EAAAogAAAABgAAAAYAKAAAbWF4cAAACigAAAAeAAAAIAEOACJuYW1lAAAKSAAAAUIAAAKOcN63t3Bvc3QAAAuMAAAAHQAAAC5lhHRpeJxjYGRgYOBiMGCwY2BycfMJYeDLSSzJY5BiYGGAAJA8MpsxJzM9kYEDxgPKsYBpDiBmg4gCACY7BUgAeJxjYGScwDiBgZWBgSGVtYKBgVECQjMfYEhiYmFgYGJgZWbACgLSXFMYHIAq/rNfAHK3gEmgASACAIekCT4AAHic7dhl0zDVmUXh5+XFHYK7E0IguFtwt4QQgmtwd3d3d7cED+4SXIO7u7vbsNfaUzU1fyGcu66u1adOf+6uHhgYGGpgYGDwL37/iyEHBoZZcWDQLzUw9NK/7A5if/DA8OwPOfQknBky+0P8/PPPOcd1UJ785frr/Dq/zq/z6/w3zsCgoX/xX74GRsxbcYpRB1iDB/7PGvT/DFGDenBwe8hKD1XpoSs9TKWHrfRwlR6+0iNUesRKj1TpkSs9SqVHrfRolR690r+p9BiVHrPSY1V67EqPU+lxKz1epcev9ASVnrDSE1V64kpPUulJKz1ZpSev9BSVnrLSU1V66kr/ttLTVPp3lZ62/KJSerpKT1/pP1R6hkrPWOmZKj1zpWep9KyVnq3Ss1d6jkrPWem5Kj13peep9LyVnq/S81d6gUr/sdILVnqhSi9c6UUqvWilF6v04pVeotJLVnqpSi9d6WUqvWyll6v08pVeodIrVvpPlf5zpVeq9F8qvXKl/1rpVSr9t0qvWunVKr16pdeo9JqVXqvSa1d6nUqvW+n1Kr1+pTeo9N8rvWGlN6r0xpXepNKbVnqzSm9e6S0qvWWlt6r01pXeptLbVnq7Sm9f6R0qvWOld6r0zpXepdK7Vnq3Su9e6T0qvWel96r03pXep9L7Vnq/Su9f6QMqfWClD6r0wZU+pNKHVvqwSh9e6SMqfWSlj6r00ZU+ptLHVvq4Sh9f6RMqfWKlT6r0yZU+pdKnVvq0Sp9e6TMqfWalz6r02ZU+p9LnVvq8Sp9f6QsqfWGl/1Hpf1b6okpfXOlLKn1ppS+r9OWVvqLS/6r0lZW+qtJXV/qaSl9b6esqfX2lb6j0jZW+qdI3V/qWSt9a6dsqfXul76j0vyt9Z6XvqvTdlb6n0vdW+r5K31/pByr9YKUfqvTDlX6k0v+p9KOVfqzSj1f6iUo/WemnKv10pZ+p9LOVfq7Sz1f6hUq/WOmXKv1ypV+p9KuVfq3Sr1f6jUq/Wem3Kv12pd+p9LuVfq/S71f6g0p/WOmPKv1xpT+p9KeV/qzSn1f6i0p/WemvKv11pb+p9LeV/q7S31f6h0r/WOmfKv1zDfI26KKHED1Y9JCihxI9tOhhRA8rejjRw4seQfSIokcSPbLoUUSPKno00aOL/o3oMUSPKXos0WOLHkf0uKLHEz2+6AlETyh6ItETi55E9KSiJxM9uegpRE8peirRU4v+rehpRP9O9LSify96OtHTi/6D6BlEzyh6JtEzi55F9KyiZxM9u+g5RM8pei7Rc4ueR/S8oucTPb/oBUT/UfSCohcSvbDoRUQvKnox0YuLXkL0kqKXEr206GVELyt6OdHLi15B9Iqi/yT6z6JXEv0X0SuL/qvoVUT/TfSqolcTvbroNUSvKXot0WuLXkf0uqLXE72+6A1E/130hqI3Er2x6E1Ebyp6M9Gbi95C9JaitxK9tehtRG8rejvR24veQfSOoncSvbPoXUTvKno30buL3kP0nqL3Er236H1E7yt6P9H7iz5A9IGiDxJ9sOhDRB8q+jDRh4s+QvSRoo8SfbToY0QfK/o40ceLPkH0iaJPEn2y6FNEnyr6NNGniz5D9JmizxJ9tuhzRJ8r+jzR54u+QPSFov8h+p+iLxJ9sehLRF8q+jLRl4u+QvS/RF8p+irRV4u+RvS1oq8Tfb3oG0TfKPom0TeLvkX0raJvE3276DtE/1v0naLvEn236HtE3yv6PtH3i35A9IOiHxL9sOhHRP9H9KOiHxP9uOgnRD8p+inRT4t+RvSzop8T/bzoF0S/KPol0S+LfkX0q6JfE/266DdEvyn6LdFvi35H9Lui3xP9vugPRH8o+iPRH4v+RPSnoj8T/bnoL0R/Kfor0V+L/kb0t6K/E/296B9E/yj6J9E/K/2/v/npoocQPVj0kKKHEj206GFEDyt6ONHDix5B9IiiRxI9suhRRI8qejTRo4v+jegxRI8peizRY4seR/S4oscTPb7oCURPKHoi0ROLnkT0pKInEz256ClETyl6KtFTi/6t6GlE/070tKJ/L3o60dOL/oPoGUTPKHom0TOLnkX0rKJnEz276DlEzyl6LtFzi55H9Lyi5xM9v+gFRP9R9IKiFxK9sOhFRC8qejHRi4teQvSSopcSvbToZUQvK3o50cuLXkH0iqL/JPrPolcS/RfRK4v+q+hVRP9N9KqiVxO9uug1RK8pei3Ra4teR/S6otcTvb7oDUT/XfSGojcSvbHoTURvKnoz0ZuL3kL0lqK3Er216G1Ebyt6O9Hbi95B9I6idxK9s+hdRO8qejfRu4veQ/SeovcSvbfofUTvK3o/0fuLPkD0gaIPEn2w6ENEHyr6MNGHiz5C9JGijxJ9tOhjRB8r+jjRx4s+QfSJok8SfbLoU0SfKvo00aeLPkP0maLPEn226HNEnyv6PNHni75A9IWi/yH6n6IvEn2x6EtEXyr6MtGXi75C9L9EXyn6KtFXi75G9LWirxN9vegbRN8o+ibRN4u+RfStom8TfbvoO0T/W/Sdou8Sfbfoe0TfK/o+0feLfkD0g6IfEv2w6EdE/0f0o6IfE/246CdEPyn6KdFPi35G9LOinxP9vOgXRL8o+iXRL4t+RfSrol8T/broN0S/Kfot0W+Lfkf0u6LfE/2+6A9Efyj6I9Efi/5E9KeiPxP9uegvRH8p+ivRX4v+RvS3or8T/b3oH0T/KPon0T9rYND/AOaSEScAAHicY2BiAAKmPSy+QEqUgYFRUURcTFzMyNzM3MxEXU1dTYmdjZ2NccK/K5oaLm6L3Fw0NOEMZoVAFD6IAQD4PA9iAAAAeJxjYGRgYADirq+zjOP5bb4ycLNfAIowXCttkUWmmfaw+AIpDgYmEA8ANPUJwQAAeJxjYGRgYL/AAATMCiCSaQ8DIwMqYAIAK/QBvQAAAAADIAAAAAAAAAAoAAB4nGNgZGBgYGIQA2IGMIuBgQsIGRj+g/kMAArUATEAAHicjY69TsMwFIWP+4doJYSKhMTmoUJIqOnPWIm1ZWDq0IEtTZw2VRpHjlu1D8A7MPMczAw8DM/AifFEl9qS9d1zzr3XAK7xBYHqCHTdW50aLlj9cZ1057lBfvTcRAdPnlvUnz23mXj13MEN3jhBNC6p9PDuuYYrfHquU//23CD/eG7iVnQ9t9ATD57bWIgXzx3ciw+rDrZfqmhnUnvsx2kZzdVql4Xm1DhVFsqUqc7lKBiemjOVKxNaFcvlUZb71djaRCZGb+VU51ZlmZaF0RsV2WBtbTEZDBKvB5HewkLhwLePkhRhB4OU9ZFKTCqpzems6GQI6Z7TcU5mQceQUmjkkBghwPCszhmd3HWHLh+ze8mEpLvnT8dULRLWCTMaW9LUbanSGa+mUjhv47ZY7l67rgITDHiTf/mAKU76BTuXfk8AAHicY2BigAARBuyAiZGJkZmBJSWzOJmBAQALQwHHAAAA) format("woff");
  font-display: swap;
}
[class^=icon-],
[class*=" icon-"] {
  font-family: "icomoon", sans-serif !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #ffffff;
}

.icon-tv-show:before {
  content: "\ea03";
  color: #8e81a1;
}

.icon-live-tv:before {
  content: "\ea04";
  color: #8e81a1;
}

.icon-icon-game:before {
  content: "\ea02";
  color: #8e81a1;
}

.icon-logout:before {
  content: "\ea01";
  color: #8e81a1;
}

.icon-sports:before {
  content: "\e9df";
}

.icon-bingehelp-plans-and-payment:before {
  content: "\e9e0";
  color: #fff;
}

.icon-bingehelp-troubleshooting:before {
  content: "\e9fd";
  color: #fff;
}

.icon-bingehelp-getting-started:before {
  content: "\e9fe";
  color: #fff;
}

.icon-bingehelp-content-and-viewing:before {
  content: "\e9ff";
  color: #fff;
}

.icon-bingeHelp-Account-and-Profile:before {
  content: "\ea00";
  color: #fff;
}

.icon-share2:before {
  content: "\e9dc";
  color: #fff;
}

.icon-web-browser:before {
  content: "\e9dd";
  color: #8e81a1;
}

.icon-fire_tv:before {
  content: "\e9de";
  color: #fff;
}

.icon-settings1:before {
  content: "\e9da";
  color: #8e81a1;
}

.icon-close:before {
  content: "\e9d9";
  color: #fff;
}

.icon-Notification-Bell-upd .path1:before {
  content: "\e9d5";
  color: rgb(118, 106, 132);
}

.icon-Notification-Bell-upd .path2:before {
  content: "\e9d6";
  margin-left: -1em;
  color: rgb(118, 106, 132);
}

.icon-Notification-Bell-upd .path3:before {
  content: "\e9d7";
  margin-left: -1em;
  color: rgb(225, 0, 146);
}

.icon-icon-search-upd:before {
  content: "\e9d8";
  color: #766a84;
}

.icon-sign-out-upd:before {
  content: "\e9d3";
  color: #8e81a1;
  font-size: 24px;
}

.icon-Account-Refresh:before {
  content: "\e9d4";
  color: #8e81a1;
  font-size: 24px;
}

.icon-kids_in_active-upd:before {
  content: "\e9d1";
  color: #766a84;
}

.icon-Category-upd:before {
  content: "\e9d2";
  color: #766a84;
}

.icon-email-upd:before {
  content: "\e966";
  color: #e10092;
}

.icon-alert-upd:before {
  content: "\e968";
  color: #e56c6c;
}

.icon-auto-renewal-upd:before {
  content: "\e9a4";
  color: #fff;
}

.icon-remove-phone-upd:before {
  content: "\e96a";
  color: #a3a6c2;
}

.icon-success-upd:before {
  content: "\e983";
  color: #009e35;
}

.icon-expired-renewal-upd .path1:before {
  content: "\e984";
  color: rgb(196, 196, 196);
}

.icon-expired-renewal-upd .path2:before {
  content: "\e9a5";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-expired-renewal-upd .path3:before {
  content: "\e9a6";
  margin-left: -0.9755859375em;
  color: rgb(225, 0, 146);
}

.icon-expired-renewal-upd .path4:before {
  content: "\e9a7";
  margin-left: -0.9755859375em;
  color: rgb(225, 0, 146);
}

.icon-yearly-calendar-upd .path1:before {
  content: "\e995";
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path2:before {
  content: "\e9a8";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path3:before {
  content: "\e9a9";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path4:before {
  content: "\e9aa";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path5:before {
  content: "\e9ab";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path6:before {
  content: "\e9ac";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path7:before {
  content: "\e9ad";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path8:before {
  content: "\e9ae";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path9:before {
  content: "\e9af";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path10:before {
  content: "\e9b0";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path11:before {
  content: "\e9ec";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path12:before {
  content: "\e9f7";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-yearly-calendar-upd .path13:before {
  content: "\e9f8";
  margin-left: -0.9755859375em;
  color: none;
}

.icon-yearly-calendar-upd .path14:before {
  content: "\e9f9";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-yearly-calendar-upd .path15:before {
  content: "\e9fa";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-yearly-calendar-upd .path16:before {
  content: "\e9fb";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path1:before {
  content: "\e9b1";
  color: rgb(0, 0, 0);
}

.icon-quaterly-calendar-upd .path2:before {
  content: "\e9b2";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path3:before {
  content: "\e9b3";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path4:before {
  content: "\e9b4";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-quaterly-calendar-upd .path5:before {
  content: "\e9b5";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path6:before {
  content: "\e9b6";
  margin-left: -0.9755859375em;
  color: rgb(0, 0, 0);
}

.icon-quaterly-calendar-upd .path7:before {
  content: "\e9b7";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path8:before {
  content: "\e9b8";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path9:before {
  content: "\e9b9";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path10:before {
  content: "\e9ba";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path11:before {
  content: "\e9bb";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path12:before {
  content: "\e9bc";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path13:before {
  content: "\e9bd";
  margin-left: -0.9755859375em;
  color: none;
}

.icon-quaterly-calendar-upd .path14:before {
  content: "\e9be";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path15:before {
  content: "\e9bf";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-quaterly-calendar-upd .path16:before {
  content: "\e9c0";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path1:before {
  content: "\e9c1";
  color: rgb(0, 0, 0);
}

.icon-monthly-calendar-upd .path2:before {
  content: "\e9c2";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path3:before {
  content: "\e9c3";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path4:before {
  content: "\e9c4";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path5:before {
  content: "\e9c5";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path6:before {
  content: "\e9c6";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path7:before {
  content: "\e9c7";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path8:before {
  content: "\e9c8";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path9:before {
  content: "\e9c9";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path10:before {
  content: "\e9ca";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path11:before {
  content: "\e9cb";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path12:before {
  content: "\e9cc";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path13:before {
  content: "\e9cd";
  margin-left: -0.9755859375em;
  color: none;
}

.icon-monthly-calendar-upd .path14:before {
  content: "\e9ce";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path15:before {
  content: "\e9cf";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-monthly-calendar-upd .path16:before {
  content: "\e9d0";
  margin-left: -0.9755859375em;
  color: rgb(142, 129, 161);
}

.icon-viewing-restriction-upd:before {
  content: "\e9e1";
  color: #8e81a1;
}

.icon-play-upd .path1:before {
  content: "\e9e2";
  color: rgb(255, 255, 255);
  opacity: 0.5;
}

.icon-play-upd .path2:before {
  content: "\e9e3";
  margin-left: -0.9599609375em;
  color: rgb(255, 255, 255);
}

.icon-autoplay-trailer-upd:before {
  content: "\e9e4";
  color: #8e81a1;
  font-size: 20px;
}

.icon-notification-settings-upd:before {
  content: "\e9e5";
  color: #8e81a1;
}

.icon-switch-account-upd:before {
  content: "\e9e6";
  color: #8e81a1;
  font-size: 20px;
}

.icon-device-manage-upd:before {
  content: "\e9e7";
  color: #8e81a1;
  font-size: 24px;
}

.icon-content-language-upd:before {
  content: "\e9e8";
  color: #8e81a1;
  font-size: 24px;
}

.icon-parental-lock-upd:before {
  content: "\e9e9";
  color: #8e81a1;
  font-size: 20px;
}

.icon-profile-upd:before {
  content: "\e9ea";
  color: #8e81a1;
  font-size: 24px;
}

.icon-settings-upd:before {
  content: "\e9eb";
}

.icon-home:before {
  content: "\e9ed";
  color: #c277a8;
}

.icon-Binge-list:before {
  content: "\e9ee";
  color: #8e81a1;
}

.icon-remove-bingeList-upd:before {
  content: "\e9ef";
  color: #e10092;
}

.icon-audiolanguage-upd:before {
  content: "\e9f0";
}

.icon-Share-upd:before {
  content: "\e9f1";
  color: #fff;
}

.icon-A-upd:before {
  content: "\e9f2";
  color: #fff;
}

.icon-hindiA-upd:before {
  content: "\e9f3";
  color: #fff;
}

.icon-crown-upd .path1:before {
  content: "\e906";
  color: rgb(0, 0, 0);
}

.icon-crown-upd .path2:before {
  content: "\e9fc";
  margin-left: -1.099609375em;
  color: rgb(225, 0, 146);
}

.icon-mobile-upd:before {
  content: "\e9f4";
  color: #a3a6c2;
}

.icon-tv-upd:before {
  content: "\e9f5";
  color: #fff;
}

.icon-video-icon1:before {
  content: "\e99d";
  color: #fff;
}

.icon-video-icon:before {
  content: "\e9a2";
  color: #fff;
}

.icon-Terms-and-conditions1:before {
  content: "\e996";
  color: #fff;
}

.icon-Referrals1:before {
  content: "\e997";
  color: #fff;
}

.icon-Login1:before {
  content: "\e998";
  color: #fff;
}

.icon-Partner-apps1:before {
  content: "\e999";
  color: #fff;
}

.icon-Platform-support1:before {
  content: "\e99a";
  color: #fff;
}

.icon-Billing-plans1:before {
  content: "\e99b";
  color: #fff;
}

.icon-Content-related:before {
  content: "\e99c";
  color: #fff;
}

.icon-device-manage:before {
  content: "\e978";
  color: #8e81a1;
}

.icon-sign-out:before {
  content: "\e97a";
  color: #8e81a1;
  font-size: 20px;
}

.icon-Refresh:before {
  content: "\e980";
  color: #a3a6c2;
  font-size: 20px;
}

.icon-Switch-Account:before {
  content: "\e98b";
  color: #8e81a1;
}

.icon-Help-Grey:before {
  content: "\e990";
  color: #8e81a1;
}

.icon-Setting:before {
  content: "\e991";
  color: #8e81a1;
}

.icon-icon-search:before {
  content: "\e98e";
  color: #766a84;
}

.icon-icon-web-device:before {
  content: "\e98d";
  color: #a3a6c2;
}

.icon-mobile-device:before {
  content: "\e98a";
  color: #a3a6c2;
}

.icon-Referrals:before {
  content: "\e983";
  color: #fff;
}

.icon-Billing-plans:before {
  content: "\e984";
  color: #fff;
}

.icon-Partner-apps:before {
  content: "\e985";
  color: #fff;
}

.icon-Terms-and-conditions:before {
  content: "\e986";
  color: #fff;
}

.icon-Platform-support:before {
  content: "\e987";
  color: #fff;
}

.icon-Login:before {
  content: "\e988";
  color: #fff;
}

.icon-Profil-1:before {
  content: "\e989";
  color: #fff;
}

.icon-wallet:before {
  content: "\e981";
  color: #a3a6c2;
}

.icon-TV-Shows-2:before {
  content: "\e976";
  color: #a3a6c2;
}

.icon-Crown:before {
  content: "\e979";
}

.icon-Notification-Bell:before {
  content: "\e97b";
  color: #a3a6c2;
}

.icon-Path:before {
  content: "\e97c";
  color: #a3a6c2;
}

.icon-Right-Blue-Arrow:before {
  content: "\e97d";
  color: #5087c7;
}

.icon-Right-Grey-Arrow:before {
  content: "\e97e";
  color: #fff;
}

.icon-Right-Yellow-Arrow:before {
  content: "\e97f";
}

.icon-plus:before {
  content: "\e975";
  color: #fff;
}

.icon-devices:before {
  content: "\e973";
  color: #fff;
}

.icon-pack-device:before {
  content: "\e974";
  color: #fff;
}

.icon-app-icon-place .path1:before {
  content: "\e970";
  color: rgb(0, 0, 0);
}

.icon-app-icon-place .path2:before {
  content: "\e971";
  margin-left: -1em;
  color: rgb(51, 53, 77);
}

.icon-app-icon-place .path3:before {
  content: "\e972";
  margin-left: -1em;
  color: rgb(68, 71, 100);
}

.icon-watchlist_active:before {
  content: "\e968";
}

.icon-watchlist_in_active:before {
  content: "\e969";
}

.icon-movies_active:before {
  content: "\e96a";
  color: #fff;
}

.icon-movies_in_active:before {
  content: "\e96b";
  color: #a3a6c2;
}

.icon-tv_active:before {
  content: "\e96c";
  color: #fff;
}

.icon-kids_active:before {
  content: "\e96d";
  color: #fff;
}

.icon-tv_in_active:before {
  content: "\e96e";
  color: #a3a6c2;
}

.icon-my_subscription:before {
  content: "\e960";
  color: #a3a6c2;
}

.icon-inactive_new:before {
  content: "\e961";
  color: #a3a6c2;
}

.icon-combined_shape:before {
  content: "\e962";
  color: #a3a6c2;
}

.icon-feedback:before {
  content: "\e95f";
  color: #a3a6c2;
}

.icon-chat:before {
  content: "\e95e";
  color: #a3a6c2;
}

.icon-calender:before {
  content: "\e95d";
  color: #a3a6c2;
}

.icon-group-24:before {
  content: "\e95c";
  color: #a3a6c2;
}

.icon-circle-copy:before {
  content: "\e95b";
  color: #a3a6c2;
}

.icon-no-internet:before {
  content: "\e959";
  color: #a3a6c2;
}

.icon-warning:before {
  content: "\e95a";
  color: #a3a6c2;
}

.icon-remove-phon:before {
  content: "\e958";
  color: #a3a6c2;
}

.icon-refresh:before {
  content: "\e954";
  color: #fff;
}

.icon-radio_active .path1:before {
  content: "\e951";
  color: rgb(80, 135, 199);
}

.icon-radio_active .path2:before {
  content: "\e952";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-oval:before {
  content: "\e94f";
  color: #e56c6c;
}

.icon-trash-grey:before {
  content: "\e950";
  color: #a3a6c2;
}

.icon-notification_settings .path1:before {
  content: "\e94b";
  color: rgb(163, 166, 194);
}

.icon-notification_settings .path2:before {
  content: "\e94c";
  margin-left: -0.9375em;
  color: rgb(163, 166, 194);
}

.icon-notification_settings .path3:before {
  content: "\e94d";
  margin-left: -0.9375em;
  color: rgb(51, 53, 77);
}

.icon-notification_settings .path4:before {
  content: "\e94e";
  margin-left: -0.9375em;
  color: none;
}

.icon-replay .path1:before {
  content: "\e948";
  color: rgb(255, 255, 255);
  opacity: 0.4;
}

.icon-replay .path2:before {
  content: "\e94a";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-minimise:before {
  content: "\e946";
  color: #fff;
}

.icon-enlarge:before {
  content: "\e947";
  color: #fff;
}

.icon-percent:before {
  content: "\e941";
  color: #fff;
}

.icon-percent1:before {
  content: "\e943";
  color: #fff;
}

.icon-percent2:before {
  content: "\e944";
  color: #fff;
}

.icon-mute:before {
  content: "\e945";
  color: #fff;
}

.icon-fav:before {
  content: "\e940";
  color: #e5007d;
}

.icon-email:before {
  content: "\e933";
  color: #a3a6c2;
}

.icon-chat1:before {
  content: "\e934";
  color: #a3a6c2;
}

.icon-faq:before {
  content: "\e935";
  color: #a3a6c2;
}

.icon-callback:before {
  content: "\e936";
  color: #a3a6c2;
}

.icon-account1:before {
  content: "\e92f";
  color: #fff;
}

.icon-play-icon .path1:before {
  content: "\e92b";
  color: rgb(255, 255, 255);
  opacity: 0.4;
}

.icon-play-icon .path2:before {
  content: "\e937";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-play1:before {
  content: "\e92c";
  color: #fff;
}

.icon-load-more:before {
  content: "\e92d";
  color: #a3a6c2;
}

.icon-select .path1:before {
  content: "\e927";
  color: rgb(255, 255, 255);
}

.icon-select .path2:before {
  content: "\e938";
  margin-left: -1em;
  color: rgb(80, 135, 199);
}

.icon-select .path3:before {
  content: "\e939";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-download .path1:before {
  content: "\e929";
  color: rgb(80, 135, 199);
}

.icon-download .path2:before {
  content: "\e93a";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-arrow-see-all .path1:before {
  content: "\e91d";
  color: rgb(80, 135, 199);
}

.icon-arrow-see-all .path2:before {
  content: "\e93b";
  margin-left: -1.0498046875em;
  color: rgb(255, 255, 255);
}

.icon-camera .path1:before {
  content: "\e91e";
  color: rgb(80, 135, 199);
}

.icon-camera .path2:before {
  content: "\e93c";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-delete .path1:before {
  content: "\e91f";
  color: rgb(80, 135, 199);
}

.icon-delete .path2:before {
  content: "\e93d";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-device:before {
  content: "\e920";
  color: #a3a6c2;
}

.icon-down:before {
  content: "\e926";
  color: #fff;
}

.icon-icon-search1:before {
  content: "\e926";
  color: #fff;
}

.icon-notification-unread .path1:before {
  content: "\e925";
  color: rgb(255, 255, 255);
}

.icon-notification-unread .path2:before {
  content: "\e93e";
  margin-left: -1em;
  color: rgb(229, 108, 108);
}

.icon-overlay .path1:before {
  content: "\e922";
  color: rgb(0, 0, 0);
  opacity: 0.0625;
}

.icon-overlay .path2:before {
  content: "\e93f";
  margin-left: -1.6533203125em;
  color: rgb(0, 0, 0);
  opacity: 0.0135;
}

.icon-my-subscription-1:before {
  content: "\e923";
  color: #a3a6c2;
}

.icon-tv1:before {
  content: "\e924";
  color: #a3a6c2;
}

.icon-right:before {
  content: "\e914";
  color: #fff;
}

.icon-switch-account:before {
  content: "\e915";
  color: #a3a6c2;
}

.icon-trans-history:before {
  content: "\e916";
  color: #a3a6c2;
}

.icon-my-offers:before {
  content: "\e917";
  color: #a3a6c2;
}

.icon-more:before {
  content: "\e918";
  color: #a3a6c2;
}

.icon-link-accounts:before {
  content: "\e919";
  color: #a3a6c2;
}

.icon-device-management:before {
  content: "\e91a";
  color: #a3a6c2;
}

.icon-left-arrow:before {
  content: "\e942";
  color: #92908f;
}

.icon-right-arrow:before {
  content: "\e928";
  color: #f60;
}

.icon-check:before {
  content: "\e913";
  color: #df7b2a;
}

.icon-share:before {
  content: "\e949";
  color: #bcbcbc;
}

.icon-watchlist:before {
  content: "\e905";
}

.icon-volume:before {
  content: "\e906";
  color: #fff;
}

.icon-audio-and-subtitles:before {
  content: "\e907";
  color: #fff;
}

.icon-settings:before {
  content: "\e908";
  color: #fff;
}

.icon-select-prev:before {
  content: "\e909";
  color: #fff;
}

.icon-play:before {
  content: "\e90a";
  color: #fff;
}

.icon-back-2:before {
  content: "\e90b";
  color: #fff;
}

.icon-forward:before {
  content: "\e90c";
  color: #fff;
}

.icon-rewind:before {
  content: "\e90d";
  color: #fff;
}

.icon-pause:before {
  content: "\e90e";
  color: #fff;
}

.icon-select-blue .path1:before {
  content: "\e90f";
  color: rgb(80, 135, 199);
}

.icon-select-blue .path2:before {
  content: "\e910";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-downgrade:before {
  content: "\e953";
  color: #a3a6c2;
}

.icon-upgrade1:before {
  content: "\e955";
  color: #a3a6c2;
}

.icon-info .path1:before {
  content: "\e956";
  color: rgb(80, 135, 199);
}

.icon-info .path2:before {
  content: "\e957";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-share1:before {
  content: "\e98c";
  color: #bcbcbc;
}

.icon-local_movies:before {
  content: "\e965";
}

.icon-child_care:before {
  content: "\e963";
}

.icon-visibility_off:before {
  content: "\e931";
}

.icon-visibility_on:before {
  content: "\e932";
}

.icon-tv:before {
  content: "\e964";
}

.icon-television:before {
  content: "\e964";
}

.icon-show:before {
  content: "\e964";
}

.icon-pencil:before {
  content: "\e91b";
}

.icon-bell:before {
  content: "\e901";
}

.icon-search:before {
  content: "\e900";
}

.icon-magnifier:before {
  content: "\e900";
}

.icon-magnifying-glass:before {
  content: "\e900";
}

.icon-inspect:before {
  content: "\e900";
}

.icon-find:before {
  content: "\e900";
}

.icon-star-empty1:before {
  content: "\e92e";
}

.icon-eye-blocked:before {
  content: "\e904";
}

.icon-eye:before {
  content: "\e903";
}

.icon-star-empty:before {
  content: "\e902";
}

.icon-bell1:before {
  content: "\e911";
}

.icon-search1:before {
  content: "\e912";
}

.icon-magnifier1:before {
  content: "\e912";
}

.icon-magnifying-glass1:before {
  content: "\e912";
}

.icon-inspect1:before {
  content: "\e912";
}

.icon-find1:before {
  content: "\e912";
}

.icon-mic:before {
  content: "\e982";
}

.icon-arrow-left2:before {
  content: "\ea40";
}

.icon-inr:before {
  content: "\e91c";
}

.icon-mail-forward:before {
  content: "\e930";
}

div#app {
  min-height: 100vh;
  background-color: #020005;
  cursor: default;
}

body {
  background-color: #020005;
}

body, html {
  font-size: 16px;
  height: 100%;
  width: 100%;
  scrollbar-color: #52547a #33345d;
  scrollbar-width: thin;
  position: relative;
  font-family: volte_reg;
  /*  @include respond-to(mobilePortrait) {
      font-size: 23%;
    }
    @include respond-to(mobileLandscape) {
      font-size: 41%;
    }
    @include respond-to(tabletPortrait) {
      font-size: 56%;
    }
    @include respond-to(tabletLandscape) {
      font-size: 89%;
    }
    @include respond-to(desktop) {
      font-size: 100%;
    }*/
}

.overflow-hamburger {
  overflow-y: hidden !important;
}

div, ul, li {
  scrollbar-width: thin;
}

.listing-horizontal::-webkit-scrollbar, header .header-left nav::-webkit-scrollbar,
.detail p.description::-webkit-scrollbar, header .header-left ul::-webkit-scrollbar, .seasons-number::-webkit-scrollbar {
  display: none;
  scrollbar-width: none;
}

h1 {
  color: #ffffff;
}

.white-text {
  color: #ffffff;
}

.form-container {
  margin-top: 4em;
  padding: 25px 6.9% 50px 6.9%;
}
.form-container h1 {
  font-family: volte_medium;
}
.form-container input {
  width: 324px;
  font-size: 16px;
}
.form-container .page-heading {
  margin-bottom: 32px;
}
.form-container .btn {
  font-family: volte_reg;
  margin-top: 30px;
  font-size: 16px;
  min-width: 200px;
}

/* width */
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
  cursor: pointer;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #33354d;
  border-radius: 5px;
  cursor: pointer;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #52547a;
  border-radius: 50px;
  cursor: pointer;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #52547a;
  cursor: pointer;
}

.float-right {
  float: right;
}

HTML, BODY {
  scrollbar-face-color: #33354d;
  scrollbar-arrow-color: #33354d;
  scrollbar-track-color: #2b2d41;
  scrollbar-shadow-color: #33354d;
  scrollbar-highlight-color: transparent;
  scrollbar-3dlight-color: #808080;
  scrollbar-darkshadow-Color: #1d1e30;
  cursor: pointer;
}

.get-icon-success-tick {
  background-color: #ffffff;
  padding: 8px 7px;
  border-radius: 50%;
}
.get-icon-success-tick i:before {
  color: #7ed321;
  position: relative;
  top: 7px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus input:-webkit-autofill,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-text-fill-color: #ffffff !important;
  transition: background-color 5000s ease-in-out 0s;
}

.list-heading {
  padding-left: 90px;
  font-size: 20px;
  font-family: volte_medium;
  color: #ffffff;
  line-height: 1;
  position: relative;
  top: 7px;
}

.heading-line {
  margin-bottom: 16px;
  padding-left: 90px;
}
.heading-line:before {
  content: "";
  background-image: url(/3029262e45fd04fb6e331202130bb484.png);
  height: 2px;
  background-size: cover;
  display: inline-block;
  width: 85%;
  margin-right: 8px;
}
.heading-line .heading-span {
  text-decoration: none;
  cursor: pointer;
  font-size: 16px;
  font-family: volte_medium;
  color: #ffffff;
}
.heading-line .heading-span:after {
  content: "";
  display: inline-block;
  width: 21px;
  height: 20px;
  background: url(/9ebeca947bf1db810a8cbf7d06b827f3.svg) no-repeat;
  position: relative;
  top: 4px;
  left: 7px;
}

.container-top {
  top: 70px;
  position: relative;
}

.grid-view {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  padding: 50px 153px;
}
.grid-view li {
  margin-bottom: 40px;
}
.grid-view.listing-landscape li {
  width: 215px;
  height: 176px;
  margin-right: 20px;
}
.grid-view.listing-portrait li {
  width: 167px;
  height: 306px;
}
.grid-view.listing-top_portrait li {
  width: 310px;
  height: 460px;
}

.load-more {
  text-align: center;
}
.load-more img {
  cursor: pointer;
}
.load-more svg {
  margin-bottom: 12px;
}
.load-more span {
  color: #ffffff;
  display: block;
  font-family: volte_medium;
  font-size: 21px;
  line-height: 1.2;
}

.error-text {
  color: #e56c6c;
}

.Toastify__close-button {
  width: auto;
  font-family: volte_medium;
}

input[type=text]::-ms-clear, input[type=tel]::-ms-clear {
  display: none;
}

input[type=password]::-ms-reveal,
input[type=password]::-ms-clear {
  display: none;
}

a.more-less {
  color: #f3cbe3;
  font-family: volte_medium;
  font-size: 13px;
  cursor: pointer;
  text-decoration: none;
  border-radius: 10px;
  border: 1px solid #f3cbe3;
  padding: 3px 10px;
  display: inline-block;
  line-height: 17px;
  margin-top: 5px;
}

.tooltip {
  position: relative;
  display: inline-block;
}
.tooltip .tooltip-text {
  visibility: hidden;
  width: 150px;
  background-color: transparent;
  color: #ffffff;
  border-radius: 0;
  padding: 0;
  position: absolute;
  left: 60px;
  top: 30%;
  z-index: 1;
  font-size: 16px;
}
.tooltip:hover .tooltip-text {
  visibility: visible;
}

.infinite-scroll-component {
  overflow: visible !important;
}
.infinite-scroll-component img.scroll-loader {
  height: 200px;
  width: 200px;
  position: relative;
  display: block;
  left: 40%;
  top: -4px;
  margin-top: 20px;
}

.avatar-image.sb-avatar__text {
  background: linear-gradient(to right, #f08300, #e3000f 43%, #a72879 101%);
  border-radius: 50%;
  text-align: center;
  box-sizing: border-box;
}
.avatar-image.sb-avatar.sb-avatar--text {
  position: relative;
  border-radius: 50%;
  cursor: pointer;
}
.avatar-image.sb-avatar.sb-avatar--text div {
  font-family: volte_medium;
  color: #ffffff;
}

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  .infinite-scroll-component img.scroll-loader {
    margin: 0 auto;
    left: 0;
    width: 150px !important;
    height: 150px !important;
  }
}
@media (max-width: 1280px) {
  div#app .device-container, body .device-container {
    /*width: 1280px;*/
  }
  div#app .device-container header .header, div#app .device-container .popupOuter, body .device-container header .header, body .device-container .popupOuter {
    /* width: 1280px;*/
  }
  body {
    overflow-x: auto;
  }
  .popupOuter {
    position: absolute;
    overflow: auto;
  }
}
@media (max-width: 1280px) and (orientation: landscape) {
  .popupOuter {
    position: fixed;
    overflow: hidden;
  }
}
/*@media (min-width: 1920px) {
  body {
    background-color: $black-color;
  }
  div#app {
    margin: auto;
    !*padding-bottom: 100px;*!

    .binge-login-container {
      width: 1920px;
    }
  }
  header .header {
    width: 1920px;
    left: auto;
  }
  .popup_overlay.black_overlay {
    background-size: 1920px 100%;
    background-repeat: no-repeat;
    background-position: center;
  }
}*/
.gradiant-bg .modal-body {
  position: relative;
  z-index: 1;
}

.bg-wrapper {
  width: 100%;
  height: 200px;
  position: absolute;
  z-index: 0;
  opacity: 0.8;
  -webkit-filter: blur(50px);
  -moz-filter: blur(50px);
  -o-filter: blur(50px);
  -ms-filter: blur(50px);
  filter: blur(50px);
}

.error-state-modal.cancel-plan .btn-group {
  margin-top: 10px !important;
}
.error-state-modal .popupSec {
  width: 640px;
}
.error-state-modal .popupSec .modal-body {
  padding: 0 10%;
}
.error-state-modal .popupSec .modal-body .alert-icon {
  margin: 0px;
}
.error-state-modal .popupSec .modal-body .alert-icon i {
  font-size: 40px;
}
.error-state-modal .popupSec .modal-body .btn-group {
  width: 280px;
}
.error-state-modal .popupSec .modal-body .btn-group .btn {
  margin: 0 auto;
}
.error-state-modal .popupSec .modal-body p.instructions-text {
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #A3A6C2;
  margin-bottom: 20px;
}
.error-state-modal .popupSec .modal-body p.instructions-text.error-code {
  margin-top: 5px;
  font-size: 16px;
}
.error-state-modal .popupSec .modal-body h1 {
  font-size: 26px;
  line-height: 120%;
  font-family: volte_reg;
}
.error-state-modal .popupSec .modal-body .error-code {
  margin-top: 20px;
}
@media only screen and (min-width: 320px) and (max-width: 520px) {
  .error-state-modal .popupSec .modal-body .alert-icon {
    margin-top: 26px;
  }
  .error-state-modal .popupSec .modal-body h1 {
    font-size: 20px;
  }
  .error-state-modal .popupSec .modal-body .btn-group {
    width: 100%;
  }
  .error-state-modal .popupSec .modal-body .btn-group .btn {
    margin-top: 20px;
  }
}
@media only screen and (max-width: 768px) {
  .error-state-modal .popupSec {
    width: 75%;
    height: auto;
    overflow-y: auto;
  }
  .error-state-modal .popupSec .modal-body .btn-group {
    width: 100%;
  }
}
@media only screen and (max-width: 768px) {
  .error-state-modal .popupSec {
    width: 95%;
  }
}

.alert-modal.connect-timeout-modal .popupOuter {
  z-index: 10002;
}
.alert-modal.connect-timeout-modal .popupOuter i.icon-alert-upd {
  font-size: 82px;
}

a {
  outline: none;
}

/*

@media only screen and (min-width: 320px) and (max-width: 767px) and (orientation: landscape) {
  html {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
    height:98vw;
  }
}*/
.slick-slider .slick-arrow {
  display: none !important;
}
.slick-slider .slick-arrow:hover:before {
  border: solid #ffffff;
  border-width: 0 4px 4px 0;
}
.slick-slider:hover .slick-arrow {
  display: block !important;
}

.Toastify__toast-container {
  z-index: 10000 !important;
  font-family: volte_medium;
}

@media only screen and (max-width: 480px) {
  .Toastify__toast-container {
    width: 100% !important;
  }
  .Toastify__toast {
    /* margin-bottom: 0; */
    width: 80%;
    margin: 10px auto;
    border-radius: 8px !important;
  }
  .Toastify__toast-body {
    font-size: 14px !important;
    line-height: 20px !important;
  }
}
.Toastify__toast--default {
  background: #020005;
  color: #f3cbe3;
}

.Toastify__close-button--default {
  color: white;
}

.Toastify__toast {
  position: relative;
  min-height: 50px;
  background: linear-gradient(294.99deg, #A22736 0%, #220046 100%);
  border-radius: 8px !important;
  width: 640px;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
  font-family: volte_medium;
  height: 66px;
}

.Toastify__toast-body {
  color: #ffffff;
  font-size: 20px;
  font-weight: 500;
  line-height: 120%;
  font-family: volte_medium;
  letter-spacing: normal;
}

.Toastify__toast-container--top-right {
  top: 0.5em;
}

.blue-text {
  color: #5087c7;
  text-decoration: underline;
}

input,
textarea,
button,
select,
a, p, span, div {
  -webkit-tap-highlight-color: transparent;
}

b {
  font-weight: bold;
}

.hide-overflow {
  overflow: hidden !important;
  min-height: 100vh !important;
}

.form-group {
  margin: 10px auto;
  list-style: none;
}
.form-group .or-text {
  display: inline-block;
  margin: 0 30px;
}
.form-group .form-data {
  display: inline-block;
  min-width: 263px;
}
.form-group .form-data .or-text {
  display: inline-block;
}

.red-background-errors {
  color: #ffffff;
  background: #e56c6c;
  display: block;
  padding: 10px;
  width: 100%;
}

.important-message {
  background: #dbdbdb;
  padding: 10px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  margin-bottom: 20px;
}

@media only screen and (min-width: 320px) and (max-width: 767px) {
  .form-group .form-data .multi-select {
    margin-right: 0;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.campaign-container {
  background: linear-gradient(180.76deg, #020005 -3.36%, #220046 70.02%);
}
.campaign-container .sticky-block {
  position: fixed;
  width: 100vw;
  height: 80px;
  z-index: 9999;
  background: #1E013E;
  transition: 0.2s ease-out;
  top: 80px;
}
.campaign-container .header-logo {
  left: 0px;
  right: 0px;
  top: 0px;
  background: #020005;
  padding: 28px 0 24px 70px;
}
.campaign-container .header-logo.sticky {
  position: fixed;
  top: 0px;
  z-index: 99999;
  width: inherit;
  margin: 0 auto;
  transition: 0.2s ease-out;
}
.campaign-container .header-logo img {
  width: 106.51px;
  height: 25px;
  cursor: pointer;
}
.campaign-container .campaign-hero-banner-container {
  width: 100%;
  overflow-x: hidden;
  overflow-y: hidden;
  position: relative;
}
.campaign-container .campaign-hero-banner-container .slick-dots {
  bottom: -40px;
}
.campaign-container .campaign-hero-banner-container .slick-dots li {
  width: 4px;
}
.campaign-container .campaign-hero-banner-container .slick-dots li .slick-dot-container {
  width: 10px;
  height: 2px;
  border-radius: unset;
  background-color: #e5e7e9;
}
.campaign-container .campaign-hero-banner-container .slick-dots li .slick-dot-container:hover {
  width: 10px;
  height: 2px;
}
.campaign-container .campaign-hero-banner-container .slick-dots li.slick-active .slick-dot-container {
  background-color: #e10092;
}
.campaign-container .campaign-hero-banner-container .container {
  height: 304px !important;
}
.campaign-container .campaign-hero-banner-container .container button.slick-next {
  right: 25px;
}
.campaign-container .campaign-hero-banner-container .container button.slick-prev {
  left: 25px;
}
.campaign-container .campaign-hero-banner-container .container .slick-list {
  height: 271px !important;
  padding: 0 62px !important;
}
.campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide {
  width: auto;
  padding-right: 21px;
  -webkit-perspective: 2000;
  -webkit-backface-visibility: hidden;
}
.campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide div {
  position: relative;
}
.campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide .hero-banner {
  height: 271px !important;
  width: 558px !important;
}
.campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide .hero-banner .crown-image {
  display: none;
}
.campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide .hero-banner img {
  border-radius: 6px;
  cursor: unset;
}
.campaign-container .pack-detail-container {
  width: 613px;
  margin: 0 auto;
  margin-top: 14px;
}
.campaign-container .pack-detail-container .info {
  font-weight: 600;
  font-size: 28px;
  line-height: 28px;
  text-align: center;
  color: #FFFFFF;
}
.campaign-container .pack-detail-container .pack-details {
  margin-top: 27px;
}
.campaign-container .pack-detail-container .pack-details.sticky {
  position: fixed;
  top: 89px;
  z-index: 99999;
  width: inherit;
  margin: 0 auto;
}
.campaign-container .pack-detail-container .pack-details .pack-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-name {
  display: flex;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-name div {
  width: 20px;
  height: 18px;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-name div img {
  width: 100%;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-name p {
  padding-left: 8px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 120%;
  color: #ffffff;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-name p.pack-highlight {
  background: linear-gradient(270deg, #FFA800 0%, #FFF389 45.31%, #FFA800 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-discount {
  display: flex;
  align-items: center;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-discount .amount {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 100%;
  text-align: center;
  color: #FFFFFF;
  text-decoration: line-through;
  padding-right: 5px;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-discount .save-container {
  padding: 2px 5px;
  gap: 10px;
  width: 70px;
  background: #6B00DD;
  border-radius: 6px;
}
.campaign-container .pack-detail-container .pack-details .pack-info .pack-discount .save-container p {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 120%;
  color: #FFFFFF;
}
.campaign-container .pack-detail-container .pack-details .apps-info {
  margin-top: 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.campaign-container .pack-detail-container .pack-details .apps-info .apps-device {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  display: flex;
  align-items: center;
  color: #D6C6F4;
}
.campaign-container .pack-detail-container .pack-details .apps-info .pack-amount {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 600;
  font-size: 24px;
  line-height: 100%;
  text-align: center;
  color: #FFFFFF;
}
.campaign-container .pack-detail-container .pack-details .apps-info .pack-amount span:last-child {
  font-size: 16px;
  font-family: volte_reg;
}
.campaign-container .pack-detail-container .partner-container {
  width: 85%;
  display: flex;
  flex-wrap: wrap;
  margin-top: 28px;
  margin-bottom: 0px;
  position: relative;
}
.campaign-container .pack-detail-container .partner-container .img-container {
  width: 68px;
  height: 68px;
  margin-right: 17.81px;
  margin-bottom: 17.81px;
}
.campaign-container .pack-detail-container .partner-container .img-container.premium-content {
  background-image: linear-gradient(#FFA800 100%, #FFF389 100%, #FFA800 100%);
  border-radius: 100%;
  padding: 2px;
  width: 70px;
  height: 70px;
}
.campaign-container .pack-detail-container .partner-container .img-container img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.campaign-container .pack-detail-container .msg-info {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 17px;
  color: #F2F2F2;
  margin-top: 12px;
}
.campaign-container .faq-whytp-container {
  width: 77%;
  margin: 0 auto;
}
.campaign-container .faq-whytp-container .why-tp {
  background: linear-gradient(294.65deg, #020005 0.69%, #220046 100%);
  border: 1px solid #564372;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 57px 101px 28px 101px;
  margin-top: 86px;
  position: relative;
}
.campaign-container .faq-whytp-container .why-tp .why-tp-text-block {
  position: absolute;
  top: -14px;
  left: 39%;
  display: flex;
}
.campaign-container .faq-whytp-container .why-tp .why-tp-text-block .why-tp-text {
  font-family: volte_semiBold;
  font-style: normal;
  font-weight: 700;
  font-size: 26px;
  line-height: 32px;
  color: #FFFFFF;
  z-index: 2;
}
.campaign-container .faq-whytp-container .why-tp .why-tp-text-block img {
  position: absolute;
  left: 34%;
  z-index: 1;
  width: 89.79px;
  height: 92.18px;
  bottom: -28px;
}
.campaign-container .faq-whytp-container .why-tp .why-tp-text-block .border-line {
  width: 396.48px;
  height: 1px;
  background: #210243;
  top: 13px;
  left: -65px;
  position: absolute;
}
.campaign-container .faq-whytp-container .why-tp .info-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.campaign-container .faq-whytp-container .why-tp .info-wrapper div {
  max-width: 39px;
  max-height: 39px;
}
.campaign-container .faq-whytp-container .why-tp .info-wrapper div img {
  width: 100%;
}
.campaign-container .faq-whytp-container .why-tp .info-wrapper p {
  margin-top: 12px;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 18px;
  line-height: 22px;
  color: #FFFFFF;
}
.campaign-container .faq-whytp-container .why-tp .info-wrapper p:last-child {
  margin-top: 1px;
}
.campaign-container .faq-whytp-container .explore-plans {
  background: linear-gradient(0deg, #220046 71.71%, #E10092 178.81%);
  border: 1px solid #564372;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
  text-align: center;
  padding: 17.5px 0;
  margin-top: 30px;
}
.campaign-container .faq-whytp-container .explore-plans p:first-child {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 20px;
  line-height: 120%;
  text-align: center;
  color: #FFFFFF;
}
.campaign-container .faq-whytp-container .explore-plans p:last-child {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 10px;
}
.campaign-container .faq-whytp-container .explore-plans p:last-child span {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 20px;
  line-height: 120%;
  color: #F3CBE3;
  cursor: pointer;
}
.campaign-container .faq-whytp-container .explore-plans p:last-child img {
  padding-left: 8px;
}
.campaign-container .faq-whytp-container .faq-container {
  width: 100%;
  padding: 0;
  margin-top: 42px;
  margin-bottom: 23.5px;
  padding: 0 40px;
}
.campaign-container .faq-whytp-container .faq-container .faq-headings h2 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  color: #FFFFFF;
}
.campaign-container .faq-whytp-container .faq-container h3 {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  color: #FFFFFF;
  font-size: 28px;
  text-align: center;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper {
  background: inherit;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .heading-md {
  margin-top: 20px;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .heading-md::before {
  content: "";
  position: unset;
  width: 0;
  height: 0;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .heading-md .heading1 {
  font-size: 20px !important;
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  color: #FFFFFF;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion {
  background: inherit;
  padding-right: 0;
  margin-top: 0;
  cursor: unset;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card {
  border-bottom: 0px;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-header div {
  padding: 0;
  margin-top: 21px;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-header div img {
  width: 13.33px;
  height: 6.67px;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-header .accordion-title {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 120%;
  color: #FFFFFF;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-header img {
  filter: brightness(0) saturate(100%) invert(87%) sepia(6%) saturate(1201%) hue-rotate(285deg) brightness(101%) contrast(91%);
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body {
  padding: 0;
  margin-bottom: 1px;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body div {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 120%;
  background: linear-gradient(90deg, #D6C6F4 0%, #D6C6F4 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body div:nth-child(1) {
  margin-top: 11px;
  width: 83%;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body div:nth-child(1) div {
  width: 100%;
}
.campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body div a {
  -webkit-text-fill-color: #e10092;
}
.campaign-container .buy-now-btn-container {
  background: linear-gradient(180deg, rgba(2, 0, 5, 0) 11.86%, #020005 39.33%, #020005 119.23%);
  opacity: 0.9;
  display: flex;
  justify-content: center;
  padding-bottom: 17px;
  padding-top: 58px;
  position: relative;
  position: sticky;
  bottom: 0rem;
  z-index: 99999999;
}
.campaign-container .buy-now-btn-container .buy-btn {
  cursor: pointer;
  background: #E10092;
  border-radius: 22px;
  padding: 13px 81.5px 15px 81.5px;
  border: none;
}
.campaign-container .buy-now-btn-container .buy-btn span {
  font-family: volte_reg;
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 100%;
  color: #FFFFFF;
}

@media screen and (max-width: 768px) {
  .campaign-container .sticky-block {
    top: 46px;
  }
  .campaign-container .header-logo {
    padding: 15px 0 13px 54px;
  }
  .campaign-container .header-logo img {
    width: 63px;
    height: 16px;
    cursor: pointer;
  }
}
@media screen and (max-width: 768px) and (max-width: 480px) {
  .campaign-container .campaign-hero-banner-container .container {
    height: 175px !important;
    padding: 0;
  }
  .campaign-container .campaign-hero-banner-container .container .slick-list {
    height: 148px !important;
    padding: 0 56px !important;
  }
  .campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide {
    position: relative;
    width: auto !important;
    padding-right: 8px;
  }
  .campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide .hero-banner {
    height: 142px !important;
    width: 292px !important;
  }
  .campaign-container .campaign-hero-banner-container .container .slick-list .slick-slide .hero-banner img {
    border-radius: 6px;
  }
}
@media screen and (max-width: 768px) {
  .campaign-container .pack-detail-container {
    width: 90%;
  }
  .campaign-container .pack-detail-container .info {
    font-size: 16px;
    line-height: 16px;
    width: 245px;
    margin: auto;
  }
  .campaign-container .pack-detail-container .pack-details {
    margin-top: 21px;
  }
  .campaign-container .pack-detail-container .pack-details.sticky {
    top: 57px;
  }
  .campaign-container .pack-detail-container .pack-details .pack-info .pack-name div {
    width: 21px;
    height: 21px;
  }
  .campaign-container .pack-detail-container .pack-details .pack-info .pack-name p {
    font-size: 16.8px;
    padding-top: 4px;
  }
  .campaign-container .pack-detail-container .pack-details .pack-info .pack-discount .amount {
    font-size: 12px;
  }
  .campaign-container .pack-detail-container .pack-details .pack-info .pack-discount .save-container {
    width: 54px;
    border-radius: 10px;
  }
  .campaign-container .pack-detail-container .pack-details .pack-info .pack-discount .save-container p {
    font-size: 10px;
  }
  .campaign-container .pack-detail-container .pack-details .apps-info {
    margin-top: 9px;
  }
  .campaign-container .pack-detail-container .pack-details .apps-info .apps-device {
    font-size: 14px;
  }
  .campaign-container .pack-detail-container .pack-details .apps-info .pack-amount {
    font-size: 20px;
  }
  .campaign-container .pack-detail-container .pack-details .apps-info .pack-amount span:last-child {
    font-size: 14px;
  }
  .campaign-container .pack-detail-container .partner-container {
    width: 100%;
    margin-top: 22px;
  }
  .campaign-container .pack-detail-container .partner-container .img-container {
    width: 50px;
    height: 50px;
    margin-right: 13.03px;
    margin-bottom: 10px;
  }
  .campaign-container .pack-detail-container .partner-container .img-container.premium-content {
    width: 52px;
    height: 52px;
  }
  .campaign-container .pack-detail-container .msg-info {
    font-size: 12px;
    margin-top: 12px;
  }
  .campaign-container .faq-whytp-container {
    width: 92%;
  }
  .campaign-container .faq-whytp-container .why-tp {
    padding: 50px 16px 22px 16px;
    margin-top: 58px;
    flex-wrap: wrap;
  }
  .campaign-container .faq-whytp-container .why-tp .why-tp-text-block {
    top: -14px;
    left: 25%;
  }
  .campaign-container .faq-whytp-container .why-tp .why-tp-text-block .why-tp-text {
    font-size: 18px;
  }
  .campaign-container .faq-whytp-container .why-tp .why-tp-text-block img {
    left: 36%;
    width: 68.01px;
    height: 69.82px;
    bottom: -18px;
  }
  .campaign-container .faq-whytp-container .why-tp .why-tp-text-block .border-line {
    width: 220px;
    height: 2px;
    left: -21px;
  }
  .campaign-container .faq-whytp-container .why-tp .info-wrapper {
    width: 42%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .campaign-container .faq-whytp-container .why-tp .info-wrapper:nth-child(n+4) {
    margin-top: 22px;
  }
  .campaign-container .faq-whytp-container .why-tp .info-wrapper div {
    max-width: 33px;
    max-height: 33px;
  }
  .campaign-container .faq-whytp-container .why-tp .info-wrapper p {
    margin-top: 10px;
    font-size: 16px;
  }
  .campaign-container .faq-whytp-container .why-tp .info-wrapper p:last-child {
    margin-top: 1px;
  }
  .campaign-container .faq-whytp-container .explore-plans {
    padding: 10px 0 7px 0;
    margin-top: 20px;
  }
  .campaign-container .faq-whytp-container .explore-plans p:first-child {
    font-size: 14px;
  }
  .campaign-container .faq-whytp-container .explore-plans p:last-child {
    margin-top: 7px;
  }
  .campaign-container .faq-whytp-container .explore-plans p:last-child span {
    font-size: 16px;
  }
  .campaign-container .faq-whytp-container .explore-plans p:last-child img {
    padding-left: 8px;
  }
  .campaign-container .faq-whytp-container .faq-container {
    margin-top: 26px;
    margin-bottom: 10px;
    padding: 0;
  }
  .campaign-container .faq-whytp-container .faq-container .faq-headings h2 {
    font-family: volte_reg;
    font-style: normal;
    font-weight: 600;
    line-height: 120%;
    color: #FFFFFF;
  }
  .campaign-container .faq-whytp-container .faq-container h3 {
    font-size: 16px;
    text-align: center;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .heading-md {
    margin-top: 11px;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .heading-md .heading1 {
    font-size: 14px !important;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion {
    height: 82%;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-header div {
    padding: 0;
    margin-top: 21px;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-header .accordion-title {
    font-size: 12px;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body {
    padding: 0;
    margin-bottom: 1px;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body div {
    font-size: 12px;
  }
  .campaign-container .faq-whytp-container .faq-container .campaign-faq-wrapper .accordion .card-body div:nth-child(1) {
    margin-top: 5px;
    width: 90%;
  }
  .campaign-container .buy-now-btn-container {
    padding-bottom: 17px;
    padding-top: 29px;
  }
  .campaign-container .buy-now-btn-container .buy-btn {
    border-radius: 22px;
    padding: 13px 82px 15px 82px;
  }
  .campaign-container .buy-now-btn-container .buy-btn span {
    font-size: 16px;
  }
}
@media screen and (min-width: 480px) and (max-width: 768px) {
  .campaign-container .pack-detail-container {
    width: 66%;
  }
  .campaign-container .pack-detail-container .info {
    font-size: 20px;
    width: auto;
  }
  .campaign-container .pack-detail-container .partner-container {
    width: 100%;
    margin-top: 22px;
  }
  .campaign-container .pack-detail-container .partner-container .img-container {
    width: 60px;
    height: 60px;
    margin-right: 13.03px;
  }
  .campaign-container .pack-detail-container .partner-container .img-container.premium-content {
    width: 62px;
    height: 62px;
  }
  .campaign-container .faq-whytp-container {
    width: 85%;
  }
  .campaign-container .faq-whytp-container .why-tp .why-tp-text-block {
    left: 36%;
  }
}
@media screen and (min-width: 768px) and (max-width: 821px) {
  .campaign-container .faq-whytp-container .why-tp {
    padding: 57px 26px 28px 26px;
  }
  .campaign-container .faq-whytp-container .why-tp .why-tp-text-block {
    left: 30%;
  }
  .campaign-container .faq-container .campaign-faq-wrapper .accordion {
    height: 82%;
  }
}
/* Branding Colours */
/* CTAs/Primary CTA - Pink 100% */
/* Tags / Sub Tag - Purple 100% */
/* Icons & Text/Stroke Color - Binge Blue 100% */
/* Backgrounds & Overlays/Page BG - Dark Blue */
/* Inactive */
/* Backgrounds & Overlays/Pop-up BG - Linear */
/* Bottom Nav Active */
/* Toast Background */
/* Gradients/Golden Sheen */
/* Backgrounds & Overlays/Top - Linear */
/* Backgrounds & Overlays/NEW-Pop Up Gradient */
/* Indicating Colours */
/* Success Green */
/* Error Red */
/*Font-family*/
/* base class */
/* Content Title */
.content-title {
  font-family: volte_medium;
  font-size: 26px;
  line-height: auto;
}

/* Rail + Page Title */
.rail-title,
.page-title {
  font-family: volte_medium;
  font-size: 22px;
  line-height: auto;
}

/* Title/Sub Header Text - 20px Medium */
.title,
.sub-header-text {
  font-family: volte_medium;
  font-size: 20px;
  line-height: auto;
}

/* Description / Content Desc - Regular 16px */
.decription,
.content-desc {
  font-family: volte_reg;
  font-size: 16px;
  line-height: auto;
}

/* Description / Content Desc 2 - Medium 16px */
.content-desc2 {
  font-family: volte_medium;
  font-size: 16px;
  line-height: auto;
}

/* CTA Text / Default - Semi Bold 16px */
.button-text-new {
  font-family: volte_semiBold;
  font-size: 16px;
  line-height: auto;
}

/*Buttons*/
/* PI Buttons */
.pi-button {
  width: 156px;
  height: 46px;
  background: #e10092;
  border-radius: 100px;
}

.Inactive-button {
  width: 320px;
  height: 44px;
  background: #e10092;
  border-radius: 22px;
}

/* font color */
/* Theme color */
/*  Dashboard Variables   */
/* Select dropdown*/
/* Profile Variables */
/* Transaction Variables */
/* Status Variables */
/* Login color */
/* Loader */
/* Fund type color  */
/*  Ways of Transact */
/* fund category */
/* investment tools */
/* font family */
/*Fonts - sizes
 --------------------------*/
/* 14px */
/* 40px */
/* 30px */
/* 24px */
/* 18px */
/* 16px */
/* 12px */
/* 10px */
/* 8px */
/* Heading Stylng */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: sky_reg;
  font-weight: normal;
  line-height: 1.3;
  font-style: normal;
  font-stretch: normal;
  color: #ffffff;
}

h1 {
  font-size: 2.143rem;
}

h2 {
  font-size: 1.714rem;
}

h3 {
  font-size: 1.286rem;
}

/* Base Theme */
/* modal */
/* Form */
/*  Form Elements
 --------------------------*/
input:focus, input:active,
select:focus,
select:active,
button.btn:focus,
button.btn:active {
  outline: none;
}

/* Icons
------------------------*/
.chevron-arrow-left {
  display: inline-block;
  border-right: 2px solid #a8a8a8;
  border-bottom: 2px solid #a8a8a8;
  width: 8px;
  height: 8px;
  transform: rotate(-225deg);
}

.chevron-arrow-right {
  width: 5px;
  height: 5px;
  display: inline-block;
  transform: rotate(-45deg);
  border-right: 1px solid #a8a8a8;
  border-bottom: 1px solid #a8a8a8;
}

.border-right {
  border-right: 1px solid #dbdbdb;
}

.white-container {
  background: #ffffff;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.12);
  border-radius: 4px;
  margin-bottom: 30px;
}

.orange-button {
  background: #5087c7;
  cursor: pointer;
}

.blue-link {
  font-family: sky_reg;
  font-size: 1.143rem;
  color: #5674b9;
}

.additional-container {
  padding: 20px;
  background: #eef2f4;
  border: 1px solid #dbdbdb;
}

.orange-text {
  color: #5087c7;
  cursor: pointer;
  font-weight: bold;
  text-decoration: underline;
}

.ticket-container {
  min-height: 100vh;
  background: #fff;
  padding-bottom: 40px;
}
.ticket-container .ticket-empty-message {
  text-align: center;
  font-size: 16px;
  margin: 4%;
  font-family: volte_reg;
  color: #1d1e30;
}
.ticket-container .container {
  width: 996px;
  max-width: 100%;
  margin: 0 auto;
}
.ticket-container .tickets-data {
  background: rgba(34, 0, 70, 0.1) !important;
  padding-bottom: 40px;
}
.ticket-container .nav-tabs {
  border-bottom: 0;
  display: flex;
  justify-content: space-between;
  padding: 40px 0 20px 0;
}
.ticket-container .nav-tabs .active {
  border-bottom: 5px solid #220046;
  color: #220046;
  transition: opacity 0.15s linear;
}
.ticket-container .nav-tabs li {
  width: 50%;
  text-align: center;
  padding-bottom: 17px;
  border-bottom: 1px solid #cbcbcb;
  font-size: 18px;
  font-weight: 400;
  cursor: pointer;
  font-family: volte_medium;
  color: #e10092;
}
.ticket-container .nav-tabs li:hover {
  color: #220046;
}
.ticket-container .ticket-chat-container {
  padding-top: 29px;
  margin-bottom: -18px;
}

.page-header {
  padding-top: 15px;
  padding-bottom: 15px;
}
.page-header .category-header {
  display: flex;
  align-items: center;
}
.page-header .category-header .icon-contr {
  display: flex;
  color: #ffffff;
  align-items: center;
  margin-right: 10px;
  width: 25px;
  cursor: pointer;
}
.page-header .category-header .icon-contr img {
  max-width: 100%;
}
.page-header .category-header .img-contr {
  height: 30px;
  width: 30px;
  display: flex;
  margin-right: 10px;
  justify-content: center;
  background: #594074;
  padding: 6px;
  border-radius: 50%;
}
.page-header .category-header .text-contr-msg {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 15px);
  font-size: 28px;
  font-family: volte_medium;
}

@media screen and (max-width: 599px) {
  .ticket-container .category-header .text-contr {
    font-size: 20px !important;
  }
  .ticket-container .nav-tabs {
    padding-top: 30px;
  }
  .ticket-container .nav-tabs li {
    padding-bottom: 15px;
    font-size: 16px;
  }
  f .ticket-container .nav-tabs li:hover {
    color: #220046;
  }
  .ticket-container .ticket-chat-container {
    padding-top: 20px;
    margin-bottom: -27px;
  }
}