.landing-banner {
    height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: linear-gradient(145deg, rgba(30, 11, 155, 0.6), rgba(7, 204, 236, 0.6), transparent), url("../../img/banner/main-banner.jpg");
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin-top: 56px;
}
.offer-panel{
background-color:rgb(255,255,255,0.7);
/*box-shadow: -10px 10px rgb(0 0 0 / 30%);*/
width:80%;
margin: 0 auto;
padding:0px 20px 10px 20px;
border-radius: 10px;
/*-webkit-transform: perspective(230px) rotateX(5deg) rotateY(4deg);
transform: perspective(250px) rotateX(5deg) rotateY(4deg);*/
margin-top:7rem;
/*margin-bottom:2rem;  */  
}
.offer-form {
margin-top:5rem;
padding: 15px 20px;
width: 100%;
border-radius: 10px;
background-color:rgb(255,255,255,0.7);
/*background-image: url(../img/home-shape.png);*/
}
.offer-panel h1{
font-size:2.2rem;
}
.offer-panel h4 span{
font-size: 1.5rem;
font-weight: 700;
text-transform: initial;
font-family: var(--font-family-heading);
letter-spacing: 0;
margin-bottom: 5px;
line-height: 1.2;    
}
.offer-panel ul{
padding-left:0px;
margin-bottom:0px;    
}
.offer-panel li{
padding-left: 1.3em;
font-size:0.9rem;
font-weight:600;    
line-height: 1.2;
color:var(--color-content);
margin-bottom:0.5rem;
}
.offer-panel li span{
font-size:0.9rem;
font-weight:600;    
line-height: 1.2;
margin-bottom:0.5rem;    
}
.offer-panel li:before {
content: "\f005";
font-family: FontAwesome;
color:var(--color-second);    
display: inline-block;    
margin-left: -20px;
margin-right:5px;    
width: 1.3em;
font-size:0.54rem;    
vertical-align:middle
}
.offer-form input.form-control{height:35px;}
.offer-form select.form-select{height:35px;}
.offer-form input{font-size:0.95rem;}
.offer-form input::placeholder {font-size:0.85rem!important;}
.offer-form ::-webkit-input-placeholder {
font-size:0.85rem!important;
}
.offer-form :-moz-placeholder { /* Firefox 18- */
font-size:0.85rem!important;
}
.offer-form::-moz-placeholder {  /* Firefox 19+ */
font-size:0.85rem!important;
}
.offer-form select{font-size:0.75rem!important;}
.offer-form select option{font-size:0.85rem!important;}
.offer-form .form-control.is-invalid, .was-validated .form-control:invalid{
padding-right: calc(0.2rem + 0.5rem)!important; 
background-size: calc(0.55em + 0.375rem) calc(0.75em + 0.375rem)!important;    
}

.offer-form .form-control.is-valid, .was-validated .form-control:valid{
 padding-right: calc(1.5em + 0.75rem) !important;   
background-size: calc(0.55em + 0.275rem) calc(0.55em + 0.275rem) !important;    
}

.form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"], .was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"]{
padding-right: 0.75rem !important;
background-position: right 0.75rem center,center right 1.65rem !important;
background-size: 10px 12px,calc(0.75em + 0.375rem) calc(0.75em + 0.375rem) !important;    
}

.offer-form .radio-block .btn{ 
font-size:0.85rem !important;   
height:35px;
line-height:23px;    
}


.claim-form {
display: table;
width: 100%;
position: relative;
margin-bottom: 15px;
}

.claim-form p{
font-size:.9rem;
}

.claim-form-step {
display: table-cell;
position: relative;
}

.btn-circle {
width: 30px;
height: 30px;
text-align: center;
padding: 6px 0;
font-size: 12px;
line-height: 1.428571429;
border-radius: 15px;
}

.claim-form .btn-active{
background-color:var(--color-first);
border:none !important;
}

.claim-form .btn-step{
border:4px solid var(--color-second);
}
.claim-form .btn-step:focus{outline: none;box-shadow: none;}
.setup-content .custom-control-input:checked~.custom-control-label::before, .setup-content .form-check-input:checked {
background-color: var(--color-first);
border-color: var(--color-first);
}

.setup-content .label {
font-size: .9rem;
font-weight: 400;
}

.claim-form .btn.disabled, .claim-form .btn[disabled], .claim-form fieldset[disabled] .btn {
opacity: 1 !important;
color: #000;
box-shadow: none;
}
.btn:not(:disabled):not(.disabled) {
cursor: pointer;
}
.btn.disabled, .btn[disabled], fieldset[disabled] .btn {
cursor: not-allowed;
pointer-events: none;
opacity: .65;
filter: alpha(opacity=65);
-webkit-box-shadow: none;
box-shadow: none;
}

.webContent .offer-panel h5{
font-size:1.2rem;    
}

.member-perks .benefits-box .icon img{width:auto;}

/*------------- modal style ---------------*/
#pre-lander .logo{height:40px}

.pre-lander .box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
height:100%;
overflow:hidden;
}

.lp-modal{
background-color: rgba(0,0,0,.85)!important;
}
.lp-modal .modal-body{
background-color: #fff;
height:300px;    
}
/*.sp-pre-anim-logo-panel{
border-radius: 60%;
background: #fff;
padding: 0;
text-align: center;
}

.sp-ani-coin-panel{
margin-top: 40px;
margin-bottom: 40px;
}
*/
.sp-ani-circle-loading{
/*border: 0.01em solid hsla(0,0%,59%,.1);*/
border-radius: 50%;
font-size: 100px;
height: 1.7em;
width: 1.7em;
list-style: outside none none;
margin: 0 auto;
position: relative;
top: 35%;
z-index: 2147483647;
}
.sp-ani-circle-loading li{
border-radius: 50%;
height: 0.5em;
position: absolute;
width: 0.5em;
}

.sp-ani-circle-loading li:first-child{
-webkit-animation: 1.13s linear 0s normal none infinite running rota-data-v-0c63b68e,3.67s ease-in-out 0s alternate none infinite running opa-data-v-0c63b68e;
animation: 1.13s linear 0s normal none infinite running rota-data-v-0c63b68e,3.67s ease-in-out 0s alternate none infinite running opa-data-v-0c63b68e;
-webkit-animation-duration: 1.13s!important;
animation-duration: 1.13s!important;
background: #15477b none repeat scroll 0 0;
left: 67%;
margin: 0 0 0 -0.8em;
top: 0;
-webkit-transform-origin: 250% 352%;
transform-origin: 250% 352%;
}

.sp-ani-circle-loading li:nth-child(2){
-webkit-animation: 1.86s linear 0s normal none infinite running rota-data-v-0c63b68e,4.29s ease-in-out 0s alternate none infinite running opa-data-v-0c63b68e;
animation: 1.86s linear 0s normal none infinite running rota-data-v-0c63b68e,4.29s ease-in-out 0s alternate none infinite running opa-data-v-0c63b68e;
-webkit-animation-duration: 1.86s!important;
animation-duration: 1.86s!important;
background: #ff8071 none repeat scroll 0 0;
margin: 0.9em 0 0;
right: 76%;
top: -18%;
-webkit-transform-origin: 300% 330% 0;
transform-origin: 300% 330% 0;
}

.sp-ani-circle-loading li:nth-child(3){
-webkit-animation: 1.45s linear 0s normal none infinite running rota-data-v-0c63b68e,5.12s ease-in-out 0s alternate none infinite running opa-data-v-0c63b68e;
animation: 1.45s linear 0s normal none infinite running rota-data-v-0c63b68e,5.12s ease-in-out 0s alternate none infinite running opa-data-v-0c63b68e;
-webkit-animation-duration: 1.45s!important;
animation-duration: 1.45s!important;
background: #ffc955 none repeat scroll 0 0;
bottom: 76%;
left: 52%;
margin: 0 0 0 -0.8em;
-webkit-transform-origin: 380% 270%;
transform-origin: 380% 270%;
}

.sp-anim-number-loading{
margin: 0 auto;
}

.sp-ani-loading-bar, .sp-anim-number-loading{
height: 200px;
position: relative;
width: 200px;
border-radius: 100%;
}

.sp-ani-loading-bar{
  border: 5px solid transparent;
  border-color: #15477b;
  -moz-animation: rotate-loading 1.5s linear 0s infinite normal;
  -moz-transform-origin: 50% 50%;
  -o-animation: rotate-loading 1.5s linear 0s infinite normal;
  -o-transform-origin: 50% 50%;
  -webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
  -webkit-transform-origin: 50% 50%;
  animation: rotate-loading 1.5s linear 0s infinite normal;
  -webkit-animation-duration: 1.5s!important;
  animation-duration: 1.5s!important;
  transform-origin: 50% 50%;
}


#sp-count-before-load{
font-size: 20px;
color: rgb(51, 51, 51);
font-weight: 600;
}

#sp-count-before-load span{
font-size:20px;
color: rgb(51, 51, 51);


}

#sp-count-after-load{
font-size:18px;
color: rgb(51, 51, 51);
font-weight: 600;
text-align:center;    
}

#sp-count-after-load span{
font-size: 20px;
color: rgb(51, 51, 51);
}

#sp-ani-number-active{
border: 3px dotted #15477b;
padding:5px 35px;
border-radius: 60px;
font-size:1.1rem;
font-weight:600; 
color: #15477b;
background: #d4e4fa;    
}

.dollar-icon{
width: 100%;
margin-top: 0px;
margin-left: 0px;
}

.ip-eligible-text{
font-size: 22px;
color: #15477b;
font-weight: bold;
margin-bottom: 20px;
text-align: center;
}

.ip-new-cashback{
color: rgb(0, 0, 0);
font-size: 36px;
font-weight: 700;
margin-bottom: 16px;
}

.ip-new-cashback span{
color:#f45d6b;
}

.ip-new-cashback a{
text-decoration: underline;
}

.ip-subject-text{
color:  #15477b;
font-size: 16px;
margin-bottom: 20px;
}

.ip-subject-text sup{
font-size: 16px;
top: -4.5px;
}

.ip-subject-text a{
color: #6d6fd5;
text-decoration: underline;
}

.register-box{
margin-top: 20px;
margin-bottom: 20px;
}

.register-box p{
font-size: 20px;
color: rgb(51, 51, 51);
font-weight: 600;
}

.register-box p span{
font-size: 22px;
color: rgb(51, 51, 51);
}

.custom-logo-img{width:130px}

@keyframes rotate-loading {
  0% {
    transform: rotate(0);
    -ms-transform: rotate(0);
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    -moz-transform: rotate(0)
  }
  to {
    transform: rotate(1turn);
    -ms-transform: rotate(1turn);
    -webkit-transform: rotate(1turn);
    -o-transform: rotate(1turn);
    -moz-transform: rotate(1turn)
  }
}
@-webkit-keyframes rotate-loading {
  0% {
    transform: rotate(0);
    -ms-transform: rotate(0);
    -webkit-transform: rotate(0);
    -o-transform: rotate(0);
    -moz-transform: rotate(0)
  }
  to {
    transform: rotate(1turn);
    -ms-transform: rotate(1turn);
    -webkit-transform: rotate(1turn);
    -o-transform: rotate(1turn);
    -moz-transform: rotate(1turn)
  }
}


@media  (max-width:767px){
    .landing-banner{height:auto}    
.offer-panel{width:90%;margin-top:0rem; margin-bottom:0rem; padding:20px;transform:none}    
.offer-form{margin-top:0rem;}    
}


@media(min-width:768px) and (max-width:991px){
.offer-panel{width:80%;margin-top:4rem; margin-bottom:1rem;}
.offer-form{margin-top:2rem;}        
}