@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 200;
    src: local('Roboto Thin'), local('Roboto-Thin'), url(fonts/Roboto-Thin.ttf) format('opentype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), url(fonts/Roboto-Light.ttf) format('opentype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto Regular'), local('Roboto-Regular'), url(fonts/Roboto-Regular.ttf) format('opentype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 500;
    src: local('Roboto Medium'), local('Roboto-Medium'), url(fonts/Roboto-Medium.ttf) format('opentype');
}
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 600;
    src: local('Roboto Bold'), local('Roboto-Bold'), url(fonts/Roboto-Bold.ttf) format('opentype');
}
@font-face {
    font-family: 'Rupee';
    font-style: normal;
    font-weight: 600;
    src: local('Rupee'), local('Rupee'), url(fonts/Rupee_Foradian.ttf) format('opentype');
}
.rupee {
    font-family: 'Rupee';
}
body {font-family: 'Roboto', sans-serif;font-weight: 400;overflow-x: hidden;overflow-y: auto;font-size: 15px;line-height: 1.5;letter-spacing: .5px;position: relative;
background: #fff;}
header {
    background: #2C2B6A;
}
a, a:hover{color: #298de5 }
body.nav-body.show-nav{ overflow: hidden;}
body.show-nav .body-overlay{position: absolute;height: 100%;width: 100%;background:rgba(0,0,0,.5);z-index: 1;}
.wrapper {position: relative;}
.wrapper:before, .wrapper:after {content: " ";display: table}
.wrapper:after {clear: both}
/*top menu*/
.top_nav2 ul{ list-style: none; text-align: right; margin: 0; padding: 0;}
.top_nav2 ul li{ display: inline-block; padding: 0; margin: 0; vertical-align: middle;}
.top_nav2 ul li a{ padding: 0.5rem 0.6rem; color: #fff; text-decoration: none; font-size: 0.925rem; font-weight: 300;}
.top_nav2 ul li:last-child{ position: relative; margin-left: 35px; }/*'Redmine:71730 (Replacing cs no & email id with ChatBot with us option)*/
.top_nav2 ul li:last-child div a{ font-size: 13px; color: #82daff; text-align: left; display: block; padding: 0; margin: 0; }
.top_nav2 ul li:last-child img{ position: absolute; left: -30px;top:-2px}/*'Redmine:71730 (Replacing cs no & email id with ChatBot with us option)*/
.dropdown-menu{margin:4px 0 0 0;border-radius:0;padding:5px !important;box-shadow:none;border:solid 1px #ececec; text-align: left !important; background: #fff !important; width: 100% !important; height: inherit !important; transition:inherit !important}
.dropdown-menu>li{ display: block !important;}
.dropdown-menu>li>a{font-size:0.9rem !important;color:#000 !important; text-align: left  !important;font-weight: 500 !important;}
.dropdown-menu>li:last-child{ margin-left: 0 !important;}
.dropdown-menu{right:0; left:inherit;}
.dropdown-toggle::after {border-style: solid !important;border-width: 0.15em 0.15em 0 0 !important;content: '';display: inline-block;height: 0.45em !important;left: 0.15em !important;
position: relative;top: 6px !important;transform: rotate(135deg) !important;vertical-align: top !important;width: 0.45em !important; border: 0;color: #fff;}
.dropdown-menu{ min-width: 230px;}
.top_nav2 .navbar-nav{ display: inherit;}
.top_nav2 .navbar-nav .dropdown-menu{ position: absolute;}
.dropdown-menu>li{ padding: 0.25rem !important;}
.dropdown-menu>li>a{ border-bottom: 1px solid #ccc;}
.dropdown-menu>li:last-child>a{ border-bottom: 0px solid #ccc;}
.top_nav2 ul li:last-child div .call_and_trade span {color: #e86b1f !important;}
.top_nav2 ul li:last-child div a span{ display: block; color: #4A4A4A; font-size: 0.8rem;  margin: 0 ; padding: 0; font-weight: 400 !important; text-transform: capitalize; }
.dropdown-item.active, .dropdown-item:active{ background: #fff;}

/*sub menu*/
.dropdown-submenu {position: relative;}
.missed_call::after {border-style: solid !important; border-width: 0.15em 0.15em 0 0 !important; content: ''; display: inline-block; height: 0.6em !important; left: -77% !important; position: relative; top: 5px!important; transform: rotate(227deg) !important; vertical-align: top !important; width: 0.6em !important; border: 0; color: #175c99;	animation: blink 1s linear infinite;}
.dropdown-submenu .dropdown-menu {top: 0;right: 100%;margin-left: .1rem;margin-right: .1rem;}
/*sub menu*/
/*top menu close*/
.login_bg{ background: url("../images/login_form_bg.png") no-repeat; background-size: cover; padding: 2rem 0;}
.tt_login_form{ background: #fff; box-shadow: -3px 2px 14px #c7c7c7; border-radius: 20px;}
.new_user{ font-size: 15px; color: #8f9498 !important; font-weight: 400;}
.form__field{ position: relative;}
.forgot_client_id, .forgot_client_id:hover{position: absolute; right: 0; bottom: 4px; font-size: 13px; text-decoration: none !important; color: #298de5;}
.forgot_password, .forgot_password:hover{position: absolute; right: 0; bottom: 4px; font-size: 13px; text-decoration: none !important; color: #298de5;}
footer{ background: #3a3a3a; padding: 1.5rem 0; position: relative;}
.info{position: absolute; right: 0; top: 18px;}
.footer_bottom .link_title{ font-size: 1rem; font-weight: 400; color: #cccccc;}
.footer_navleft{ list-style: none; padding: 0.5rem 0; margin: 0;}
.footer_navleft li{ display: inline-block; text-align: left; margin: 0; }
.footer_navleft li a{ font-size: 0.875rem; font-weight: 300; color: #ff8a43; text-decoration: none;padding: 0  0.5rem !important; border-right: 1px solid #8c9397; }
.footer_navleft li:first-child a{ padding-left: 0 !important;  }
.footer_navleft li:last-child a{  border-right:0px; }
.footer_nav_right{ list-style: none; padding: 0.5rem 0; margin: 1.25rem 0 0 0;}
.footer_nav_right li{ display: inline-block; text-align: left; margin: 0; }
.footer_nav_right li a{ font-size: 0.875rem; font-weight: 300; color: #ff8a43; text-decoration: none;padding: 0  0.5rem !important; border-right: 1px solid #8c9397; }
.footer_nav_right li:first-child a{ padding-left: 0 !important;  }
.footer_nav_right li:last-child a{  border-right:0px; }
.footer_link_bdr{ border-top: 1px solid #535557;}
.footer_content p{ color: #8c9397; font-size: 0.8125rem; line-height: 1.25; font-weight: 300;}
.get_link h3{ color: #3a3a3a; font-size: 1.375rem; font-weight: 300;}
.get_link h1{ color: #3a3a3a; font-size: 1.875rem; line-height: 1.2; font-weight: 400;}
.market_screen span{ font-size: 2.5rem; font-weight: 600; color: #e86a24; line-height: 1.1; font-style: italic;}
/*.get_link:after{ border-bottom: 1px solid #d2d2d2; content: ""; display: block; width: 90%;}
.market_app_screen{ position: absolute; bottom: 0; right: 0; width: auto;}*/
.get_link_form .form__group {position: relative;padding: 10px 0 0; width: 80%;/* margin-top: 10px;*/}
.get_link_form .form__field {font-family: inherit;width: 100%;border: 1px solid #d2d2d2;outline: 0;font-size: 16px;color: #000;padding: 6px 12px;background: transparent;transition: border-color 0.2s;font-weight: 400;border-radius: 3px;height: 42px;}
.get_link_form .form__field::placeholder {color: transparent;}
.get_link_form .form__field:placeholder-shown ~ .form__label {font-size: 16px;cursor: text;top: 20px;left: 10px !important;color: #8f9498;}
.get_link_form .form__group label, .get_link_form .form__field:focus ~ .form__label {position: absolute;top: 0px;display: block;transition: 0.2s;font-size: 14px;padding: 0px 5px;font-weight: 300;color: #9295A5;
left: 10px !important;background: #fff !important;}
.get_link_form .form__field:focus ~ .form__label {color: #56affa;background:#fff;position:absolute;left:10px;}
.get_link_form .form__field:focus{padding-bottom: 6px;border: 2px solid #56affa !important;}
.btnResend{ border: 1px solid #ff7200; position: absolute; right: 0; top:10px; border-radius: 0 5px 5px 0; background: #ff7200; padding: 8.5px 1.25rem; color: #fff; }
.secondary_btn a{text-decoration: #298de5 ;}
.chat_box{ position: absolute; top: -100px; right: 3%; z-index: 9999;}
.missed_call{ color: #175c99; font-weight: 400;padding-left: 20px;}
.inner_menu{box-shadow: -1px -4px 9px #dcdcdcc7;}
.screen_main{ display: table;}
.screen_main div{ display: table-cell; vertical-align: middle;}
.screen_main span{ display: table-cell; vertical-align: middle;}


@media ( min-width:991px) and ( max-width:1280px)
{
.top_nav2 ul li:last-child{ margin-top: 15px;}	
.get_link_form{ width: 100% !important;}
}

@media ( max-width:576px)
{
.market_app_screen{ display: none;}	
.new_user{ font-size: 11px;}
.market_screen{ max-width: 300px; margin: 0 auto; text-align: center;}
.screen_main{ margin: 0 auto;}
.screen_box{ text-align: center;}

}

@media ( max-width:768px)
{
.tt_login_form{ max-width: 300px; margin: 0 auto;}
.secondary_btn, .primary_btn{ font-size: 0.9rem !important; padding: 0.8rem 0.5rem !important;}
.login_bg{ padding: 1rem 0;}
.market_screen span{ font-size: 2.25rem;}
.get_link h1, .get_link h3{ font-size: 1.2rem !important;}
.get_link_form{ width: 100% !important; }
.get_link:after{ border-bottom: 0;}
.get_link_form .form__group{ width: 100%;}
.market_screen img { width: 60px;}
.market_screen span {font-size: 1.4rem;line-height: 1.4;}
.top_nav2 .navbar-nav{ display: flex;}
.chat_box {position: absolute;bottom: 50px !important;right: 3%;z-index: 9999; top: inherit;}
.get_link_form{ width: 100% !important;}
}


@media ( max-width:991px)
{
	.missed_call{ padding-left: 0px;}
.missed_call::after{ left: 15px !important;     transform: rotate(135deg) !important;}
.dropdown-submenu .dropdown-menu{ margin-left: 0px !important;}
.get_link h1{ font-size: 1.4rem;}
.market_app_screen{position: inherit;}
.logo-menu{ text-align: left;}
.iifl_logo img{ max-width: 230px; margin-left: 50px; position: absolute;}
	header{ height: 65px;}
.icon_bar {position: absolute;top: 15px;left: 20px;transition: all .3s ease;z-index: 1025;}
#nav-toggle {cursor: pointer;padding: 0px;}
#nav-toggle span,#nav-toggle span:before,#nav-toggle span:after {cursor: pointer;border-radius: 1px;height: 2px;width: 30px;background: #fff;position: absolute;display: block;content: '';}
#nav-toggle span:before {top: -10px;}
#nav-toggle span:after {bottom: -10px;}
#nav-toggle span,#nav-toggle span:before,#nav-toggle span:after {transition: all 200ms ease-in-out;}
#nav-toggle.active span {background-color: transparent;margin-top: 5px;}
#nav-toggle.active span:before,#nav-toggle.active span:after {top: 10px;}
#nav-toggle.active span:before {transform: rotate(45deg);}
#nav-toggle.active span:after {transform: rotate(-45deg);}
/* Off Canvas Navigation */
.wrapper {width: 100%;position: absolute;left: 0;transition: .3s ease all; }
.top_nav2 ul{width: 250px;height: 100%;position: fixed;top: 0;left: -250px;background: #0f497b;font-size: .8em;font-family: sans-serif;font-weight: 300;
transition: all .3s ease; z-index: 9999 !important; margin: 0; padding: 0;}
.top_nav2{margin: 0;padding: 0; text-align: left;}
.top_nav2 ul li:first-of-type {border-top: 1px solid rgba(255, 255, 255, 0.28);}
.top_nav2 ul li {border-bottom: 1px solid rgba(255, 255, 255, 0.28); display: block; text-align: left;}
.top_nav2 ul li a {padding: 10px 20px;display: block;color: #fff;text-decoration: none; font-size: 0.8rem;}
.top_nav2 ul li a:hover {background: transparent;}
.top_nav2 ul li a.active{ border-bottom: 0px solid #ff801a !important; color: #fff;}
/* JavaScript toggle */
.show-nav .wrapper {transform: translateX(250px);}
.show-nav .icon_bar {position: fixed;}
.top_nav2 ul li:last-child{ border-bottom: 0px; margin-top: 10px;}
.top_nav2 ul li:last-child{ margin-left: 58px;}
.dropdown-menu>li>a{ font-size: 14px;}
.top_nav2 .navbar-nav .dropdown-menu{ position: static !important; transform: none !important;}
.footer_navleft, .footer_nav_right{ text-align: center !important;}
}



/*btn-group-justified*/
.select_justified_btn .btn-group-justified{display:table;width:100%;table-layout:fixed;border-collapse:separate; border: 1px solid #dee2e6; border-radius: 3px;}
.select_justified_btn .btn-group-justified > .btn,
.select_justified_btn .btn-group-justified > .btn-group{display:table-cell;float:none;width:1%; border-radius: 0px !important;font-size: 1rem; line-height: inherit; padding: 0.5rem 0.6rem; background: #EEEFF2; color: #9295a5; }
.select_justified_btn .btn-group-justified > .btn-group .btn{width:100%;}
.select_justified_btn .btn-group-justified > .btn-group .dropdown-menu{left:auto;}
.select_justified_btn [data-toggle="buttons"] > .btn input[type="radio"],
.select_justified_btn [data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
.select_justified_btn [data-toggle="buttons"] > .btn input[type="checkbox"],
.select_justified_btn [data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"]{position:absolute;clip:rect(0, 0, 0, 0);pointer-events:none;}
.select_justified_btn .btn:not(:disabled):not(.disabled).active, .select_justified_btn .btn:not(:disabled):not(.disabled):active,.select_justified_btn .btn:not(:disabled):not(.disabled).focus{ background:#ef5713; color:#fff; }
.select_justified_btn .btn.focus{ box-shadow: none;}
.select_justified_btn .btn:not(:disabled):not(.disabled).active{ border-radius: 4px 0 0 4px !important;}
.btn.btn-default.custombtn-radio.filterbtns.rdbtn-SchemeAssetType.owned.active{ border-radius: 0px 4px 4px 0px !important;}

/*btn-group-justified*/
/*btn*/
.primary_btn{ text-align: center;  padding:0.8rem ; border-radius: 5px; color: #fff !important; font-size: 1rem; font-weight: 400; display: inline-block;margin: 0; line-height: 1.1; background: #e86b1f; text-decoration: none !important; width: 100%;}
.primary_btn:hover {background: #e86b1f; color: #fff !important;}
.primary_btn:active {background-color: #e86b1f;background-size: 100%;transition: background 0s;}
/*
.primary_btn.ripple {background-position: center;transition: background 0.8s;}
.primary_btn.ripple:hover {background: #e86b1f radial-gradient(circle, transparent 1%, #e86b1f 1%) center/15000%;}
.primary_btn.ripple:active {background-color: #f87b2f;background-size: 100%;transition: background 0s;}
*/
.secondary_btn{ text-align: center;  padding:0.8rem 1rem; border-radius: 5px; color: #298de5 !important; font-size: 1rem; font-weight: 400; display: inline-block;margin: 0; line-height: 1.1; background: #fff; text-decoration: none !important; width: 100%; border:1px solid #298de5;}
.secondary_btn:hover {background: #fff; color: #298de5 !important;border:1px solid #298de5;}
.secondary_btn:active {background-color: #fff;background-size: 100%;transition: background 0s; border:1px solid #298de5;}
/*.secondary_btn.ripple {background-position: center;transition: background 0.8s;}
.secondary_btn.ripple:hover {background: #DEE2E6 radial-gradient(circle, transparent 1%, #DEE2E6 1%) center/15000%;}
.secondary_btn.ripple:active {background-color: #eff6fd;background-size: 100%;transition: background 0s;}*/
/*btn*/
/*Styling for form starts*/
.form__group {position: relative;padding: 15px 0 0;/* margin-top: 10px;*/}
.form__field {font-family: inherit;width: 100%;border-bottom: 1px solid #d2d2d2 !important; border: 0; outline: 0;font-size: 1.175rem;color: #000;padding: 12px 12px 6px 0;background: transparent;transition: border-color 0.2s;font-weight: 400;border-radius: 0px;height: 38px;}
.form__field::placeholder {color: transparent;}
.form__field:placeholder-shown ~ .form__label {font-size: 1.175rem;cursor: text;top: 22px;left: 0px;color: #8f9498;}
.form__group label, .form__field:focus ~ .form__label {position: absolute;top: 5px;display: block;transition: 0.2s;font-size: 14px;padding: 0px;font-weight: 300;color: #9295A5;
left: 0px !important;background: #fff !important;}
.form__field:focus ~ .form__label {color: #56affa;background:#fff;position:absolute;left:10px;}
.form__field:focus{padding-bottom: 6px;border: 0px solid #56affa;}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
transition: background-color 5500s ease-in-out 0s;-webkit-text-fill-color: #4f4f4f !important;}

.form__field.valid {border: 2px solid #56affa !important;}
.error:focus ~ .form__label{color:red;}
span#email-error, span#select_state-error {color: red;font-size: 12px;font-weight: 300;}
.error:focus, .error:valid{
border: 2px solid red !important;}
.form__group textarea{height: 100px;}
/*Styling for form ends*/
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}
input:-internal-autofill-selected { background: #fff;}
@keyframes blink{
0%{opacity: 0;}
50%{opacity: .5;}
100%{opacity: 1;}
}


.askiifl {
            position: fixed;
            bottom: /*20px;*/55px; /*Redmine 72378*/ 
            z-index: 9999;
            right: 20px;
        }

/*modal css start*/
.ttweb_model_all .modal-header{ padding: 0.5rem 1rem;}
.ttweb_model_all .modal-title{font-size: 1.5rem;font-weight: 400;}
@media (min-width: 577px){
.ttweb_model_all .modal-dialog {display: inline-block;text-align: left;vertical-align: middle; width: 100%;}
.ttweb_model_all .modal{text-align: center;}
.ttweb_model_all .modal:before {content: '';display: inline-block;height: 100%;vertical-align: middle;margin-right: -4px;}
}
@media (max-width:576px) {
.ttweb_model_all .modal {top: 9% !important;left: 0;right: 0;padding-right: 0 !important;}
}
/*modal css close*/
/*popover css custom*/
.popover {background: #000;}
.popover-body{ color: #fff !important;}
.bs-popover-top>.arrow::after{border-top-color: #000;}
.popover a{ text-decoration: underline;}
/*popover css custom*/


/*Redmine 72378 Start*/
.cookie-bar {
position: fixed;
width: 100%;
bottom: 0px;
right: 0;
left: 0;
text-align: center;
line-height: 1.2;
background: #efefef;
color: white;
font-size: 14px;
font-family: "Lato", sans-serif;
font-weight: 100;
transition: .8s;
-webkit-animation: slideIn 1s;
animation: slideIn 1s;
-webkit-animation-delay: 0s;
animation-delay: 0s;
padding: 12px 0;
border-top:1px solid #dddddd;
z-index: 9999 !important;
}
.cookie-bar .message {
color: #000;
font-weight: 400;
padding: 3px 0 0 10px;
font-size: 12px;
}
.cookie-btn-orange {
background: #f3792d;
color: #fff;
border-radius: 0;
line-height: 1.3333333;
margin-right: 10px;
}
.cookie-btn-orange:hover {
background: #ff6200;
color: #fff;
}
.cookie-btn-grey {
background: #aaaaaa;
color: #000;
border-radius: 0;
line-height: 1.3333333;
margin-right: 10px;
}
.cookie-btn-grey:hover {
background: #888888;
color: #000;
}
/*@media (max-width: 767px) {
.cookie-bar .message {
display: none;
}
}
.cookie-bar .mobile {
display: none;
}
@media (max-width: 767px) {
.cookie-bar .mobile {
display: inline-block;
width: 100%;
margin-bottom: 12px;
}
}
*/    
@-webkit-keyframes slideIn {
0% {
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
@keyframes slideIn {
0% {
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
100% {
-webkit-transform: translateY(0);
transform: translateY(0);
}
}
.checkbox-cb {
display: none;
}
.checkbox-cb:checked + .cookie-bar {
-webkit-transform: translateY(100%);
transform: translateY(100%);
}
/*summary::-webkit-details-marker {
transform: rotate(90deg);
}
details[open] summary::-webkit-details-marker {
transform: rotate(180deg);
}
.zsiq_theme1.zsiq_floatmain{
z-index: 9998 !important;
}*/
.iso-img{
max-width: 50px;
float: left;
margin-right: 10px;
margin-top: 10px;
margin-bottom: 10px;
}
.iso-1{color: #fff;margin-bottom: 0;margin-top: 17px;padding:0;font-size:15px;display:inline-block;}
.iso-2{color: #fff;font-size: 12px;line-height: 1;margin-bottom: 10px;padding:0;}
.cookie-bar .col-sm-10{width: 83.33333333%!important;float:left!important;}
.btnaccept {display: inline-block;padding: 6px 12px;margin-bottom: 0;font-size: 14px;font-weight: 400;line-height: 1.42857143;text-align: center;white-space: nowrap;vertical-align: middle;-ms-touch-action: manipulation;touch-action: manipulation;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;background-image: none;border: 1px solid transparent;border-radius: 4px;}
/*Redmine 72378 End*/

/*css for RiskDisclosure modal 09-05-2024 mobile*/
@media only screen and (max-width: 576px) {
    #RiskDisclosure .modal-header {
        padding-bottom: .5rem
    }

        #RiskDisclosure .modal-header .modal-title {
            font-size: 1.35rem
        }

    #RiskDisclosure .modal-content {
        margin-bottom: 2rem;
    }

    #RiskDisclosure .modal-body {
        padding-bottom: 4rem;
        padding-top: 0;
        font-size: 13px;
    }
}





/*%--Fraud Toast message 05-08-2024--%*/
#toast {
    visibility: hidden;
    width: 100%;
    max-width: 950px;
    height: 80px;
    /*margin-left: -125px;*/
    margin: auto;
    background: #FFFFFF;
    border: 1px solid #FFBC48;
    color: #FFF;
    text-align: center;
    border-radius: 9px 9px 9px 9px;
    position: fixed;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 15%;
    font-size: 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    #toast #img {
        width: 90px;
        height: 80px;
        float: left;
        box-sizing: border-box;
        background-color: #FFBC48;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 8px 0px 0px 8px;
    }

        #toast #img .alertIcon {
            width: 48px;
            height: 44px;
        }

    #toast #desc {
        color: #fff;
        padding: 16px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: space-between;
        column-gap: 32px;
    }

        #toast #desc p {
            padding-bottom: 0px !important;
            color: #333333;
            font-weight: 400;
            text-align: left;
            font-size: 14px;
            line-height: 1.3;
        }

    #toast.show {
        visibility: visible;
    }

@-webkit-keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 30px;
        opacity: 1;
    }
}

@keyframes fadein {
    from {
        bottom: 0;
        opacity: 0;
    }

    to {
        bottom: 30px;
        opacity: 1;
    }
}

@-webkit-keyframes expand {
    from {
        min-width: 50px
    }

    to {
        min-width: 350px
    }
}

@keyframes expand {
    from {
        min-width: 50px
    }

    to {
        min-width: 350px
    }
}

@-webkit-keyframes stay {
    from {
        min-width: 350px
    }

    to {
        min-width: 350px
    }
}

@keyframes stay {
    from {
        min-width: 350px
    }

    to {
        min-width: 350px
    }
}

@-webkit-keyframes shrink {
    from {
        min-width: 350px;
    }

    to {
        min-width: 50px;
    }
}

@keyframes shrink {
    from {
        min-width: 350px;
    }

    to {
        min-width: 50px;
    }
}

@-webkit-keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1;
    }

    to {
        bottom: 60px;
        opacity: 0;
    }
}

@keyframes fadeout {
    from {
        bottom: 30px;
        opacity: 1;
    }

    to {
        bottom: 60px;
        opacity: 0;
    }
}



/*<%-- Next Gen - Trading (BETA) Section 17-03-2025--% >*/
.tradingBeta.panel-1 {
    font-family: 'Roboto',sans-serif;
}

.tradingBeta .hidden {
    display: none;
}

.betaCard {
    width: 100%;
    border: 1px solid #BFD4DE;
    padding: 20px;
    border-radius: 8px;
    margin-bottom: 30px;
}

    .betaCard .row {
        align-items: center;
    }

    .betaCard .title {
        color: #185380;
        font-size: 20px;
        font-weight: 700;
    }

        .betaCard .title .joinText, .betaCard .title .leaveText {
            color: #185380;
            font-size: 20px;
            font-weight: 700;
        }

    .betaCard .subtitle {
        color: #7B7B7B;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.3;
        margin-top: 10px;
    }

        .betaCard .subtitle .joinText, .betaCard .subtitle .leaveText {
            color: #7B7B7B;
            font-size: 14px;
            font-weight: 400;
            line-height: 1.3;
        }

.betaCTA.leave {
    background-color: #28AEF0 !important;
}

.betaCTA, .joinBetaCTA {
    background: #28AEF0;
    padding: 10px 30px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    color: #FFFFFF;
    border-radius: 6px;
    outline: none;
    border: none;
    height: fit-content;
}

.betaCard.betaVersion .status {
    position: unset;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 8px 15px;
    border-radius: 20px;
}

    .betaCard.betaVersion .status p {
        font-size: 14px;
        font-weight: 500;
        padding-bottom: 0 !important;
    }

    .betaCard.betaVersion .status.inProcess {
        background: rgba(255, 244, 209, 0.6);
        color: #9C6913;
    }

    .betaCard.betaVersion .status.betaActive {
        background: #E5FFDF;
        color: #01A453;
    }

.betaCard .accordion label {
    padding: 15px 0 10px 0;
    color: #222222;
    font-size: 14px;
    font-weight: 700;
}

.betaCard .joinbetaProgram .title {
    display: flex;
    align-items: center;
    gap: 15px;
}

.betaCard .joinbetaProgram .subtitle {
    padding-left: 25px;
}

.betaCard span {
    font-size: 12px;
    color: #7B7B7B;
    font-weight: 400;
    line-height: 1.3;
}

.accordionCard {
    position: relative;
    box-shadow: 0px 4px 14px 0px #D9EDF7;
}

    .accordionCard::before {
        content: "";
        position: absolute;
        background-image: url('../../images/whats-new.svg');
        background-repeat: no-repeat;
        width: 100px;
        height: 30px;
        top: -15px;
    }

.betaCard .accordion .handle label:before {
    background-image: url('../../images/down-arrow-orange.svg');
    width: 19px;
    height: 20px;
    transform: rotate(0deg);
}

.betaCard .accordion input:checked + .handle label:before {
    background-image: url('../../images/up-arrow-orange.svg');
}

.betaCard .betaProgramInfo {
    display: flex;
    align-items: center;
    gap: 15px;
    padding-bottom: 20px;
    border-bottom: 0.8px solid #BFD4DE;
    margin-top: 20px;
}

    .betaCard .betaProgramInfo:last-child {
        border-bottom: none;
        padding-bottom: 0px;
    }

    .betaCard .betaProgramInfo .informative label {
        padding: 0;
        margin-bottom: 7px;
        font-size: 14px;
        font-weight: 600;
        cursor: auto;
    }

.betaCard.howToJoin, .betaCard.howToLeave, .tradingBeta .faqSection .betaCard {
    box-shadow: 0px 4px 14px 0px #D9EDF7;
}

    .betaCard.howToJoin .accordion label, .betaCard.howToLeave .accordion label {
        padding: 0;
    }

.betaCard .subAccordion {
    padding: 20px 0 0;
    border-bottom: 0.8px solid #BFD4DE;
}

    .betaCard .subAccordion:last-child {
        border-bottom: none;
    }

    .betaCard .subAccordion:first-child {
        border-top: 0.8px solid #BFD4DE;
    }

    .betaCard .subAccordion .handle label {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .betaCard .subAccordion .handle span {
        font-size: 14px;
        font-weight: 600;
        color: #222222;
    }

    .betaCard .subAccordion .handle .desktop {
        font-weight: 400;
    }

    .betaCard .subAccordion .accordioncontent {
        margin-top: 15px;
    }

.betaCard .accordion > input[type="checkbox"]:checked ~ .accordioncontent {
    margin: 20px 0;
}

.betaCard .accordion.subAccordion input:checked + .handle {
    margin-bottom: 15px;
}

.betaCard .accordion.subAccordion .handle label:before {
    background-image: url('../../images/down-arrow-grey.svg');
    top: 7px;
    right: -3px;
}

.betaCard .accordion.subAccordion input:checked + .handle label:before {
    background-image: url('../../images/down-arrow-grey.svg');
    transform: rotate(180deg);
    right: 5px;
    top: -7px;
}

.betaCard .accordion.subAccordion .accordioncontent {
    margin-top: 20px;
    padding-left: 30px;
}

.tradingBeta .accordion ul {
    padding-left: 15px;
}

    .tradingBeta .accordion ul li {
        color: #F6711F;
        font-size: 12px;
        font-weight: 400;
        padding-bottom: 8px;
    }

        .tradingBeta .accordion ul li span {
            color: #7B7B7B;
        }

.accordion .productionStepsList {
    list-style-type: auto;
    padding-left: 15px;
}

    .accordion .productionStepsList li {
        color: #7B7B7B !important;
    }

.accordion.subAccordion .accordioncontent .checkBoxSec label {
    padding-left: 25px;
    color: #7B7B7B;
    font-size: 12px;
    font-weight: 400;
    margin: 0;
}

.accordion.subAccordion .tick-mark {
    margin: 0px 70px 0px auto;
    display: none;
}

.accordion.subAccordion .checked .tick-mark {
    display: inline-block;
}

.accordion.subAccordion .steps {
    width: 100%;
    margin: 20px 0
}

.accordion.subAccordion .activate {
    background: #FFF6DF;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    margin-bottom: 20px;
}

    .accordion.subAccordion .activate p {
        padding-bottom: 0px !important;
        color: #918462;
        font-size: 12px;
        font-weight: 400;
    }

.accordion.subAccordion .temporarilyunavailable {
    color: #7B7B7B;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.2;
}

.tradingBeta .faqSection h3 {
    color: #185380;
    font-size: 20px;
    font-weight: 800;
    line-height: 1.2;
    text-align: center;
    margin-bottom: 20px;
}

.tradingBeta .faqSection .betaCard .subAccordion {
    padding-top: 0px;
    border-top: none;
}

.tradingBeta .faqSection .betaCard .accordion.subAccordion .handle label:before {
    top: 22px;
}

.tradingBeta .faqSection .betaCard .accordion.subAccordion input:checked + .handle label:before {
    top: 5px;
}

.tradingBeta .faqSection .betaCard .accordion.subAccordion .accordioncontent {
    padding-left: 0px;
}

.tradingBeta .faqSection .betaCard .accordion > input[type="checkbox"]:checked ~ .accordioncontent {
    margin: 0;
}

.tradingBeta .faqSection .betaCard .subAccordion .handle label {
    padding: 15px 0 0 0;
}

.tradingBeta .faqSection .betaCard .accordion.subAccordion input:checked + .handle {
    margin-bottom: 10px;
}

.tradingBeta .faqSection .betaCard .subAccordion .handle span {
    padding-right: 20px;
}

.tradingBeta .faqSection .viewMoreFaq {
    margin: 25px 0 10px;
    text-align: center;
}

    .tradingBeta .faqSection .viewMoreFaq a {
        color: #28AEF0;
        font-size: 14px;
        font-weight: 400;
    }

.betaCard .mobView {
    display: none;
}

.tradingBeta .joinLeaveBTN {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

    .tradingBeta .joinLeaveBTN button {
        background: #28AEF0;
        box-shadow: 0px 0px 2px 0px #00000040;
        padding: 10px 30px;
        color: #FFFFFF;
        font-size: 16px;
        font-weight: 700;
        border: none;
        outline: none;
        border-radius: 6px;
        cursor: pointer;
    }

        .tradingBeta .joinLeaveBTN button:disabled {
            background: #D9D8D8;
            box-shadow: 0px 0px 2px 0px #00000040;
            cursor: default;
        }

.tradingBeta .thankYou .betaVersion {
    margin-bottom: 15px;
}

.tradingBeta .thankYou .title {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #185380;
    font-size: 20px;
    font-weight: 700;
}

.tradingBeta .thankYou .thanks {
    box-shadow: 0px 4px 14px 0px #D9EDF7;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.tradingBeta .thankYou h5 {
    margin: 10px 0 20px;
    color: #222222;
    font-size: 16px;
    font-weight: 700;
}

.tradingBeta .thankYou .impInfo {
    margin-top: 0;
}

.tradingBeta .thankYou .thanks p {
    color: #7B7B7B;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.3;
    text-align: center;
}

.tradingBeta .thankYou h3 {
    color: #222222;
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 20px;
}

.thankYou .betaCard .subAccordion:first-child {
    border-top: none;
    padding-top: 0;
}

.thankYou .continueTra {
    display: block;
    margin: 0 auto;
    text-align: center;
}

    .thankYou .continueTra button {
        padding: 10px 30px;
        background: #28AEF0;
        box-shadow: 0px 0px 2px 0px #00000040;
        font-size: 16px;
        font-weight: 700;
        color: #FFFFFF;
        border: none;
        outline: none;
        border-radius: 6px;
    }

.thankYou .betaCard .accordion.subAccordion .handle label:before {
    display: none;
}

.font-weight-300 {
    font-weight: 300 !important;
}

.tradingBeta .leaveBetacta {
    color: #7B7B7B;
    font-size: 14px;
    font-weight: 400;
}

    .tradingBeta .leaveBetacta a {
        color: #0089DC;
        font-size: 14px;
        font-weight: 700;
    }

        .tradingBeta .leaveBetacta a:hover {
            text-decoration: none;
        }

.tradingBeta a:hover {
    text-decoration: none;
}

.tradingBeta .betaActive a {
    font-size: 14px;
    font-weight: 500;
}
/*modal Popup*/
#JoinLeaveBetaPro .modaltitle {
    margin: 0;
}

#JoinLeaveBetaPro .modalcontent {
    background: #FFFFFF;
    border-radius: 19px;
    width: 100%;
    max-width: 440px;
}

#JoinLeaveBetaPro .modal-body {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-direction: column;
}

    #JoinLeaveBetaPro .modal-body h4 {
        color: #222222;
        font-size: 18px;
        font-weight: 700;
    }

    #JoinLeaveBetaPro .modal-body p {
        color: #7B7B7B;
        font-size: 14px;
        font-weight: 400;
        line-height: 1.2;
    }

    #JoinLeaveBetaPro .modal-body .buttonsDiv {
        display: flex;
        align-items: center;
        gap: 15px;
        justify-content: center;
        margin: 20px 0 0
    }

        #JoinLeaveBetaPro .modal-body .buttonsDiv .canBtn {
            border: 1px solid #444A4F;
            box-shadow: 0px 0px 2px 0px #00000040;
            color: #444A4F;
            font-size: 16px;
            font-weight: 400;
            line-height: 1.2;
            padding: 8px 30px;
            outline: none;
            border-radius: 6px;
            background: #FFFFFF;
        }

@media (max-width: 768px) {
    .betaCard .joinBetaCTA {
        font-size: 14px;
    }

    .betaCard .row {
        flex-direction: column;
        align-items: flex-start;
    }

        .betaCard .row .justify-end {
            justify-content: flex-start;
            margin-top: 20px;
        }
}

@media (max-width: 576px) {
    .betaCard {
        padding: 15px;
    }

        .betaCard .title {
            font-size: 16px;
        }

        .betaCard .subtitle {
            font-size: 12px;
        }

        .betaCard .betaProgramInfo {
            align-items: flex-start;
            gap: 10px;
        }

    .accordion.subAccordion .accordioncontent .checkBoxSec label {
        padding-left: 12px;
        font-size: 11px;
    }

    .accordion.subAccordion .orgtickcheckbox label:before {
        top: 3px !important;
        left: -15px;
    }

    .accordion.subAccordion .tick-mark {
        margin: 0px 45px 0px auto;
        width: 14px;
        height: 14px;
    }

    .betaCard .subAccordion .handle span {
        font-size: 12px;
    }

    .tradingBeta .faqSection .betaCard .subAccordion .handle span {
        padding-right: 35px;
    }

    .betaCard .deskView {
        display: none;
    }

    .betaCard .mobView {
        display: block;
    }

    .tradingBeta .thankYou h5 {
        text-align: center;
    }

    .tradingBeta .faqSection h3 {
        font-size: 15px;
    }

    .betaCTA,
    .joinBetaCTA {
        padding: 10px 20px;
    }
}



#AddressModifi .modalcontent {
    max-width: 440px;
    border: 1px solid #444A4F;
    background: #FFFFFF;
    border-radius: 20px;
    position: relative;
}

    #AddressModifi .modalcontent .modaltitle {
        color: #222222;
        font-size: 18px;
        font-weight: 700;
        margin-bottom: 0;
        text-align: center;
    }

    #AddressModifi .modalcontent .modal-header {
        padding: 2.5rem 1rem 0 1rem;
        border-bottom: none;
    }

    #AddressModifi .modalcontent .closeModal {
        position: absolute;
        right: 20px;
        top: 18px;
        width: 12px;
        height: 12px;
        cursor: pointer;
    }

    #AddressModifi .modalcontent .inputContainer {
        margin-bottom: 15px;
    }

    #AddressModifi .modalcontent .radioBTN {
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 10px;
    }

        #AddressModifi .modalcontent .radioBTN:last-child {
            margin-bottom: 0px;
        }

        #AddressModifi .modalcontent .radioBTN label {
            margin-bottom: 0px;
            color: #7B7B7B;
            font-size: 14px;
            font-weight: 400;
        }

    #AddressModifi .modalcontent .buttonsDiv {
        display: flex;
        align-items: center;
        justify-content: center;
    }

        #AddressModifi .modalcontent .buttonsDiv button {
            background: #28AEF0;
            box-shadow: 0px 0px 2px 0px #00000040;
            color: #FFFFFF;
            font-size: 14px;
            font-weight: 700;
            padding: 10px 30px;
            outline: none;
            border: none;
            border-radius: 6px;
        }



#DivOptinPopup h2 spna {
    font-size: 20px;
    font-weight: 600;
}

#DivOptinPopup .tick-mark {
    display: none;
}

#DivOptinPopup ul {
    padding: 0 0 0 25px;
    margin: 15px 0;
}

    #DivOptinPopup ul li {
        font-size: 13px;
        line-height: 1.2;
        padding-bottom: 8px;
    }

#DivOptinPopup .buttonsDiv {
    display: flex;
    align-items: center;
    justify-content: center;
}

#DivOptinPopup .modal-header {
    margin: 0;
    padding: 0;
}

#DivOptinPopup .modal-body {
    padding-top: 0px;
}