/* @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700,800&display=swap'); */
/* @import 'fonts/openSans/OpenSans.scss'; */
*{box-sizing: border-box;}
.referral-new{font-family: 'Open Sans', sans-serif;}
.text-right{text-align: right;}
.pull-left {float: left;}
.pull-right {float: right;}
.clr-f {color: #ffffff;}
.bg-f {background: #ffffff;}
.bg-brown {background: linear-gradient(180deg, #E5963D 0%, #B05C23 100%);}
.bg-gray{background: linear-gradient(180deg, #F7F5EF 0%, #CBCBCB 100%);}
.clr_light_blue{color: #6D7278;}
._uCase{text-transform: uppercase;}
.referral-new .main-title{color:#1B1DC7; font-size: 20px; font-weight: 600;	line-height: 28px; margin-bottom:15px;}
.referral-new .tac{text-align:center;}
.referral-new .welcome{ margin:20px auto 0 auto;max-width: 620px;}
.referral-new .welcome .welcome-note{color: #69829F;font-size: 16px;font-weight: 600;line-height: 24px;}
.referral-new .referral-tabs {display: inline-block;border: 1px solid #D4DAE1;border-radius: 16px;margin: 32px 0;padding: 0;}
.referral-new .referral-tabs li {display: inline-block;position: relative;}
.referral-new .referral-tabs li:last-child:before{content:"COMING SOON";position:absolute;width:80px;height:18px;color:#fff;font-size:8px;font-weight:600;letter-spacing:.4px;line-height:18px;border-radius:4px;background-color:#1fb8ae;left:50%;transform:translate(-50px,-10px);}
.referral-new .referral-tabs li a {display: inline-block;color: #1B1DC7;padding: 9px 25px;font-weight: 600;border-radius: 14px;text-decoration: none;font-size: 14px;}
.referral-new .referral-tabs li a.active {background-color: #1B1DC7;color: #fff;}
.referral-new .rewards-section-head{position: relative; overflow: hidden;}
.background span{opacity:.5;}
.referral-new .background {width: 100%;	height: 100vh;background: rgb(11,0,146);background: linear-gradient(90deg, rgba(11,0,146,1) 0%, rgba(23,79,229,1) 100%);position: absolute;border-radius: 10px 10px 0 0;}
.background span {width:10vmin;height:10vmin;border-radius: 20vmin;backface-visibility: hidden;position: absolute;animation-name: move;animation-duration: 6s;animation-timing-function: linear;	animation-iteration-count: infinite;}
.background span:nth-child(1) {color: #ffffff;top: 2%;left: 96%;animation-duration: 10.8s;	animation-delay: -4.7s;transform-origin: -5vw -2vh;box-shadow: 20vmin 0 1.04086vmin currentColor}
.background span:nth-child(2) {color: #ffffff;top: 71%;left: 60%;animation-duration: 16s;animation-delay: -11.3s;transform-origin: 2vw -17vh;box-shadow: 20vmin 0 1.07149vmin currentColor;}
.background span:nth-child(3) {color: #E45A84;top: 75%;left: 6%;animation-duration: 10.3s;animation-delay: -3.1s;transform-origin: 5vw 18vh;box-shadow: 20vmin 0 1.40872vmin currentColor;}
.background span:nth-child(4) {color: #FFACAC;top: 1%;left: 92%;animation-duration: 15.3s;animation-delay: -5.8s;transform-origin: 23vw -13vh;box-shadow: -20vmin 0 1.00662vmin currentColor;}
.background span:nth-child(5) {color: #FFACAC;top: 64%;left: 49%;animation-duration: 15.4s;animation-delay: -4.4s;transform-origin: -3vw 24vh;box-shadow: -20vmin 0 1.44267vmin currentColor;}
.background span:nth-child(6) {color: #ffffff;top: 17%;left: 37%;animation-duration: 15.9s;animation-delay: -0.1s;transform-origin: -4vw -6vh;box-shadow: 20vmin 0 1.86801vmin currentColor;}
.background span:nth-child(7) {color: #FFACAC;top: 81%;left: 78%;animation-duration: 12.4s;animation-delay: -15.3s;transform-origin: -12vw 1vh;box-shadow: 20vmin 0 1.31764vmin currentColor;}
.background span:nth-child(8) {color: #ffffff;top: 44%;left: 88%;animation-duration: 13.6s;animation-delay: -15.6s;transform-origin: -22vw 5vh;	box-shadow: -20vmin 0 1.91952vmin currentColor;}
.background span:nth-child(9) {color: #E45A84;top: 96%;left: 34%;animation-duration: 13.1s;animation-delay: -11.3s;transform-origin: 13vw 22vh;	box-shadow: -20vmin 0 1.17635vmin currentColor;}
.background span:nth-child(10) {color: #E45A84;top: 11%;left: 30%;animation-duration: 11.8s;animation-delay: -6.5s;transform-origin: -16vw 4vh;	box-shadow: -20vmin 0 1.41033vmin currentColor;}
.background span:nth-child(11) {color: #ffffff;top: 3%;left: 13%;animation-duration: 14.6s;animation-delay: -4.9s;transform-origin: 9vw -18vh;	box-shadow: -20vmin 0 1.91442vmin currentColor;}
.background span:nth-child(12) {color: #ffffff;top: 56%;left: 42%;animation-duration: 13.5s;animation-delay: -2.6s;transform-origin: 23vw 11vh;box-shadow: 20vmin 0 1.37005vmin currentColor;}
.background span:nth-child(13) {color: #ffffff;top: 22%;left: 32%;animation-duration: 11.7s;animation-delay: -12.4s;transform-origin: -22vw 24vh;	box-shadow: 20vmin 0 1.09819vmin currentColor;}
.background span:nth-child(14) {color: #E45A84;top: 96%;left: 60%;animation-duration: 15.1s;animation-delay: -4.7s;transform-origin: 20vw -2vh;	box-shadow: 20vmin 0 1.92385vmin currentColor;}
.background span:nth-child(15) {color: #ffffff;top: 62%;left: 76%;animation-duration: 15.8s;animation-delay: -6.6s;transform-origin: 18vw -24vh;box-shadow: 20vmin 0 1.36201vmin currentColor;}
.background span:nth-child(16) {color: #ffffff;top: 58%;left: 37%;animation-duration: 14.4s;animation-delay: -12.2s;transform-origin: 6vw 25vh;	box-shadow: 20vmin 0 1.94633vmin currentColor;}
.background span:nth-child(17) {color: #FFACAC;top: 49%;left: 11%;animation-duration: 14.8s;animation-delay: -2.3s;transform-origin: 21vw -23vh;box-shadow: 20vmin 0 1.87756vmin currentColor;}
.background span:nth-child(18) {color: #FFACAC;top: 30%;left: 90%;animation-duration: 10.1s;animation-delay: -11s;transform-origin: 15vw 3vh;box-shadow: -20vmin 0 1.31894vmin currentColor;}
.background span:nth-child(19) {color: #ffffff;top: 85%;left: 94%;animation-duration: 10.7s;animation-delay: -15s;transform-origin: -18vw -14vh;box-shadow: -20vmin 0 1.54613vmin currentColor;}
.background span:nth-child(20) {color: #ffffff;top: 89%;left: 94%;animation-duration: 16s;animation-delay: -13.8s;transform-origin: -7vw 16vh;box-shadow: 20vmin 0 1.90792vmin currentColor;}
.referral-new .rewards-section-content .img-items-box .item-box img, .referral-new .how-it-work .rank-box img{width:75px;position: absolute;  left: 50%;  top: 50%;  transform: translate(-50%,-50%);}
.referral-new .how-it-work .rank-box > div > div{margin-bottom:20px;}
.hide-mobile{display:block;}
.p-F { position: fixed; }
.hand { cursor: pointer; }
.btn-bdr { border: 1px solid #35abfa; color: #35abfa; }
.br_4 { border-radius: 4px; }
.fw-6 { font-weight: 600; }
@keyframes move {100% {	transform: translate3d(0, 0, 1px) rotate(360deg);}}
.referral-new .rewards-section {background-color: #FFF;border: 1px solid #D4DAE1;border-radius:10px;overflow:hidden; margin-bottom:45px;}
.referral-new .rewards-section .win { border-radius: 4px; background-color: #E00067; color: #FFFFFF; font-size: 12px; font-weight: bold; line-height: 18px; padding: 4px 12px; margin: 0 auto; text-decoration: none; display: block; width: intrinsic; width: -moz-max-content; width: -webkit-max-content; }
.referral-new .rewards-section-head .reffer-box{position: relative; margin: 20px auto; width: fit-content;}
.referral-new .rewards-section-head h3{color: #FFFFFF;font-size: 24px;	font-weight: bold;	line-height: 36px;	text-align: center;	text-shadow: 0 1px 3px 0 rgba(95,38,156,0.5); max-width:620px; margin:10px auto 0 auto;}
.referral-new .rewards-section-content{padding:24px;position: relative;}
.referral-new .rewards-section-content p{color: #052F5F;font-size: 14px;font-weight: 600;line-height: 24px;}
.referral-new .rewards-section-content .img-items-box{margin-bottom:20px;}
.referral-new .rewards-section-content .img-items-box .item-box{border-radius: 10px; background-color: #FFFFFF; text-align: left;}
.referral-new .rewards-section-content .img-items-box span{width: 140px;display: block;text-align: center;color: #052F5F;font-size: 12px;font-weight: 600;line-height: 16px;}
.referral-new .rewards-section-content .reffer-via-box{margin-top:50px;}
.referral-new .rewards-section-content .reffer-via-box h3{color: #D90368;font-size: 16px;font-weight: bold;	line-height: 20px; margin-bottom:15px;}
.referral-new .rewards-section-content .reffer-via-box .whtsapp{border-radius: 4px;	background-color: #46C255;	box-shadow: 0 10px 20px 0 rgba(41,158,41,0.34);padding:10px 20px; margin-right:15px;color: #FFFFFF;font-size: 14px;	font-weight: 600;line-height: 19px;	text-align: center; text-decoration: none; cursor: pointer;}
.referral-new .rewards-section-content .reffer-via-box .link{border-radius: 4px;background-color: #4569D8;	box-shadow: 0 10px 20px 0 rgba(69,105,216,0.34);padding:10px 20px;color: #FFFFFF;font-size: 14px;font-weight: 600;line-height: 19px;	text-align: center; cursor: pointer; text-decoration: none;}
.referral-new .rewards-section-content .reffer-via-box .whtsapp img, .referral-new .rewards-section-content .reffer-via-box .link img{vertical-align: bottom;}
.tar{text-align:right;}
.referral-new .rewards-section-footer {background-color: #F2F3F6;color: #052F5F;font-size: 10px;font-weight: bold;line-height: 18px;padding: 5px 0;width: 100%;  border-radius: 0 0 10px 10px;}
.referral-new .heading-common{width:100%; display:block; margin-bottom:20px;}
.referral-new .heading-common span{height: 2px;	width: 40px;background-color: #1B1DC7; margin-bottom: 15px; display: block;}
.referral-new .heading-common h2{color: #1B1DC7;font-size: 18px;font-weight: bold;line-height: 22px; background: url(../images/flow.svg) top left no-repeat;padding-left: 40px;}
.referral-new .faq-box .heading-common h2{background: url(../images/question_mark.svg) top left no-repeat;}
.referral-new .heading-common h2 p{margin:0;padding:0;color: #69829F;font-size: 10px;font-weight: 600;	line-height: 18px;}
.referral-new .how-it-work .banner{border-radius: 8px;background-color: rgba(233,237,255,1);text-align: center;margin-bottom:30px;}
.referral-new .how-it-work ul{    margin-left: 0;padding-left: 0; margin-bottom:10px; display: block; float:left;}
.referral-new .how-it-work ul li{ margin-bottom:15px; display: block; float:left;color:#052F5F;font-size: 14px;font-weight: 600;	line-height:26px;width:100%;} 
.referral-new .how-it-work ul li span{ background: url(../images/points-bg.svg) top left no-repeat;width: 27px; height: 27px;float: left; text-align: center; color:#ffffff; font-weight: bold;margin-right: 15px;}
.referral-new .how-it-work ul li {font-weight:normal; color:#69829F;}
.referral-new .how-it-work .table{margin-left: 42px;margin-bottom:30px; display: table; border: 1px solid #D4DAE1;border-radius: 10px;	background-color: #FFFFFF;padding:0px 15px;}
.referral-new .how-it-work .table .table-row{display:table-row; padding:5px 0;}
.referral-new .how-it-work .table .table-row .table-cell-title{display:table-cell; padding:10px 20px;opacity: 0.8;	color: #69829F;font-size: 10px;	font-weight: 600;line-height: 14px;	text-align: center;}
.referral-new .how-it-work .table .table-row-grey{display:table-row; padding:5px 0;background-color: #F1F3F6;}
.referral-new .how-it-work .table .table-row .table-cell, .referral-new .how-it-work .table .table-row-grey .table-cell{display:table-cell;text-align:center; padding:5px 10px;color: #052F5F;font-size: 12px;font-weight: 600;line-height: 18px;}
.referral-new .how-it-work ul li a{text-decoration:none;color: #2C3BD9;font-size: 14px;font-weight: 600;line-height:20px;}
.referral-new .how-it-work .rank-box{margin-left: 42px;border: 1px solid #D4DAE1;	border-radius: 10px;background-color: #FFFFFF;padding:24px; margin-bottom:40px;}
.referral-new .how-it-work .rank-box .img-box {position: relative; border: 1px solid #D4DAE1; padding: 5px; border-radius: 8px; background-color: #FFFFFF; text-align: center; margin-bottom: 5px; width: 90px; height: 100px; }
.referral-new .how-it-work .rank-box span{opacity: 0.8;	color: #69829F;font-size: 12px;	line-height: 18px; display:block;}
.referral-new .how-it-work .rank-box {color: #052F5F;font-size: 12px;	font-weight: bold;line-height: 16px;}
.referral-new .faq-box input {position: absolute;opacity: 0; z-index: -1;}
.referral-new .faq-box .row {display: -webkit-box; display: flex;}
.referral-new .faq-box .row .col { -webkit-box-flex: 1;flex: 1;}
.referral-new .faq-box .row .col:last-child {margin-left: 1em;}
/* Accordion styles */
.referral-new .faq-box .tabs {overflow: hidden;}
.referral-new .faq-box .tab {width: 100%;color: white; overflow: hidden;}
.referral-new .faq-box .tab-label {display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between;
  cursor: pointer; color: #1B1DC7; font-size: 16px;	font-weight: bold;line-height: 22px; padding: 12px 0;  border-bottom: 1px solid #d4d3d3; margin-bottom: 10px;}
.referral-new .faq-box .tab-label::after {content: "\276F";width: 1em;height: 1em; text-align: center; -webkit-transition: all .35s;
  transition: all .35s;}
.referral-new .faq-box .tab-content {max-height: 0;padding: 0 1em; background: white;-webkit-transition: all .35s; transition: all .35s;
  opacity: 0.6;	color: #052F5F;font-size: 14px;	line-height: 24px;}
.referral-new .faq-box .tab-close {display: block; -webkit-box-pack: end; justify-content: flex-end; cursor: pointer; color: #2C3BD9;
    font-size: 14px;font-weight: 600; padding: 30px 0;line-height: 19px;text-align: center;}
.referral-new .faq-box input:checked + .tab-label::after {-webkit-transform: rotate(90deg); transform: rotate(90deg);}
.referral-new .faq-box input:checked ~ .tab-content {max-height: 100vh; padding: 1em;}
.referral-new .rewards-section-content .img-items-box .item-box {position:relative;background-color: #FFFFFF;text-align: center; padding: 5px;border:1px solid #f1f3f7;height: 100px; width: 140px;margin-bottom: 5px;}
.row {width: -webkit-fill-available;}
.referral-new .rewards-section-content p a{font-size:16px; text-decoration: none; color:rgba(23,79,229,1);}
.refer_points_container .refer {box-shadow: inset 4px 4px 20px 0 rgba(255,255,255,0.5), -20px -20px 80px 0 #FFFFFF, 20px 20px 80px 0 rgba(55,84,170,0.2);}
.refer_points_container .refer, .refer_points_container .points {box-shadow: inset 4px 4px 20px 0 rgba(255,255,255,0.5), -20px -20px 80px 0 #FFFFFF, 20px 20px 80px 0 rgba(55,84,170,0.2);border-radius: 8px;float: left;width: calc(50% - 15px);padding:16px;}
.refer_points_container .refer {margin-right: 30px;}
.refer_points_container .refer .img_parent, .refer_points_container .points .img_parent {width: 66px;background-color: rgba(27, 29, 199, 0.1);padding: 10px 14px;border-radius: 8px;float: left;margin-right: 16px;}
.refer_points_container {margin-bottom: 24px;}
.refer_points_container .refer .content_parent, .refer_points_container .points .content_parent {float: left;width: calc(100% - 82px);}
.refer_points_container .refer .content_parent span, .refer_points_container .points .content_parent span{display: block;}
.refer_points_container .refer .content_parent span:first-child, .refer_points_container .points .content_parent span:first-child{color: #69829F;	font-size: 10px;font-weight: bold;line-height: 16px;margin-bottom: 16px}
.refer_points_container .refer .content_parent  span:last-child, .refer_points_container .points .content_parent span:last-child{color: #1B1DC7;font-size: 36px;font-weight: 600; line-height: 28px;}   
.referral-new .how-it-work .rank-box > div > a{color: #1B1DC7;font-size: 10px;font-weight: 600;line-height:14px;text-decoration: none;}
.referral-new .leaderboard_container .heading-common h2{background: url(../images/crown_v1.svg) top left no-repeat;}
.fullCon{width: 100%;}
.leaderboard_container .refferral_info {border: 1px solid #D4DAE1;padding: 10px 0; border-radius: 8px; margin-bottom: 24px;}
.leaderboard_container .refferral_info .logo_parent { width: 40px; height: 40px; background-color: rgba(25,150,255,0.23);padding: 10px;border-radius: 6px;margin-right: 16px;position: relative;}
.leaderboard_container .refferral_info .logo_parent .prize_number { position: absolute; width: 24px; height: 24px; top: -10px; right: -10px; font-size: 10px; font-weight: bold; line-height: 20px; text-align: center; border-radius: 50px; border: 2px solid #fff; }
.leaderboard_container .refferral_info .detail .name {color: #052F5F;font-size: 16px; font-weight: 600;line-height: 40px;}
.achieved .referral_number, .achieved .achieved_parent {line-height: 40px;}
.achieved .referral_number strong { color: #052F5F;font-size: 16px;font-weight: 600;}
.achieved .referral_number span, .achieved .achieved_parent .achieved { color: #879BB2;font-size: 14px;font-weight: 600;line-height: 19px;}
.leaderboard_container .refferral_info:last-child .detail .name {color: #1996FF;}
.achieved .referral_number:after { content: "."; color: #879BB2; font-size: 14px; font-weight: 600; line-height: 34px; position: absolute; right: 20px; }
.achieved .referral_number { position: relative; }
header.v4 {padding: 12px 20px 30px; border-bottom: 1px solid rgba(5, 47, 95, 0.1); line-height: 10px; z-index: 100; }
header.v4 .logo_pb img { width: 150px; height: 24px; }
header.v4 button.login { font-size: 14px; line-height: 19px; font-family: 'Open Sans', sans-serif; }
header.v4 + div { padding-top: 84px; background: none;}
header.v4 button.menu { border: none; background: #ffffff;outline: none;width: 70px; }
button.menu img.arrowdown { width: 10px; top: -4px; position: relative; left: 10px;}
header.v4 button + ul.menu_options { padding:0;position: absolute; right: 20px; top: 54px; border: 1px solid rgba(28, 77, 117, 0.2); box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.1); background-color: #ffffff; list-style-type: none; min-width: 120px; border-radius: 4px; display: none; }
header.v4 button.menu.active .arrowdown{transform: rotate(275deg);}
header.v4 button.menu.active + ul.menu_options { display: block; }
header.v4 button + ul.menu_options li { cursor: pointer; white-space: nowrap; color: rgba(13, 54, 88, 0.8); font-size: 12px; font-weight: 600; padding: 12px 16px; border-bottom: 1px solid rgba(28, 77, 117, 0.2); }
header.v4 button.menu span { background: #ffffff; margin-top: 2px; font-size: 12px; font-weight: 600; text-indent: 0.01px; vertical-align: middle; -moz-border-radius: 3px; -moz-box-sizing: border-box; color: #052F5F; display: block; }
.referral-new .how-it-work .table > div:nth-child(odd) {  background-color: #fff;}
@media (max-width: 767px) {
.hide-mobile{display:none;}
body{background:#f1f3f7;}	
.referral-new .main-title {font-size: 18px;}
.referral-new .welcome .welcome-note, .referral-new .faq-box .tab-content {font-size: 12px; line-height: 18px;}
.referral-new .rewards-section-head h3 {font-size: 18px; line-height: 26px; padding: 0 12px;}
.referral-new .rewards-section-content p {font-size: 12px;line-height: 18px;text-align: center;}
.referral-new .rewards-section-content .reffer-via-box {margin-top: 25px; margin-bottom: 16px;}
.referral-new .rewards-section-content .reffer-via-box .whtsapp{padding: 10px 10px;margin-right: 0px;display: inline-block;}
.referral-new .rewards-section-content .reffer-via-box .sticky{position: fixed;bottom: 0;z-index: 1;left: 0;width: 100%;}
.referral-new .rewards-section-content .reffer-via-box .link{padding: 10px 10px;display: inline-block;}
.referral-new .rewards-section-content .reffer-via-box h3 {font-size: 12px;text-align: center;}
.referral-new .rewards-section-content {padding: 10px;}
.referral-new .refer-via{margin-bottom: 16px;text-align: center;}
.referral-new .rewards-section-footer div:first-child{float:left;}
.referral-new .heading-common h2 {font-size: 16px;}
.referral-new .how-it-work .banner img{width:100%;}
.referral-new .how-it-work ul li { font-size: 12px;line-height:18px;}
.referral-new .how-it-work ul li span{line-height: 26px; margin-bottom: 12px;}
.referral-new .how-it-work ul li:last-child span{ margin-bottom:30px;}
.referral-new .faq-box .tab-label{font-size:14px;}
.referral-new .faq-box .tab {width: 95%;}
.referral-new .faq-box .tab-close { padding: 15px 0;}
.referral-new .referral-tabs li a{font-size: 12px;line-height: 19px;}
.referral-new .rewards-section-content .img-items-box .item-box {width: 100%;}   
.referral-new .rewards-section-content .img-items-box span {text-align: center;display: block;width: 100%;}    
.referral-new .how-it-work .rank-box{padding: 10px;}   
.referral-new .how-it-work .rank-box > div > div { margin-bottom: inherit;padding: 0;}
.refer_points_container .refer, .refer_points_container .points{    width: calc(50% - 12px);}
.refer_points_container .refer {margin-right: 24px;}    
.refer_points_container .refer .img_parent, .refer_points_container .points .img_parent { width: 48px; padding: 8px 10px; border-radius: 8px; margin-right: 16px; float: none; margin-bottom: 24px; }
.refer_points_container .refer .content_parent, .refer_points_container .points .content_parent { float: left; width: 100%; }
.achieved .referral_number, .achieved .achieved_parent { line-height: 14px; }
.achieved .referral_number:after {line-height: 14px;right: -7px; }    
.achieved .referral_number { margin-right: 10px; }  
.achieved .referral_number strong { font-size: 10px; }
.achieved .referral_number span, .achieved .achieved_parent .achieved {font-size: 10px;}   
.leaderboard_container .refferral_info .detail .name { font-size: 12px; line-height: 17px; }   
.leaderboard_container .refferral_info { margin-bottom: 8px; }    
.leaderboard_container .refferral_info:last-child:before { content: "..."; position: absolute; left: 50%; top: -24px; color: #69829F; font-size: 10px; font-weight: 600; line-height: 14px; }  
.leaderboard_container .refferral_info:last-child { margin-top: 24px; position: relative; }    
header.v4 + div {padding: 58px 8px 0;} 
.referral-new .rewards-section-content .img-items-box .item-box img, .referral-new .how-it-work .rank-box img{width:100%;} 
.referral-new .how-it-work .table{margin-left: 42px;}
.referral-new .how-it-work .rank-box .img-box{width: 70px; height: 74px;}
.referral-new .how-it-work .rank-box > div > a{padding-right: 20px;}
}