/* global */
*{font-family: "Poppins", sans-serif;}
body { background-color: #EAECEC !important;overflow-x: hidden; }
a {text-decoration: none !important;}


/* common */
.parent-content-wrapper{background: #fff;border-radius: 8px;margin: 25px}
.content-wrapper{background-color: #fff;border-radius: 8px;padding: 45px 25px;min-height: 800px;}
.pl-130{padding-left: 130px !important}
.pl-25{padding-left: 25px;}
.custom-fields{border: 1px solid #BDBDBD;border-radius: 4px;width: 100%;min-height: 40px;outline: none;padding: 0 15px;color: #828282;}
.cust-green-btn{width: 100%;background-color: #2DBFB5;border-radius: 8px;text-align: center; outline: none;height: 50px;color: #fff;border: none;font-size: 20px;margin: 50px 0 25px}
.link-style{border: none;background: transparent;text-decoration: underline;color: #2dbfb5;}
.input-wrapper{padding-bottom: 32px;}
.input-wrapper label{padding-bottom: 10px;font-weight: 500}
.container.m-0.w-100{max-width: 100%}

/* modal */
.modal-header{justify-content: flex-end;border-bottom: none !important;}
.modal-title{text-align: center;color: #333333;font-weight: 600;font-family: "Poppins", sans-serif;}
.close {border: none;background: transparent;font-size: 24px;padding: 0;margin: 0;}
.close span{width: 26px;float: right;font-size: 1.5rem;font-weight: 700;line-height: 0.85;color: #000;text-shadow: 0 1px 0 #fff;border: 1px solid;border-radius: 50%;height: 26px;padding-left: 1px;}
.modal-footer{border-top: none !important;}


/* up-drawer & up-content css start */
.admin .up-drawer{ top: 30px;min-height: calc(100vh - 30px); }
.up-drawer .drawer-close-btn{ display: none;font-size: 20px;position: absolute;right: 15px;top: 10px; }
.up-drawer .up-drawer-header{ padding: 5px 10px; }
.up-drawer:after{ content: "";position: fixed;top: 0px;bottom: 0px;left:0px;right: 0px; display: none; background-color: rgba(0,0,0,0.3);transition: 0.2s; }
.up-drawer{ display: block;transition: 0.3s; position: fixed;top: 0px;left: 0px;width: 100%;max-width: 265px;z-index: 100; }
.up-drawer .up-drawer-wrapper{ position: relative; display: block;padding: 0px; width: 100%;min-height: 100vh;background-color: #19658f;box-shadow: 7px 0px 17px rgba(0,0,0,0.2); color: #fff;z-index: 1000; }
.up-drawer .up-drawer-logo{padding: 15px 0px; display: flex;align-items: center;justify-content: center; }
.up-drawer .up-drawer-heading{ font-size: 20px; }
.up-content{ position: relative; display: block;width: calc(100% - 265px);margin-left: 265px; }
.up-content h1{ color: red; }

.up-drawer-wrapper .menu {position: relative;top: 50px;padding: 0;}
.up-drawer-wrapper .menu li {padding: 0px;}
.up-drawer-wrapper .menu li a{ display: flex;gap: 20px; align-items: center; width: 100%;padding: 12px 10px 12px 25px;text-decoration: none;color: #fff; }
.up-drawer-wrapper .menu li.active a{background-color: #2dbfb6; }
.up-drawer-wrapper .sidebar-icon{padding-right: 10px; width: 30px;}
.up-drawer-wrapper a {font-size: 20px; font-weight: 400;} 

/* up-navbar css start */
.up-navbar{display: none;}
.nav-bar{background-color: #fff;min-height: 91px;}
.nav-bar .header-container{margin-left: 40px;margin-right: 80px;}
.header-user-noti {display: flex;align-items: center;gap: 5px;}
.header-user-noti .notification{width: 40px; height: 40px;border-radius: 50%;background-color: #f2f2f2;display: flex;justify-content: center;align-items: center;}
.header-wrapper{display: flex; width: 100%; justify-content: space-between;align-items: center;min-height: 91px;}
.search-field{width: 100%;max-width: 990px;position: relative;}
.search-field span{ position: absolute; transform: translate(10px, 10px);}
.search-field input{width: 100%;border-radius: 10px;background-color: #F3F4F6;border: none;height: 42px;outline: none;padding: 0 50px;}
.column-wrapper{display: flex;justify-content: space-between}
.column-wrapper .col-md-6{width: 48%}
.header-wrapper .page-title h3{font-weight: 600}
.profile-wrapper{display: flex;justify-content: space-between;padding: 10px 20px;position: absolute;bottom: 10px;width: 100%;}
.profile-wrapper .user-wrapper{display: flex;gap: 15px;}
.profile-wrapper .user-wrapper {display: flex;align-items: center;}
.profile-wrapper .options {position: relative;cursor: pointer;}
.profile-wrapper .dropdown-menu {display: none;position: absolute;bottom: 30px;right: 0;background-color: white;border: 1px solid #ccc;border-radius: 5px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);z-index: 1000;}
.profile-wrapper .dropdown-menu a {display: block;padding: 10px;color: #333;text-decoration: none;font-size: 14px}
.profile-wrapper .dropdown-menu a:hover {background-color: #f4f4f4;}


/* login page */
.login-page .login-form-wrapper{display: flex;flex-direction: column;justify-content: center;align-items: center;height: 100vh}
.login-page .login-image {position: relative;border-bottom-right-radius:200px;  background-image: url(./Image\ hs.png); background-size: cover; background-position: 50%; background-repeat: no-repeat; flex-shrink: 1; flex-basis: 50%; height: 100vh; flex-grow: 1; max-width: 100%; }
.login-page .login-image .copyright{position: absolute;bottom:10px ;left: 60px;font-weight: 500;color: #fff}
.login-page .login-block { padding: 15px; max-width: 550px; width: 100%;}
.login-page .login-form{display: flex;flex-direction: column;justify-content: space-between;min-height: 425px;}
.login-page .login-form h4{font-weight:bold ; padding-bottom: 15px;}
.login-page .login-form-child-wrapper label{font-weight: 500;color: #828282;padding-bottom: 10px}
.login-page .login-form-child-wrapper .login-email{padding-bottom: 32px;}
.login-page .password-options{display: flex;justify-content: space-between;}
.login-page .password-options .remember-wrapper{display: flex;gap: 10px;}
.login-page .password-options a{color: #2DBFB5}
.login-page .register-wrapper{display: flex;align-items: flex-start;}

/* register page */
.register-page .register-form-wrapper{display: flex;flex-direction: column;justify-content: center;overflow: auto;margin-top: 100px;}
.register-page .register-image {position: sticky;top:0px;border-bottom-right-radius:200px;  background-image: url(./Image\ hs.png); background-size: cover; background-position: 50%; background-repeat: no-repeat; flex-shrink: 1; flex-basis: 50%; height: 100vh; flex-grow: 1; max-width: 100%; }
.register-page .register-image .copyright{position: absolute;bottom:10px ;left: 60px;font-weight: 500;color: #fff}
.register-page .register-block {padding: 15px; max-width:800px; width: 100%;}
.register-page .register-form h4{font-weight:bold ; padding-bottom: 8px;}
.register-page .register-form .custom-wrapper{margin-top: 32px;}
.register-page .register-form-child-wrapper label{font-weight: 500;color: #828282;padding-bottom: 10px}
.register-page .captcha-wrapper .captcha-img{position: relative;}
.register-page .captcha-verify img{height: 40px;width: 120px;position: absolute;top: 0}
.register-page .error-message {color: rgb(143, 37, 1);font-size:small;display: inline; font-weight: bold;}

/* update profile */
.update-profile-page .profile-section{display: none}
.update-profile-page .profile-section.show{display: block}
.update-profile-page .change-password-section{display: none}
.update-profile-page .change-password-section.show{display: block}
.update-profile-page .side-menu ol{list-style: none;pointer-events: all;cursor: pointer;}
.update-profile-page .side-menu li{height: 40px;padding: 8px 20px;width: 100%;max-width: 200px;border: 1px solid #f2f2f2;white-space: nowrap;}
.update-profile-page .side-menu li.active{background-color: #f2f2f2;border: none;border-left: 3px solid #2DBFB5}

/* bank information */
.bank-information-page .start-date .cal .ajax__calendar_container,
.bank-information-page .end-date .cal .ajax__calendar_container{background: #fff;border-radius: 8px;border: 1px solid #d2d2d2}
.bank-information-page .account-type{display: flex;gap: 100px;}
.bank-information-page .account-type .account-type-wrapper{display: flex;justify-content: space-between;width: 300px;}
.bank-information-page .account-type .account-type-wrapper input[type="radio"] {accent-color:#3f9791;}
.bank-information-page .dollar-wrapper{position: relative;}
.bank-information-page .dollar-sign{position: absolute;top: 8px;left: 5px;}
.bank-information-page .disclaimer p {color: #2D3748;font-weight:500;}
.bank-information-page .save-btn-wrapper{display: flex;justify-content: flex-end}

/* enroll family */
.enroll-family-page .existing-family-table tr{border: 1px solid rgb(189 189 189 / 20%)}
.enroll-family-page .existing-family-table .tableHeaderBar th{background-color: rgb(189 189 188 / 20%); color:#828282;padding: 15px 40px;}
.enroll-family-page .existing-family-table td{padding: 15px 40px;color: #333333;font-weight: 500}
.enroll-family-page .page-head{display: flex;justify-content: space-between;align-items: baseline;}
.enroll-family-page .page-head .add-member-wrapper{width: 200px}
.enroll-family-page .action { position: relative; display: inline-block; }
.enroll-family-page .options { cursor: pointer; }
.enroll-family-page .dropdown-content { display: none; position: absolute; background-color: #fff; min-width: 160px; box-shadow: 0px 8px 16px 0px #ddd6d6; z-index: 1;border-radius: 10px }
.enroll-family-page .dropdown-content a { color: #2C4351; padding: 12px 16px; text-decoration: none; display: block;border-radius: 10px }
.enroll-family-page .dropdown-content a:hover { background-color: #f1f1f1; }

/* service request */
.service-request-page .user-information{border-bottom: 1px solid #EBEBEB}
.service-request-page .user-information label{width: 200px;color: #2D3748}
.service-request-page .user-information span{color: #2D3748;font-weight: 600}
.service-request-page .family-table tr{border: 1px solid rgb(189 189 189 / 20%)}
.service-request-page .family-table .tableHeaderBar th{background-color: rgb(189 189 188 / 20%); color:#828282;padding: 15px 40px;white-space: nowrap;}
.service-request-page .family-table td{padding: 15px 40px;color: #333333;font-weight: 500}
.service-request-page .family-table a{color: #2DBFB5;text-decoration: underline !important;}
.service-request-page .account-info .custom-fields{width: 150px}
.service-request-page .lum-sum-withdraw,
.service-request-page .lum-sum-deposit{display: flex;align-items: center}
.service-request-page .lum-sum-withdraw .lum-sum-withdraw-wrapper,
.service-request-page .lum-sum-deposit .lum-sum-deposit-wrapper{position: relative;}
.service-request-page .lum-sum-withdraw .lum-sum-withdraw-wrapper span.dollar-sign,
.service-request-page .lum-sum-deposit .lum-sum-deposit-wrapper span.dollar-sign{position: absolute;top: 8px;left: 10px;}
.service-request-page .lum-sum-withdraw .lum-sum-withdraw-wrapper input,
.service-request-page .lum-sum-deposit .lum-sum-deposit-wrapper input{margin-left: 4px;padding-left: 20px}
.service-request-page .submit-wrapper input{width: 200px;margin-top: 10px}

/* contact Us Page */
.contact-us-page .cust-container{max-width: 615px;}
.contact-us-page .title h6{font-weight: 600;}

/* transaction-page */
.transection-page .container{max-width: 100%;}
.transection-page .data-table-wrapper{background: #fff;padding: 45px 25px;display: flex;width: 100%;border-radius: 8px;}
.transection-page .family-table-wrapper{background: #fff;padding: 45px 25px;display: flex;width: 100%; border-radius: 8px}
.transection-page .parent-table th{text-align: center;}
.transection-page .parent-table td{text-align: center;}
.transection-page .parent-table .data-table tr,
.transection-page .parent-table .family-table tr{border: 1px solid #f2f2f2;border-radius: 10px}
.transection-page .parent-table .data-table tr.tableHeaderBar,
.transection-page .parent-table .family-table tr.tableHeaderBar{border: none}
.transection-page .parent-table .data-table td,
.transection-page .parent-table .family-table td{padding: 23px 43px}
.transection-page .parent-table td.balance{gap: 0;justify-content:center;}
.transection-page .parent-table td.name,
.transection-page .parent-table h2.family-title{text-align: left}
.transection-page .parent-table .tableHeaderBar th{background: #F2F2F2;padding: 15px 40px; color: #828282;font-weight: 600}
.transection-page .parent-table .tableHeaderBar th:first-child{border-top-left-radius: 10px}
.transection-page .parent-table .tableHeaderBar th:last-child{border-top-right-radius: 10px}
.transection-page .parent-table .name,
.transection-page .parent-table .balance{display: flex;align-items: center;gap: 10px}
.transection-page .transection-overflow-wrapper{overflow: auto}
div.dt-container select.dt-input{margin-right: 20px}
/* datatable */
.transection-page div.dt-container .dt-paging .dt-paging-button:active{background: #19658f !important; color: #fff !important;border: none !important;outline: none !important}
.transection-page div.dt-container .dt-paging .dt-paging-button.current, div.dt-container .dt-paging .dt-paging-button.current:hover{background: #19658f !important; color: #fff !important;border: none !important;outline: none !important}
.transection-page div.dt-container .dt-paging .dt-paging-button:hover{background: #19658f !important;border: none !important;outline: none !important}
table.dataTable th.dt-type-numeric, table.dataTable th.dt-type-date, table.dataTable td.dt-type-numeric, table.dataTable td.dt-type-date{text-align: center !important;}

.dash-data #LandingTansactiondata-table th{
    background-color: #19658f;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    padding: 11px 30px 11px 30px;
}

.dash-data-wrapper {
    width: 100%;
    border-radius: 20px;
    margin: 0 auto;
}
.dash-data #LandingTansactiondata-table td {
    padding: 10px 30px 10px 30px;
    font-size: 20px;
    color: #000;
    font-weight: 400;
    background-color: #fff;
    border-bottom: 1px solid #E7E7E7;
}

.dash-data #LandingTansactiondata-table .grand-total-tr td{
    font-weight: 800;
    border-top: 2px solid #000;
    border-bottom: 2px solid #000;
}

.verify-page .login{gap:30px; position: absolute;top: 50%; right: 0; left: 50%; bottom: 0; transform: translate(0, -50%); z-index: 999;display: flex;flex-direction: column;justify-content: center;align-items: center;}
.verify-page .login a{width: 50%;background-color: #2DBFB5;border-radius: 8px;text-align: center;outline: none;min-height: 50px;color: #fff;border: none;font-size: 20px;display: flex;justify-content: center;align-items: center;}
.verify-page .side-bar{display: none}
.verify-wrapper{ position: absolute;top: 50%;left: 50%;right: 0;bottom: 0;transform: translate(0px, -50%);display: flex;justify-content: center;}