html,body{
    overflow-x: hidden;
}
html {
            scroll-behavior: smooth;
        }
body,*{
    font-family: "Poppins", serif;
    font-size: 16px;
    color: #230871;
    
}
ul{
    padding: 0;margin: 0;
}
img{max-width: 100%;}
a{text-decoration: none;    color: #230871;}
#divSignupForm a, .remove-bg  a{ color: #0660a9 ; cursor: pointer;} 
#divSignupForm a:hover, .remove-bg  a:hover{ color: #673ab7 ; cursor: pointer;} 
#Terms1 .remove-bg  a { color: #fff !important;}
.container{
    max-width: 1520px;
}
.m-h-300{ min-height: 300px !important;}
.p-b-r{
	    background-position-x: right !important;
}
header {
    padding: 30px 0px;    position: absolute;
    left: 0;
    width: 100%;
    z-index: 99;
}

.logo_wrap {
    display: flex;
    gap: 40px;
}
.main_menu ul {
    list-style: none;
    display: flex;
    gap: 60px;
    padding-top:12px;
    float: left;
}
.main_menu ul li.menu_item a {
    color: #230871;
}

.header_buttons {
    display: flex;
    gap: 40px;
    justify-content: flex-end;
}

span.mobile_menu_ham {
    display: none;
}

.common_btn {
    display: inline-block;
    background: #F2EFF6;
    min-width: 177px;
    text-align: center;
    padding: 20px;
    border-radius: 50px;position: relative;z-index: 9;
}
.header_row {
    align-items: center;
}
.common_btn i {
    display: inline-block;
    vertical-align: middle;
    padding-left: 10px;    
}
.remove-bg a, .login-box a {
    color: #0660a9;
    cursor: pointer;
}
.blue-title{
    color: #663eed;
    font-size: 22px;
    padding: 0px 20px;
}

.common_btn svg {
    margin-left: 10px;
}

.dark_btn {
    background-image: linear-gradient(to right, #7e1bff, #5b4dff, #3e66fd, #3679f3, #4787e4);
    color: #fff;
    border:1px;
}

.dark_btn i {
    color: #fff;
}

#banner_section{
    background: url(../images/banner_bg.svg);
    padding-top: 200px;min-height: 900px;    background-size: 100%;    position: relative;
}
.banner_inner_height{
	min-height: 800px !important;
	height:800px !important;
}
.banner_inner_height2{
	min-height: 600px !important;
	height:600px !important;
}
.banner_inner_height_login{
	min-height: 900px !important;
	background-size:150% !important;
}
.banner_tle {
    font-size: 109px;
	line-height: 1;
}

.banner_tle .name {
    font-size: 109px !important;
    font-style: italic;
    background: #1DE4B3;
background:linear-gradient(to right, #1DE4B3 0%, #489AE6 40%, #7E1BFF 60%, #4787E4 100%);
-webkit-text-fill-color: transparent;
padding-right: 5px;
}
.mt--20{
	margin-top:-20px;
}

.banner_tle {
    position: relative;
    display: inline-block;
}

.banner_tle .name {
    font-size: 109px !important;
    font-style: italic;
    color: black; 
    position: relative;
	z-index: 0;
}

.banner_tle .name::after {
    content: attr(data-text) !important; 
    position: absolute;
    top: 0;
    left: 0;
    font-size: inherit;
    font-style: inherit;
    font-weight: inherit;
    background: linear-gradient(to right, #1DE4B3 0%, #489AE6 40%, #7E1BFF 58%, #4787E4 100%);
    -webkit-text-fill-color: transparent;
    z-index: 1;
}
.banner_content_p {
    font-size: 24px;
    margin: 40px 0px;
}
.banner_btn .common_btn {
    font-size: 18px;
}
section {
    padding: 40px 0px;
}
.section-90{padding: 90px 0px;}
.sec_tle {
    font-size: 80px;
    font-weight: 300;    line-height: 110px;
	margin-bottom:10px;
}
.sec_tle.sec_inlin_tle span {
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
}
.why_xtrm_box_main {
    padding: 40px 0px;
}

.why_xtrm_box_item {
    background: #F6F9FC;
    border-radius: 35px;
    padding: 35px;
    min-height: 400px;
    margin-bottom: 25px;    background-size: auto;
    background-repeat: no-repeat;
    background-position: bottom;
}

.why_xtrm_box_item h3 {
    font-size: 30px;
    font-weight: 400;
    line-height: 40px;
    margin-bottom: 15px;
    max-width: 300px;
}

.why_xtrm_box_item 
 p {
    font-size: 18px;
    max-width: 380px;
}
.bg_section{
    background: #F6F9FC;
}
.sec_sub_tle {
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    font-size: 20px;
    font-weight: 400;margin: 0;
}
.sub_tle_wrap {
    display: inline-block;
    padding: 15px 35px;
    background: #fff;
    border-radius: 120px;
    border: 1px solid #E0E3EE;
    position: relative;
    z-index: 9;    margin-bottom: 30px;
}

.sub_tle_wrap_bg {
    
    background-image: linear-gradient(to right, #7e1bff, #5b4dff, #3e66fd, #3679f3, #4787e4);
    width: 240px;
    height: 61px;
    border-radius: 50px;    margin-bottom: -40px;
    opacity: 0.2;    animation: float 6s ease-in-out infinite;
}
.sec_tle * {
    font-size: 80px;
}
.sec_tle b {
    font-weight: 600;
}

.section_title_wrap p {
    font-size: 24px;
    margin: 30px 0px;
}
.section_title_wrap .common_btn {
    font-size: 18px;
    min-width: 300px;
}

.sec_see_also {
    margin-top: 40px;
    margin-bottom: 40px;
}

.see_tle {
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
    -webkit-text-fill-color: transparent;
      -webkit-background-clip: text;
    background-clip: text;

}

.see_also ul {
    list-style: none;
    display: flex;
    gap: 30px;
    margin-top: 20px;
}

.see_also ul span {
    display: inline-block;
    width: 12px;
    height: 12px;
    margin-right: 10px;
    background-image: linear-gradient(to right bottom, #3996e3, #88acea, #b9c5f1, #e0e1f7, #ffffff);
    border-radius: 50%;
   
    vertical-align: middle;
}
#paysection4 .sec_tle {
    max-width: 720px;
}
.brand_left h3,.brand_left h3 * {
    font-size: 25px;
    line-height: 40px;
}

.brand_left h3 {
    max-width: 87%;
}
#chandler .section_title_wrap {
    padding: 78px;
    background: #fff;
    border-radius: 110px;    padding-bottom: 250px;
}

#chandler .section_title_wrap .sec_tle {
    max-width: 1010px;
    margin: 0 auto;
}

#chandler .section_title_wrap  p {
    font-size: 16px;
    max-width: 450px;
    margin: 30px auto 0px;
}

#chandler .section_title_wrap  .sub_tle_wrap {border: 0;padding: 0;}

#chandler .section_title_wrap  .sub_tle_wrap_bg {
    max-width: 74px;
    height: 74px;
    margin: 0 auto -20px;
}
.bg_dev_sec {
    background: #230871;
    position: relative;
}

.bg_dev_sec:before,.bg_dev_sec:after {
    content: '';
    top: -60px;
    left: 0;
    width: 100%;
    height: 100px;
    background: #fff;
    transform: skew(0deg, 178deg);
}
.bg_dev_sec:after{
    top:auto;bottom: -60px;
}
.bg_dev_sec_wrap {
    padding: 50px 0px;
}
.bg_dev_sec .section_title_wrap * {
    color: #fff;
}
.grad_btn {
    background-image: linear-gradient(to right top, #1de4b3, #00d6d3, #00c5e9, #00b1f0, #489ae6);
}
#league .section_title_wrap {
    max-width: 600px;
}
.globe_slide_item {
    height: 1230px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    position: relative;
}

.globe_slide_item h3 {
    font-size: 203px;
    font-weight: 200;
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
    -webkit-text-fill-color: transparent;
    /*-webkit-background-clip: text;*/
}

.globe_slide_item h4, .earth_slide_item h4 {
    font-size: 48px;
}

.globe_slide_item .globe_item_desc {
    font-size: 18px;
    text-align: left;
    max-width: 400px;
    position: absolute;
    bottom: 0;
    right: 0;
}
.blog_item_wrap {
    background: #fff;
    border-radius: 32px;
    overflow: hidden;
}

.blog_item_img {
    height: 167px;
    border-bottom-left-radius: 32px;
    border-bottom-right-radius: 32px;    overflow: hidden;
}

.blog_item_content {
    padding: 40px;
}

.blog_item_content h3 {
    font-size: 30px;
    font-weight: 400;
    line-height: 40px;
}
.blog_meta ul {
    list-style: none;
    display: flex;
    justify-content: space-between;
    margin: 20px 0px 0px;
}

.blog_meta ul li {display: flex;gap: 10px;font-size: 18px;    align-items: center;}
#lanyard .sec_tle b, #global .sec_tle b {
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
    -webkit-text-fill-color: transparent;
    font-weight: 500;
}
#lanyard .sec_tle b, #global .sec_tle b {
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
 -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 500;
}

footer {
    padding: 80px 0px 20px;
}
.social_media ul {
    list-style: none;
    display: flex;
    gap: 15px;
}

.social_media ul i {
    font-size: 18px;
    color: #fff;
}

.social_media ul a {
    width: 40px;
    height: 40px;
    display: inline-block;
    background: #230871;
    border-radius: 50%;
    text-align: center;
    line-height: 43px;
}

.footer_menu_col h3 {
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 600;
    margin-bottom: 20px;
}

.footer_menu_col ul {
    list-style: none;
}

.footer_menu_col ul li {
    margin-bottom: 10px;
}

.col-lg-3.footer_left {
    width: 20%;
}

.col-lg-9.footer_right {
    width: 80%;
}

.copyrights {
    margin-top: 60px;
    padding-top: 25px;
    border-top: 1px solid rgb(35 8 113 / 20%);
}
.copyrights p {
    font-size: 13.5px;
    margin-bottom: 0;
}

.copyrights_right p {
    text-align: right;
}
.why_xtrm_box_2{background-position: bottom right;}
.paysection .row {
    align-items: center;
}
/*
.paysection .section_right img {
   min-width: calc(100% + 300px);
    margin-left: -200px;    padding-top: 200px; 
}*/
.brand_logo_slide {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chandler_img {
    margin-top: -350px;
}
.globe_item_content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.blog_item_img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.blog_item {
    margin-bottom: 25px;
}
.blog_item_large:after {
    content: '';
    position: absolute;
    top: 0;
    left: 13px;
    width: calc(100% - 25px);
    height: 100%;
    border-radius: 32px;
    background: #fff;

}

.blog_item_large {
    position: relative;
}
.blog_item_large .blog_item_wrap {
    background: transparent;
    z-index: 9;
    position: relative;
}
span.meta_icon {
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
    -webkit-text-fill-color: transparent;
    display: flex;
    gap: 10px;
    align-items: center;
     -webkit-background-clip: text;
    background-clip: text;
}

span.meta_thum_logo {
    display: inline-block;
    width: 36px;
    height: 36px;
    background: #7E1BFF;
    background: linear-gradient(to right, #7E1BFF 0%, #4787E4 100%);
    border-radius: 50%;
    text-align: center;
    line-height: 34px;
}

.blog_item_large .blog_item_content {
    display: flex;
}

.blog_item_large .blog_item_content h3 {
    max-width: 540px;
    color: #fff;
}

.blog_item_large .blog_item_content .blog_meta ul {
    display: flex;
    flex-direction: column;
    align-items: flex-start;    gap: 10px;
}

.blog_item_large .blog_item_content .blog_meta ul * {
    color: #fff !important;
}
.blog_item_large .blog_item_img {
    height: 231px;
}
.blog_item_large .blog_item_content .blog_meta ul .author span.meta_icon {
    -webkit-text-fill-color: #fff;
}
span.blog_cate {
    position: absolute;
    background: #fff;
    padding: 10px 25px;
    border-radius: 30px;
    top: 40px;
    left: 40px;
}
#lanyard{
    background: url('../images/lanyard_new_bg.png');    background-size: cover;position: relative;
}
#global{
    background: url('../images/explore-bg.svg');    background-size: cover;position: relative;
}
.footer_logo {
    margin-bottom: 20px;
}
.header_buttons_mobile,.header_mobile_logo{display: none;}
.banner_earth{
    background: url('../images/banner_earth.png');
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: 600px;
    background-repeat: no-repeat;
    background-position: right bottom;
}
.banner_image_layers {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.banner_earth_line {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 36%;
}

.banner_earth_line img {
    position: absolute;
    bottom: 0;
    left: 0;
}

.banner_earth_line img.banner_behind_line_2 {
    left: 30px;
}

.banner_earth_line img.banner_behind_line_3 {
    left: 60px;
}

.banner_icon_grp {
    position: absolute;
    right: 0;
    width: 39%;
    height: 100%;
    bottom: 0;
}

.banner_icon_grp img {
    position: absolute;
    bottom: 0;
    left: 0px;animation: float 6s ease-in-out infinite;
}

.banner_icon_grp img.banner_icon_grp_2 {
    bottom: 30%;
    left: 20%;
}

.banner_icon_grp img.banner_icon_grp_3 {
    bottom: 44%;
    left: 55%;
}
#banner_section .container {
    position: relative;
    z-index: 9;
}
@keyframes float {
	0% {		
		transform: translatey(0px);
	}
	50% {		
		transform: translatey(-20px);
	}
	100% {	
		transform: translatey(0px);
	}
}

.common_btn:after,.common_btn:before{
    content: '';
    content: '';
    width: 100%;
    height: 100%;
    border: inherit;
    top: 0;
    left: 0;
    z-index: 0;
    background-image: linear-gradient(to right, #7e1bff, #5b4dff, #3e66fd, #3679f3, #4787e4);
    border-radius: inherit;
    animation: pulsing 2.5s linear infinite;position: absolute;opacity: 0;visibility: hidden;z-index: -9;
  }
  .common_btn:after {
    animation: pulsing1 2.5s linear infinite;
  }
  .common_btn:hover::before,.common_btn:hover::after{
    opacity: 1; visibility: visible;
  }
  @keyframes pulsing {
    0% {
      opacity: 1;
      transform: scaleY(1) scaleX(1);
    }
    20% {
      opacity: 0.5;
    }
    70% {
      opacity: 0.2;
      transform: scaleY(1.8) scaleX(1.4);
    }
    80% {
      opacity: 0;
      transform: scaleY(1.8) scaleX(1.4);
    }
    90% {
      opacity: 0;
      transform: scaleY(1) scaleX(1);
    }
  }
  @keyframes pulsing1 {
    0% {
      opacity: 1;
      transform: scaleY(1) scaleX(1);
    }
    20% {
      opacity: 0.5;
    }
    70% {
      opacity: 0.2;
      transform: scaleY(1.3) scaleX(1.15);
    }
    80% {
      opacity: 0;
      transform: scaleY(1.3) scaleX(1.15);
    }
    90% {
      opacity: 0;
      transform: scaleY(1) scaleX(1);
    }
  }
  .section_right {
    position: relative;
	
}
.w-38{width:38%;}
.image_layers {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    text-align: center;
}

.image_layers img {
    position: absolute;
    top: 10px;
    left: 40%;   animation: float 3s ease-in-out infinite;
}

img.manage-payments-layer_1 {
    z-index: 9;animation: none;
}

img.manage-payments-layer_2 {
    top: 60px;
    left: 15%;
    z-index: 9;
}

img.manage-payments-layer_3 {
    top: 100%;
    left: 0;
    z-index: 9;animation-delay: 5s;
}

img.manage-payments-layer_4 {
    top: 20%;
    left: auto;
    right: -15%;
    z-index: 9;animation-delay: 5s;
}

img.manage-payments-layer_5 {
    top: 80%;
    left: 15%;
}

img.manage-payments-layer_6 {
    top: 47%;
    left: auto;
    right: 0;
}
img.invoice-payment_layer_2 {
    z-index: 9;
    top: 35%;
    left: 30%;
}

img.invoice-payment_layer_3 {
    z-index: 9;
    top: 62%;
    left: 25%;
}

img.invoice-payment_layer_4 {
    z-index: 9;
    top: 90%;
    left: 30%;
}

img.invoice-payment_layer_5 {
    top: 118%;
    z-index: 9;
    left: 35%;
}

img.invoice-payment_layer_6 {
    right: -8%;
    left: auto;
    top: 0;
    z-index: 9;
}

img.manage-payments-layer_7 {
    left: auto;
    right: -9%;
    top: 80%;
    z-index: 9;
}

img.manage-payments-layer_8 {
    left: auto;
    right: 40px;
    top: 40px;
}

img.manage-payments-layer_9 {
    left: auto;
    right: 40px;
    top: auto;
    bottom: -100px;
}
img.incentives-rebates_layer_2 {
    top: 43%;
    left: 5%;
    animation-delay: 5s;
    z-index: 9;
}

img.incentives-rebates_layer_3 {
    top: auto;
    bottom: -68%;
    left: 5%;
    animation-delay: 6s;
    z-index: 9;
}

img.incentives-rebates_layer_4 {
    left: 20%;
    top: 68%;
}

img.incentives-rebates_layer_1 {
    z-index: 9;
}

img.incentives-rebates_layer_5 {
    left: 20%;
    top: 80%;
}
img.contractorpayments_layer_1 {
    left: 0;
}

img.contractorpayments_layer_2 {
    left: 5%;
    top: 100px;
}

img.contractorpayments_layer_3 {
    top: -20px;
}

img.contractorpayments_layer_4 {
    left: auto;
    right: 11px;
    top: 25px;
}

img.contractorpayments_layer_5 {
    left: auto;
    right: -83px;
    animation-delay: 4s;
}
img.contractorpayments_layer_6 {
    left: auto;
    right: -83px;
    animation-delay: 5s;
    top: 40%;
}

img.contractorpayments_layer_7 {
    left: auto;
    right: -83px;
    animation-delay: 6s;
    top: 80%;
}
img.api-payments_layer_2 {
    left: 30%;
    top: auto;
    bottom: 50px;
    z-index: 9;
    animation-delay: 4s;
}

img.api-payments_layer_3 {
    left: 20px;
    top: 55%;
    z-index: 9;
    animation-delay: 5s;
}

img.api-payments_layer_4 {
    left: auto;
    top: 18%;
    right: -170px;
    animation-delay: 5s;z-index: 9;
}

img.api-payments_layer_5 {
    top: -10px;
    left: 110px;
}

img.api-payments_layer_1 {
    z-index: 9;
}
img.api-payments_layer_6 {
    left: auto;
    right: -80px;
    top: 50%;
}
.owl-carousel .owl-item img {
    width: auto;
}
.brand_slide_items {
    text-align: center;
    background: #fff;
}

.brand_slide_items img {
    display: inline-block !important;
    max-width: 150px;
}
section#brand_sec .row {
    align-items: center;
}
.sec_icon_tle {
    margin-top: -50px;
    margin-left: 50px;
}
#chandler .common_btn:after,#chandler  .common_btn:before{
    opacity: 1;visibility: visible;
}

#dev_sec .payment_img_grp {
    position: relative;
}

img.dev_layer_1 {
    top: -60px;
    left: 100px;
    animation-delay: 4s;
}

img.dev_layer_2 {
    left: auto;
    right: 20px;
    top: -40px;
    animation-delay: 5s;
}

img.dev_layer_4 {
    left: auto;
    right: 0;
}

img.dev_layer_3 {
    left: 0;
    animation-delay: 6s;
}
.earth_slide, .earth_slide .owl-stage-outer, .earth_slide .owl-stage, .earth_slide .owl-item, .earth_slide .earth_slide_item {
    height: 100%;
}

.earth_slide_item {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.earth_slide .owl-prev {
    position: absolute;
    top: 50%;
    left: 0;
    font-size: 0;width: 44px;height: 44px;background: url('../images/earth_arrow.png');    transform: rotate(180deg);
}

.earth_slide  .owl-next {
    position: absolute;
    top: 50%;
    right: 0;
    font-size: 0;width: 44px;height: 44px;background: url('../images/earth_arrow.png');
}
.banner_lines {
    position: absolute;
    bottom: 0;
    left: 0;
}
.banner_lines img{
    animation: float 3s ease-in-out infinite;
}
img.banner_line_layer_1 {
    position: absolute;
    bottom: 12px;
    left: 50px;animation: float 6s ease-in-out infinite;
}
#lanyard .banner_lines, #global .banner_lines{
    bottom: auto;
    top: 0;
}
.banner_earth_mobile_line{display: none;}
.paysec_mobile_image{display:none;}
.banner_layer_top_main {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.banner_layer_top {
    max-width: 2080px;
    position: relative;
    height: 100%;
    margin: 0 auto;
}
.menu_cls{display: none;}
.m-t30{
	margin-top:30px;
}
.security-container {
    display: flex;
    align-items: flex-start !important; /* Align image to the top */
}
#privacy ul{ padding-left:30px;}
#privacy table td { text-align: left;}
.text-left{text-align:left !important;}
.text-bold{ font-weight: bold;}
.mt-40{margin-top:40px;}
.height-control{height:auto !important; margin:0px !important; padding:32px 50px !important;}
.height-control-banner{height:auto !important; padding-top:80px !important; }
.m-0{margin:0px !important;}
.w-80{width:80% !important;}
.title-background{    background: #ECF4FA;
    border-radius: 50px 50px 0px 0px;
    padding: 40px;
   margin:20px 0px 0px 0px ;
   
}
.white-bg{  background: #fff;  padding: 40px; border-radius: 0px 0px 50px 50px;}
.g-m-0{margin:0px !important;}
.g-mt-0{ margin-top:0px !important;}
.g-pt-5{padding-top:5px;}
.g-pt-10{padding-top:10px;}
.g-pt-20{padding-top:20px;}
.g-pt-30{padding-top:30px;}
.g-pt-50{padding-top:50px;}
.g-pl-15{padding-left:15px;}
.g-mt-40{ margin-top:40px;}
.g-pl-31{ padding-left: 31px;}
.highlights ul li{ padding-bottom:10px;}
.testimonial {
	background: url(../images/testi-bg.png) top no-repeat;
    background-position: 17px 4px;
    color: #6e6e6e;
}
.testimonial p {
    font-size: 16px;
    border-bottom: 1px solid #ccc;
        padding-bottom: 30px;
}
.testi-footer {
    font-size: 14px;
}
.g-pa-30{
	padding:30px;
}
.g-pt-40{
	padding-top:40px;
}
.g-pl-40{
	padding-left:40px;
}
.g-pr-40{
	padding-right:40px;
}
.g-pa-10{
	padding:10px;
}
.testi-footer img {
    border-radius: 50px;
    width: 70px;
    height: 70px;
    border: 1px solid #ccc;
}
.shadow-box-normal-w {
    background: #fefefe;
    border-radius: 10px;
    -webkit-box-shadow: 0 0 30px #c1c1c1;
    box-shadow: 0 0 30px #c1c1c1;
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    display: inline-block;
    width: 100%;
}
.g-pt-7{
	padding-top:7px;
}
.table-content span {
    float: left;
    margin-right: 10px;
}
.table td, table th {
    padding: 2em;
    text-align: center;
    border-right: 1px solid #bfd3fa;
}
.row-color {
    background-color: #f7f9fc !important;
}
.text-left {
    text-align: left !important;
}
.table-data-head {
    background-image: linear-gradient(to right, #7e1bff, #5b4dff, #3e66fd, #3679f3, #4787e4);
    padding: 20px;
    margin: 0;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    color: #fff;
    border-right: 0;
    font-size: 12px !important;
}
.table-content p {
    margin-left: 25px;
}
.table th, table td {
    padding: 1em;
}
.login-box {
    background-color: #f8f8f8;
    border: 1px solid #efefef;
    padding: 20px;
    border-radius: 15px;
}
.form__input {
    font-size: 1rem;
    font-family: inherit;
    padding: 0.8rem;
    color: inherit;
    border-radius: 2px;
    background-color: #ededed;
    border: none;
    border-bottom: 3px solid transparent;
    width: 100%;
    display: inline block;
    border-radius: 50px;
    color: #000;
    margin-top: 10px;
    margin-bottom: 30px;
}
.profile-img-card {
    width: 96px;
    height: 96px;
    margin: 0 auto 10px;
    display: block;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}
.p-relative {
    position: relative;
}
.input-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}
#log-close {
    position: absolute;
    top: 23px;
    z-index: 1;
    right: 41px;
    color: #353535;
    font-size: 20px;
}
#login-view [class*=input-group-] {
    position: absolute !important;
    right: 0 !important;
    margin-top: 23px !important;
}
.m-a-0{
	margin:0 auto;
}


#login-view [class*=input-group-] {
    min-width: 35px;
    background-color: transparent;
    border-color: #ccc;
    transition: border-color .15s ease-in-out 0s;
}
.login-box a:hover{color:#fff;
cursor: pointer;
}
input[type=text]:focus{
  border:1px solid #0d6efd !important;
 
}
a #developer {
    background: url(../images/developer.svg) top no-repeat;
    height: 250px;
    color: #000;
    text-decoration: none !important;
    background-size: 130px;
    background-position-y: -9px;
}
.register-m-height {
    height: 301px;
}
a #developer h4 {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    padding-top: 157px;
}
a #manager {
    background: url(../images/manager-grey.svg) top no-repeat;
    height: 283px;
    color: #000;
    text-decoration: none !important;
}
a #company {
    background: url(../images/business-grey.svg) top no-repeat;
    height: 283px;
    color: #000;
    text-decoration: none !important;
}
a #personal {
    background: url(../images/personal.svg?v=1) top no-repeat;
    height: 250px;
    color: #000;
    text-decoration: none !important;
    background-size: 130px;
    background-position-y: -9px;
}
a #personal h4 {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    padding-top: 157px;
}
a #company h4 {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    padding-top: 157px;
}
a #manager h4 {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    padding-top: 152px;
}
.signup-bg1{
	  background: linear-gradient(to right, #FFF 0%, #fff 100%);
	      padding-top: 50px;
		  border-radius:10px;
		  margin-top:10px;
		  max-width:325px;
          border:1px solid #ddd;
}
.signup-bg1:hover{
	  background: linear-gradient(to right, #f7f9fc 0%, #e1e8f5 100%);
	     /* padding-top: 50px;*/
		  margin-top:10px;
          border:1px solid #574790;
}
.signup-bg2{
	  background: linear-gradient(to right, #FFF 0%, #fff 100%);
	      /*padding-top: 50px;*/
		  margin-top:10px;
		    border-radius:10px;
			 max-width:325px;
              border:1px solid #ddd;
}
.signup-bg2:hover{
	  background: linear-gradient(to right, #e1e8f5 0%, #f7f9fc 100%);
	     /* padding-top: 50px;*/
		   border-radius:10px;
		   margin-top:10px;
             border:1px solid #574790;
}
.min-height-auto{
	min-height:auto !important;
}
.signup
{
	display: flex;
    justify-content: space-between;
    align-items: flex-start;
   /* gap: 10px;*/
    position: relative;
	margin-top:30px;
	margin-bottom:30px;
}
/* OPTION A — keep your existing <select class="frm_input nice-select"> */
#register-form select.frm_input.nice-select {
  -webkit-appearance: none; /* hide iOS/Safari default */
  -moz-appearance: none;    /* hide Firefox default */
  appearance: none;         /* hide other browsers' default arrow */

  width: 100%;
  height: 65px;
  line-height: 65px;
  box-sizing: border-box;
  padding: 0 56px 0 18px;   /* right padding must reserve room for the arrow */
  border: 1px solid #230871;
  border-radius: 35px;
  background-color: transparent;

  /* SVG arrow placed inside the select; change calc(...) to control distance from right edge */
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8'><path fill='%23230871' d='M1 1l6 6 6-6'/></svg>");
  background-repeat: no-repeat;
  background-position: calc(100% - 20px) center; /* ← distance from the outer border */
  background-size: 12px 12px;
  
}

/* Hide IE/Edge default expand icon */
#register-form select.frm_input.nice-select::-ms-expand {
  display: none;
}

/* If some other CSS overrides your rules, use !important on these three properties */
#register-form select.frm_input.nice-select {
  padding-right: 56px !important;
  padding-left:27px;
  background-position: calc(100% - 20px) center !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 8'><path fill='%23230871' d='M1 1l6 6 6-6'/></svg>") !important;
}


#register-form .nice-select .list {
    height: 200px !important;
    overflow: auto !important;
    width: 100% !important;
}
.nice-select .option.focus, .nice-select .option.selected.focus, .nice-select .option:hover {
    background-color: #f6f6f6;
}
.nice-select .option {
    cursor: pointer;
    font-weight: 400;
    line-height: 40px;
    list-style: none;
    min-height: 40px;
    outline: 0;
    padding-left: 18px;
    padding-right: 29px;
    text-align: left;
    -webkit-transition: all .2s;
    transition: all .2s;
}
#show_hide_password_gen .input-group-addon-control {
    min-width: 29px;
    background-color: transparent;
    border-color: #ccc;
    transition: border-color .15s ease-in-out 0s;
    position: absolute;
       right: 32px;
    top: 44px;
}
i#log-close-gen {
    position: absolute;
    z-index: 1;
    right: 41px;
    color: #353535;
    font-size: 20px !important;
}
.form-horizontal {
    padding: 40px;
}
#personal-blue {
    background: url(../images/personal.svg?v=1) top no-repeat;
    color: #626ef1 !important;
    text-decoration: none !important;
    background-size: 135px;
}
#personal-blue h4 {
    padding-top: 150px;
}
#legend {
    padding-bottom: 40px;
}
.remove-bg{
	background:none !important;
    
}
#company-blue h4 {
    padding-top: 150px;
}
#company-blue {
    background: url(../images/business-grey.svg) top no-repeat;
    color: #626ef1 !important;
    text-decoration: none !important;
    padding-bottom: 20px;
}
.g-0{
	gap:0px !important;
}
#manager-blue {
    background: url(../images/manager-grey.svg) top no-repeat;
    color: #626ef1 !important;
    text-decoration: none !important;
    padding-bottom: 20px;
}
#manager-blue h4 {
    padding-top: 150px;
}
#developer-blue h4 {
    padding-top: 150px;
}
#developer-blue {
    background: url(../images/developer.svg) top no-repeat;
    color: #626ef1 !important;
    text-decoration: none !important;
    background-size: 130px;
}
.c-both {
    clear: both;
}
.g-brd-right-none, .g-brd-x-none {
    border-right: none !important;
}

.policy-box

 {
    height: 500px;
    overflow-x: hidden;
    overflow-y: scroll;
 }
 .card.card-container.login-box a:hover {
    color:#7e1bff;
}
.main-content {
    min-height: calc(91vh - 120px) !important; /* 100vh = full screen height, 120px = header+footer height */
   /* padding: 20px;*/
    box-sizing: border-box;
}

.controls.divCountry, .control-group, #register-form .control {
    min-height:95px;
}
.success-message {
  position: absolute;
  top: 160px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #e6f4ea;
  color: #137333;
  border: 1px solid #badbcc;
  border-radius: 8px;
  padding: 14px 40px;
  max-width: 90%;
  width: auto;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  word-wrap: break-word;
}
.error-message {
  position: absolute;
  top: 160px;
  left: 50%;
  transform: translateX(-50%);
  background-color: #fdecea;
  color: #d93025;
  border: 1px solid #f5c2c0;
  border-radius: 8px;
  padding: 14px 40px;
  max-width: 90%;
  width: auto;
  text-align: center;
  font-size: 14px;
  font-weight: 500;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  word-wrap: break-word;
   z-index: -1;
}

/* 🔹 Responsive tweaks */
@media (max-width: 768px) {
    #paysection4 .sec_tle {
    max-width: 370px;
}
    .our_miss_sec ul.nav-tabs{ gap:30px;}
       #about .our_miss_sec ul.nav-tabs button {
        font-size: 13px !important;
    }
    .sec_see_also {
    margin-left: 10px;
}
section#why_xtrm {
    padding: 30px 0px 0px 0px;
}
    .sec_tle b{ font-size: 28px;}
    .w-38{width:100%;}
  .error-message {
    top:90px;
    font-size: 13px;
    padding: 10px 20px;
    z-index: -1;
    width:90%;
  }
     .w-pt-130{
        padding-top: 0px !important;
     }
     .m-t-120{
margin-top:0px !important;
     }
}

@media (max-width: 480px) {
  .error-message {
    top:90px;
    font-size: 11px;
    padding: 8px 15px;
     z-index: -1;
      width:90%;
  }
}
#policy-table td {

    text-align: left;
}
.swiper {
  width: 100% !important;   /* fit inside column */
}

.swiper-wrapper {
  display: flex;
}

.swiper-slide {
  flex-shrink: 0;           /* prevents overlap */
}
.swiper-container {
    overflow: hidden;
}
#why_xtrm.innner_section .why_xtrm_box_main .why_xtrm_box_item
{
        text-align: left;
}
#why .section_title_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#why.custom-swiper-nav {
  display: flex;

  gap: 50px; /* adds 100px space between prev and next buttons */
  margin-top: 50px; /* optional spacing from slider */
}

#why .swiper_custom_nav {
  display: flex;
  gap:40px;
}

#why .custom-swiper-nav {
  display: flex;
  justify-content: flex-start; /* default → left alignment */
  align-items: center;
  gap: 100px;
  margin-top: 20px;
  flex-wrap: wrap;
}

#why .swiper-button-prev, #why .swiper-button-next {
  position: static !important;
  width: 52px;
  height: 52px;
  background: #fff;
  border-radius: 50%;
  cursor: pointer;
  color: #230871;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

#why .swiper-button-prev:hover,
#why .swiper-button-next:hover {
  background: #230871;
  color: #fff;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25);
  transform: scale(1.1);
}


.p-realive{ position: relative;}
/* Hide mobile nav by default */
#why .custom-swiper-nav.mobile-nav {
  display: none;
  justify-content: center;
  margin-top: 15px;
}

/* Desktop nav under text column */
#why .custom-swiper-nav.desktop-nav {
  display: flex;
  gap: 60px;
  margin-top: 80px;
}

/* Responsive swap */
@media (max-width: 767px) {
  #why .custom-swiper-nav.desktop-nav {
    display: none; /* hide desktop nav */
    
  }
  #why .custom-swiper-nav.mobile-nav {
    display: flex; /* show mobile nav */
     justify-content: center; /* center on tablet & mobile */
    
  }
}
 .cust-select {
            padding: 21px 30px;
            border: 1px solid #230871;
            border-radius: 35px;
        }
        .cust-input {
            width: 100%;
            display: block;
        }
        .cust-banner_tle {
            font-size: 60px;
        }
        .help-info {
            position: absolute;
            top: 42px;
            right: 12px;
        }
        .tab-btn-grp {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            margin-top: 1.5rem !important;
            margin-bottom: 1.5rem !important;
            flex-direction: row !important;
        }
        ul.eddform li {
            padding-bottom: 10px;
        }
        .form-switch .form-check-input {
            width: 4.5em; /* wider for text */
            height: 30px;
            position: relative;
            float: right;
        }

            .form-switch .form-check-input::after {
                content: "No";
                color: #593f3f;
                font-size: 0.85rem;
                position: absolute;
                top: 50%;
                left: 65%;
                transform: translate(-50%, -50%);
            }

            .form-switch .form-check-input:checked::after {
                content: "Yes";
                /*                left: 45%;*/
                left: 25px;
                top: 15px;
                font-size: 0.85em;
                color: #ffffff;
            }
            .form-switch .form-check-input:checked {
                background-color: #230871;
                border-color: #502db5;
            }
        .card-container {
            padding: 30px;
        }
                .btn-primary-color {
            background: linear-gradient(to right, #7e1bff, #5b4dff, #3e66fd, #3679f3, #4787e4);
            padding: 1rem;
            border-radius: 27px;
        }

        .btn-primary-grad {
            background: linear-gradient(-90deg,#6d51f8,#4571f8);
        }

        .btn-secondary-color {
            background: #6c757d;
            padding: 1rem;
            border-radius: 27px;
        }
        .progress {
            height: 8px;
        }

        .progress-bar {
            background: linear-gradient(-90deg,#6d51f8,#4571f8) !important;
        }

        @media screen and (max-width:768px) {
            .tab-btn-grp {
                flex-direction: column !important;
            }
        }
        .w-pt-130
        {
            padding-top:124px;
        }
        .m-t-120{
            margin-top:40px
        }
        .see_also ul {
  list-style: none; /* remove default bullets */
  padding: 0;
  margin: 0;
}

.see_also li {
  display: flex;
align-items: flex-start; 
  gap: 8px; /* space between tick and text */
  margin-bottom: 6px; /* spacing between list items */
}

.see_also li span {
    flex: 0 0 20px; /* fixed size for icon */
  width: 20px;
  height: 20px;
  background: url(../images/green-right.svg) no-repeat center center;
  background-size: contain;
  margin-right: 8px; /* space between icon and text */
}
#why .swiper-button-prev:after, .swiper-button-next:after{    font-size: revert !important;}
.d-block{ display: contents;}
#overview, #Regulatory, #BankAssurance, #CoreValues, #Benefits, #Security, #Compliance, #PaymentMethods, #XTRMChoice, #XTRMDirect, #PaymentOptions, #Licensing, #Trust, #Money {
    margin-top:70px;
}
#request .banner_tle, #request .banner_tle span, #request h1{
    font-size: 70px;

}
.section_title_wrap.xtrm_pay_box_content p span {
    font-size: 24px ;
}
@media (max-width: 768px) {
  .mobile_slider_row {
    display: flex;
    align-items: center;
    width: 100%;
  }

  .fixed_left_img,
  .fixed_right_img {
    width: 60px;   /* adjust size */
    flex-shrink: 0;
  }

  .mobile_swiper_area {
    flex: 1;       /* take remaining space */
    min-width: 0;  /* critical: allows flex item to shrink properly */
  }

  .mobile_slide_img {
    width: 100%;
    height: auto;
    display: block;
  }
}



@media (max-width: 768px) {
  .mobile_slider_row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    width: 100%;
    gap: 8px;
  }

  .fixed_left_img,
  .fixed_right_img {
    width: 60px;
    height: auto;
    flex-shrink: 0;
  }

  /* Swiper in the middle */
  .mobile_swiper_area {
    flex: 1;
    min-width: 0;
  }

  .mobile_swiper_area .swiper {
    width: 100% !important;
    box-sizing: border-box;
  }

  .mobile_swiper_area .swiper-slide {
    width: 100% !important; /* ✅ force 1 full image only */
  }

  .mobile_slide_img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: contain;
  }

  /* Navigation arrows row */
  .swiper_nav_row {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 10px;
    gap: 20px;
    width: 100%;
  }

  .custom_nav {
    width: 32px;
    height: 32px;
    background: #ddd;
    border-radius: 50%;
  }
  .custom_nav::after {
    font-size: 16px;
    color: #333;
  }
}
.g-pr-10{
    padding-right: 10px !important;
}
.g-p-20{
    padding: 20px;
}
#sitemap ul li{line-height: 30px;}
#button-control .common_btn{
    min-width: 240px !important;
    padding: 20px !important;
}
#button-control {
  display: flex;
  flex-direction: column-reverse; /* mobile: Continue first */
  gap: 12px;
  align-items: center;
}

@media (min-width: 576px) {
  #button-control {
    flex-direction: row; /* desktop: Cancel left, Continue right */
    justify-content: center;
  }
}
/* Container */
.account-list {
  display: flex;
  flex-direction: column;
}

/* Row */
.account-row {
  display: flex;
  flex-wrap: wrap; /* allows stacking on small screens */
  gap: 10px;
  align-items: center;
  padding: 12px 10px;
  border-bottom: 1px solid #eee;
  cursor: pointer;
}

.account-row input {
  width: 18px;
  height: 18px;
  margin-right: 10px;
}

/* Account details */
/* Wrapper for the table that enables scrolling */
.table-wrapper {
  max-width: 100%; /* Ensure it takes up the full width */
  overflow-x: auto; /* Enable horizontal scroll if the content overflows */
  -webkit-overflow-scrolling: touch; /* For smoother scrolling on mobile */
  margin-top: 20px; /* Optional, for spacing from other content */
}

.account-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto; /* Allow table columns to adjust to content width */
}

.account-table th,
.account-table td {
  padding: 12px 16px;
  border: 1px solid #eee;
  text-align: left;
  white-space: nowrap; /* Prevent text from wrapping */
}

.account-table th {
  background-color: #f5f5f5;
  font-weight: 500;
}
.account-table th {
    display: none;
}

.account-radio {
  display: flex;
  justify-content: center;
}

.account-radio input[type="radio"] {
  margin-top: 4px; /* Adjust radio button position */
}

.account-type {
  display: inline-block;
}



.account-type, .account-date {
  text-align: left;
}

.c-s {
  text-align: center;
}

/* Mobile and Desktop: Consistent Horizontal Scroll */
@media (max-width: 768px) {
  /* No changes to the structure, keep horizontal scroll enabled */
  .table-wrapper {
    overflow-x: auto; /* Ensure horizontal scroll works */
  }

 .account-table {
    display: block;  /* Keeps table block for scroll */
    width: 100%;
    overflow-x: auto; /* Horizontal scroll on mobile */
  }

  /* Ensure table cell content does not wrap */
  .account-table th,
  .account-table td {
    white-space: nowrap;
    padding: 10px 12px;
  }

  .account-table td {
    padding-left: 22px; 
    position: relative;
  }
.account-table span {
    font-size: 15px !important;
}
  /* Make sure radio button stays on the left */
  .radio-cell {
    width: 50px; /* Adjust radio button width */
    padding-right: 10px;
    text-align: center;
  }

  .account-radio input[type="radio"] {
    margin-top: 0; /* Adjust radio button for mobile view */
    position: absolute;
    left: 10px;
    top: 10px;
  }

  /* Ensure all td elements remain aligned in a row */
  .account-table tr {
    display: table-row;
  }

  .account-table td {
    display: table-cell;
    text-align: left;
  }
}











.mobile_slider_row {
  display: flex;
  align-items: center;
  position: relative;
}

.fixed_left_img {
  flex: 0 0 60px; /* reserve width for left fixed image */
  z-index: 2;
  position: relative;
}

.fixed_right_img {
  flex: 0 0 60px; /* reserve width for right fixed image */
  z-index: 2;
  position: relative;
}

.mobile_swiper_area {
  flex: 1;
  overflow: hidden; /* hides slide overflow */
}

.mobile_swiper_area .swiper {
  padding-left: 0; /* make sure no overlap */
  padding-right: 0;
}
.fixed_right_img {
  position: absolute;
  top: 0;
  right: 0;
  width: 80px; /* adjust */
  z-index: 3;
}
/* Only affect overview page */
#overview_section #overview_btns {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
 
}

#overview_section #overview_btns span {
  margin: 0 5px;
}

/* Mobile view fix only for overview page */
@media (max-width: 768px) {
  #overview_section #overview_btns {
    flex-direction: column;
    align-items: center;
  }

  #overview_section #overview_btns span {
    margin: 10px 0;
  }
}

#register-form .nice-select::after {
  right: 20px; 
}
#form-v-center{

  align-items: center;   /* vertical center */
  justify-content: center; /* optional, horizontal center */
  min-height: 100vh;    /* make it fill viewport height */

}
select#verificationDropdown {
    font-size: 18px;
    padding-left: 34px !important;
}
#internal-section{
 background: url(../images/banner_bg.svg);
    padding-top: 100px; background-size: 100%;    position: relative;
}
#internal-form-section{
 background: none;
    padding-top: 90px; background-size: 100%;    position: relative;
}
#internal-form-section-brand{
     background: none;
    padding-top: 230px; background-size: 100%;    position: relative;
}

.signup-p{ padding-top:70px; padding-bottom: 50px;}

 h3.column-title{ color: #230871;    margin: 20px 0px;}
a#btnAccept{color: #fff !important; cursor: pointer;}
#Terms1 ul, #pnlTerms ul, .privacy ul {
    margin-left: 20px;
}
#Terms1 table td, #pnlTerms table td{
    padding-left: 0px;
}
#privacy table td { padding-left: 10px !important;}
#text-left td{ text-align: left !important;    padding-left: 10px !important;}
.account-list-wrapper {
  width: 100%;
}
.white-sapce{
    white-space: nowrap;
}

@media (max-width: 768px) {
    .white-sapce{
    white-space: normal;
}
  .account-list-wrapper {
    overflow-x: auto;
    white-space: nowrap;
  }

  .account-list-wrapper > div {
    min-width: 600px; /* adjust if needed */
  }
  .account-list-wrapper input[type="radio"] {
     width: 18px;
  height: 18px;
  }
  .account-list-wrapper label span:first-of-type {
  min-width: 100px !important;
}
}
.account-list-wrapper input[type="radio"] {
  width: 23px;
  height: 23px;
  accent-color: #0946a0; /* optional: custom color */
  cursor: pointer;
}
/* Set first span width after input */
.account-list-wrapper label span:first-of-type {
  min-width: 150px !important;
}
.text-link{
   color: #0660a9;
   cursor: pointer;
}

.text-link:hover{
   color: #673ab7;
    cursor: pointer;
}
.employer{
text-align: right;
    padding-bottom: 20px;
    padding-top: 10px;
    padding-right: 23px;
}
section#internal-form-section-brand .text-danger {
   
    padding-left: 30px;
    padding-top: 10px;
   text-align: left;
   
}
 #internal-form-section .text-danger {
   
    padding-left: 30px;

   text-align: left;
   
}

.agree-check{padding:10px 0px 0px 18px;}
.g-pt-60{padding-top:60px;}
.form-inticate{    
    padding-left: 32px;
    padding-top: 10px;
    display: block;
}
.css-1cowo47-control{ padding: 15px 22px !important;}
.common_btn.disabled,
  .common_btn:disabled {
    pointer-events: none;
    opacity: 0.6;
    cursor: not-allowed;
  }

  .common_btn.disabled:hover,
  .common_btn:disabled:hover {
    background-color: inherit;
    color: inherit;
    box-shadow: none;
    transform: none;
  }
#internal-section img[src$="logo.svg"] {
  display: block;
margin: 0 auto;
  width: 200px;
  max-width: 100%;
  height: auto;
}
.confirmation-box{
    padding-top:121px;
}

.ind-confirmation-box{ padding-top:169px;}




.responsive-btn-wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between; /* left and center alignment */
  position: relative;
  padding-top: 2rem;
  flex-wrap: wrap;
}


.print-btn a {
  display: inline-block;
  padding: 0.75rem 1.5rem;
  background: transparent;
  cursor: pointer;
  transition: all 0.3s ease;
}

.print-btn a:hover {
 color:#673ab7;
}

.accept-btn {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.accept-btn a {
  min-width: 250px;
  text-align: center;
}


#internal-section table {
  width: 100%;
  border-collapse: collapse;
  table-layout: auto;
}


@media (max-width: 768px) {
    .confirmation-box{
    padding-top:58px;
}
.ind-confirmation-box{
    padding-top:100px;
}
    #internal-section img[src$="logo.svg"] {
  display: block;
 float: left;

}
     #internal-section table {
    display: block;
   
    overflow-y: auto;
    overflow-x: auto;
  }
    #internal-section table::-webkit-scrollbar {
    width: 6px;
  }

  #internal-section table::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 3px;
  }
  .responsive-btn-wrapper {
    flex-direction: column;
    align-items: center;
  }

  .accept-btn {
    position: static;
    transform: none;
    margin-top: 1rem;
  }

  .print-btn a,
  .accept-btn a {
    width: 100%;
  }


}

@media print {
  #internal-section img[src$="logo.svg"] {
    display: block;
    margin: 0 auto;
    width: 200px !important; 
    max-width: none !important;
    height: auto !important;
    transform: scale(1); 
  }
}
.env-watermark {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 120px;
  font-weight: 900;
  text-transform: uppercase;
  pointer-events: none;
  z-index: 90;
  user-select: none;
  letter-spacing: 8px;

  background: rgba(228, 228, 228, 0.9);
  padding: 20px 60px;
  border-radius: 12px;


  /* Text outline (works in Chrome, Edge, Safari) */
  color: transparent;
  -webkit-text-stroke: 2px #6a6767;
width: 100%;
text-align: center;


}

.app-content{
    min-height: 100vh;
}
p#divMessageHelp {
    background: #e0f7f4;
    padding: 10px;
    border-radius: 10px;
}

#overview_section #overview_btns {
    display: flex;
    align-items: center;     /* vertical center */
    justify-content: center; /* horizontal center (fixes wrap issue) */
    gap: 10px;
    flex-wrap: wrap;         /* allow wrapping */
    text-align: center;      /* ensures span stays centered on line */
}


/* --- Prevent shaking when switching tabs --- */

#myTabContent {
  position: relative;
  width: 100%;
}

/* All tab panes stacked on top of each other */
#myTabContent .tab-pane {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
  
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease-in-out;
}

/* The active tab pane becomes visible */
#myTabContent .tab-pane.active {
  position: relative;
  opacity: 1;
  pointer-events: auto;
}

/* Make height adjust smoothly (responsive) */
#myTabContent {
  transition: height 0.25s ease;
}

/* On small screens, keep same smooth behavior */
@media (max-width: 768px) {
   
    .br-hide{ display: block !important;}
  #myTabContent .tab-pane {
    transition: opacity 0.25s ease-in-out;
  }

  #myTabContent {
    transition: height 0.25s ease-in-out;
  }
}
.br-hide{ display: none;}
.p-sign-back{background:#fbfbfb; border:1px solid #6f65ef; border-radius: 10px; display: inline-block; padding:6px 10px; margin: 10px 0px; color: #646ee9;}