@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');

@font-face {
     font-family: 'Euclid Circular A';
     src: url('../fonts/EuclidCircularA-Regular.woff2') format('woff2'),
          url('../fonts/EuclidCircularA-Regular.woff') format('woff');
     font-weight: normal;
     font-style: normal;
     font-display: swap;
}

@font-face {
     font-family: 'Euclid Circular A';
     src: url('../fonts/EuclidCircularA-Medium.woff2') format('woff2'),
          url('../fonts/EuclidCircularA-Medium.woff') format('woff');
     font-weight: 500;
     font-style: normal;
     font-display: swap;
}


/* Custom Reset */
body {
     font-family: "DM Sans", sans-serif;

}



.wrapper {
     overflow: hidden;
}

a.active,
a:focus,
button:focus,
button.active {
     outline: none;
     font-size-adjust: none;
}

a {
     text-decoration: none;
     transition: all 0.5s ease-in-out;
}

a:focus,
a:hover,
a:active {
     outline: 0;
     box-shadow: none;
}

a:focus,
a:hover {
     text-decoration: none;
}

h1,
h2,
h3,
h4,
h5,
h6 {
     margin: 0;
     padding: 0;
}

a {
     text-decoration: none;
     transition: all 0.5s ease-in-out;
}

a:hover {
     text-decoration: none;
}

ul,
ol {
     margin: 0;
     padding: 0;
     list-style: none;
}

ul li {
     list-style: none;
}

p {
     margin: 0;
     padding: 0;
}

input:focus,
select:focus,
textarea:focus {
     outline: none;
     font-size-adjust: none;
}

img {
     border-style: none;
     display: inline-block;
     max-width: 100%;
     height: auto;
}

* {
     box-sizing: border-box;
}

/* sidebar*/
.sidebar {
     position: fixed;
     height: calc(100vh - 44px);
     border-radius: 10px;
     background: #1B3139;
     max-width: 288px;
     width: 100%;
     padding: 28px 22px 36px 15px;
     overflow-y: hidden;
     z-index: 999;
}

.mian {
     padding: 22px 24px;
     background: #E9E8EB;
     min-height: 100vh;
}

header .navbar {
     padding: 27px 0px;
}

.navbar-brand {
     padding: 0;
     margin: 0 17px 0 0px;
}

.sidebar-logo {
     margin-left: 34px;
     margin-bottom: 24px;
}

.sidebar-inner .nav-link.active {
     background-color: #FFFFFF;
     border-radius: 10px;
     color: #1B3139;
     font-weight: 600;
}

.sidebar-inner .nav-link {
     color: rgba(255, 255, 255, 0.80);
     font-size: 16px;
     font-style: normal;
     font-weight: 400;
     padding: 18px;
     width: 100%;
     display: flex;
     align-items: center;
     grid-gap: 11px;
     line-height: normal;
}

.history-box h6 {
     color: #FFF;
     font-size: 16px;
     font-weight: 500;
     line-height: normal;
}

.history-box {
     padding: 18px;
}

.document-history {
     display: flex;
     align-items: start;
     grid-gap: 8px;
     margin-top: 14px;
}

.document-history h4 {
     color: #FFF;
     font-size: 16px;
     font-weight: 400;
     margin-bottom: 2px;
     line-height: normal;
}

.document-history span {
     color: #BCBCBC;
     font-size: 14px;
     font-weight: 400;
     line-height: normal;
}

.sidebar-inner {
     overflow-y: scroll;
     height: calc(100vh - 90px);
}

.sidebar-inner::-webkit-scrollbar {
     display: none;
}

.sidebar-inner {
     -ms-overflow-style: none;
     scrollbar-width: none;
}

.topbar {
     position: fixed;
     top: 22px;
     border-radius: 10px;
     background: #FFF;
     right: 24px;
     padding: 18px 40px 18px 24px;
     width: calc(100% - 352px);
     display: flex;
     align-items: center;
     justify-content: space-between;
     z-index: 2;
}

.chat-box:hover,
.btn-pdf:hover {
     opacity: 0.7;
     color: #fff;
}

.chat-left-box .nav-pills .nav-link:hover {
     background: rgba(255, 72, 0, 0.60);
}

.chat-box {
     border-radius: 6px;
     background: #FF6B30;
     grid-gap: 6px;
     padding: 14px 30px 14px 28px;
     display: flex;
     align-items: center;
     color: #FFF;
     font-size: 14px;
     font-weight: 600;
     line-height: normal;
}

.balance-box {
     border-radius: 6px;
     padding: 11px 14px;
     display: flex;
     align-items: center;
     grid-gap: 6px;
     background: rgba(255, 127, 77, 0.20);
}

.balance-box h6 {
     color: #1C1C1C;
     font-size: 14px;
     font-weight: 400;
     line-height: normal;
}

.balance-box h6 span {
     color: #FF4800;
     font-weight: 600;
}

.recycle-box {
     background: #FF4800;
     width: 26px;
     height: 26px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
}

.avatar-menu {
     display: flex;
     align-items: center;
     grid-gap: 8px;
}

.avatar-menu .avatar {
     color: #FFF;
     font-size: 18px;
     font-weight: 600;
     background-color: #1B3139;
     width: 48px;
     height: 48px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
}

.avatar-menu h6 {
     color: #000;
     font-size: 14px;
     font-weight: 600;
     line-height: normal;
}

.avatar-menu span {
     color: #535353;
     font-size: 12px;
     font-weight: 400;
     line-height: normal;
}

.right-nav {
     display: flex;
     align-items: center;
     grid-gap: 16px;
}

.right-content {
     width: calc(100% - 306px);
     margin-left: auto;
     padding-top: 100px;
}

.pdf-box-wrapper-copy {
     display: flex;
     grid-gap: 14px;
}

.pdf-box-wrapper {
     display: flex;
     grid-gap: 14px;
     height:100%;
     width:100%;
}


.pdf-box-left {
     width: 60%;
     height: 100%;
     border-radius: 10px;
     background: #FFF;
     padding: 31px 30px;
}

.pdf-box-left-heading {
     display: flex;
     align-items: center;
     justify-content: space-between;
     border-bottom: 1px solid #FFD2BE;
     padding-bottom: 12px;
}

.pdf-box-left-heading .dropdown-toggle::after {
     content: none;
}

.pdf-box-left-heading .dropdown-toggle {
     width: 30px;
     height: 30px;
     border: 1px solid #D6E4FF;
     border-radius: 6px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.pdf-box-left-heading h2 {
     color: #000;
     font-size: 18px;
     font-weight: 600;
     line-height: normal;
}

.chat-right {
     max-width: 284px;
     display: flex;
     align-items: start;
     grid-gap: 8px;
     margin-left: auto;
}

.pdf-box {
     border-radius: 11px;
     border: 1px solid #C8C8C8;
     padding: 13px 30px 13px 17px;
     display: flex;
     align-items: center;
     grid-gap: 11px;
}

.pdf-icon-box {
     width: 40px;
     height: 40px;
     border-radius: 6px;
     display: flex;
     align-items: center;
     justify-content: center;
     background-color: #FCE9EA;
}

.avatar-img {
     width: 40px;
     height: 40px;
     border-radius: 50%;
}

.pdf-left-body {
     padding-top: 24px;
}

.chat-left-box-copy {
     border-radius: 11px;
     background: #FFF6F2;
     /*max-width: 100%;*/
     max-width: 562px;
     padding: 24px 30px 39px 18px;
     margin-top: 20px;
}

.chat-left-box {
     border-radius: 8px; /* Smaller corner radius */
     background: #FFF6F2; /* Keep the same background color */
     max-width: 95%; /* Use more of the screen's width */
     padding: 16px 20px 20px 14px; /* Reduced padding */
     margin-top: 15px; /* Reduce the margin above the box */
     font-size: 14px; /* Slightly smaller text for better spacing */
     line-height: 1.5; /* Maintain good readability */
 }

.ace-logo {
     border-radius: 40px;
     background: rgba(255, 72, 0, 0.14);
     width: 40px;
     height: 40px;
     display: flex;
     align-items: center;
     justify-content: center;
     grid-gap: 7px;
}

.chat-top {
     display: flex;
     align-items: center;
     grid-gap: 7px;
}

.chat-top span {
     color: #1C1C1C;
     font-size: 14px;
     font-weight: 500;
     line-height: normal;
}

.chat-left-box p {
     color: #545454;
     font-size: 14px;
     font-weight: 400;
     line-height: 143.773%;
     margin: 10px 0px;
}

.chat-left-box .nav-pills {
     grid-gap: 11px;
     flex-wrap: nowrap;
}

.file-overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(255, 255, 255, 0.8);
     border-radius: 12px;
     z-index: 10;
     display: flex;
     justify-content: center;
     align-items: center;
     opacity: 1;
     transition: opacity 0.5s ease-in-out;
}

.file-overlay.hidden {
     opacity: 0;
     pointer-events: none;
     /* Disable interaction when hidden */
}

.file-overlay img {
     width: 100px;
}

.pdf-content {
     opacity: 0;
     transition: opacity 0.5s ease-in-out;
}

.pdf-content.visible {
     opacity: 1;
}

@keyframes dotsAnimation {
     0% {
          content: '.';
     }

     33% {
          content: '..';
     }

     66% {
          content: '...';
     }

     100% {
          content: '.';

     }
}

.dots {
     animation: dotsAnimation 1s steps(3, end) infinite;
}


.pdf-box-right p {
     color: #545454;
     font-size: 14px;
     font-weight: 400;
     line-height: 143.773%;
}

.chat-left-box .nav-pills .nav-link {
     color: #FFF;
     font-size: 14px;
     font-weight: 500;
     line-height: normal;
     border-radius: 6px;
     background: rgba(255, 72, 0, 0.20);
     padding: 13px 20px;
}

.chat-left-box .nav-pills .nav-link.active {
     background: rgba(255, 72, 0, 0.80);
     color: #FFF;

}

.pdf-box-right {
     border-radius: 10px;
     background: #FFF;
     padding: 29px 20px 30px;
     width: 40%;
     display: flex;
     align-items: center;
     justify-content: center;
}



.hamburger-menu {
     display: none;
}

.pdf-box-right h4 {
     color: #FF4800;
     font-size: 20px;
     font-weight: 600;
     line-height: normal;
     margin-bottom: 10px;
}

.pdf-box-right h4 span {
     color: #1C1C1C;
}

.pdf-box-right .btn-pdf {
     margin-top: 33px;
}

.btn-pdf {
     color: #FFF;
     font-size: 16px;
     font-weight: 500;
     line-height: normal;
     border-radius: 6px;
     background: rgba(255, 72, 0, 0.80);
     padding: 15px 24px;
}

.question-box {
     height: 100%;
     display: flex;
     align-items: center;
     justify-content: center;
     flex-direction: column;
}

.question-box h4 {
     margin-top: 25px;
}

.btn-send {
     background: rgba(255, 72, 0, 0.14);
     width: 44px;
     height: 44px;
     display: flex;
     align-items: center;
     justify-content: center;
     position: absolute;
     top: 50%;
     transform: translate(0, -50%);
     right: 20px;
}

.pdf-box-left form {
     position: relative;
     margin-top: 110px;
}

.pdf-box-left form .form-control {
     border-radius: 10px;
     border: 1px solid #FFE1D4;
     background: #F9F9F9;
     color: #1C1C1C;
     font-size: 16px;
     font-weight: 400;
     line-height: normal;
     height: 71px;
     padding-left: 25px;
}

.pdf-box-left form .form-control::placeholder {
     color: #1C1C1C;
}

.sidebar.open {
     left: 14px;
}

.profile-box {
     border-radius: 10px;
     background: #FFF;
     padding: 34px 30px;
}

.text-box h2 {
     color: #000;
     font-size: 18px;
     font-weight: 600;
     line-height: normal;
     margin-bottom: 4px;
}

.profile-box p {
     color: #717171;
     font-size: 16px;
     font-weight: 400;
     line-height: 30px;
     /*text-transform: capitalize;*/
     text-transform: none;
}

.avatar-box {
     position: relative;
     max-width: 110px;
     margin: 24px auto 0;
}

.edit-box {
     background-color: #FF4800;
     width: 30px;
     height: 30px;
     border-radius: 50%;
     position: absolute;
     bottom: 0px;
     right: 0px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.profile-img {
     width: 110px;
     height: 110px;
     border-radius: 50%;
}

.form {
     max-width: 682px;
     margin: 32px auto;
}

.form label {
     color: #313131;
     font-size: 14px;
     font-weight: 400;
     line-height: 20px;
     /*text-transform: capitalize;*/
     text-transform: none;
     margin-bottom: 6px;
}

.form .form-control {
     color: #000;
     font-size: 14px;
     font-weight: 400;
     line-height: 42px;
     /*text-transform: capitalize;*/
     text-transform: none;
     border-radius: 6px;
     background-color: #F5F5F5;
     height: 60px;
     padding: 20px 24px;
     border: none;
}

.form-select {
     background-image: url(/static/images/drop-arrow.svg);
     background-size: 12px;
}

.form .input-box {
     position: relative;
}

.form .form-group {
     margin-bottom: 28px;
}

.form .msg-input {
     height: 161px;
     padding: 10px 24px !important;
}

.profile-box .btn-pdf {
     background-color: #FF4800;
     padding: 15px 33px;
}

.contact-box .form .form-check-input {
     width: 24px;
     margin-left: 0;
     height: 24px;
}

.contact-box .form-check {
     display: flex;
     padding-left: 0px;
     grid-gap: 12px;
}

.contact-box .form-check label {
     flex: 1;
}

.form .input-box .img-holder {
     position: absolute;
     top: 50%;
     transform: translate(0, -50%);
     right: 24px;
}

.left-side {
     border-radius: 10px 0px 0px 10px;
     background: rgba(255, 210, 192, 0.20);
     padding: 38px 24px;
     max-width: 252px;
}

.left-side a {
     display: flex;
     align-items: center;
     grid-gap: 13px;
     color: #000;
     font-size: 14px;
     font-weight: 400;
     line-height: normal;
     width: 100%;
     padding: 0px 12px 0px 15px;
     margin-bottom: 22px;
}

.left-side a.active {
     border-radius: 8px;
     background: rgba(255, 109, 51, 0.20);
     padding: 15px 12px 15px 15px;
     margin-bottom: 14px;
}

.notifaction-page .profile-box {
     padding: 0px;
}

.notifaction-box {
     display: flex;
}

.right-side {
     padding: 40px 80px 57px 55px;
     flex: 1;
}

.notifaction-toggle {
     display: flex;
     align-items: center;
     justify-content: space-between;
     padding: 16px 12px 16px;
     border-bottom: 1px dotted #CACACA;
}

.notifaction-toggle:last-child {
     border-bottom: none;
}

.notifaction-toggle h6 {
     color: #000;
     font-size: 14px;
     font-weight: 500;
     line-height: normal;
     margin-bottom: 3px;
}

.notifaction-toggle .form-switch .form-check-input {
     width: 44px;
     height: 26px;
}

.notifaction-toggle .form-check-input {
     background-color: #BCBCBC;
     border-color: #BCBCBC;
     background-image: url(/static/images/circle.svg);
     background-size: 20px;
     background-position: 3px;

}

.form-switch .form-check-input:focus {
     background-image: url(/static/images/circle.svg);
     background-size: 20px;
}

.form-switch .form-check-input:checked[type=checkbox] {
     background-image: url(/static/images/circle.svg);
     background-size: 20px;
     background-position: 20px center;
}

.form-check-input:checked {
     background-color: #FF4800;
     border-color: #FF4800;

}

.notifaction-toggle .form-check {
     margin: 0;
     padding: 0;
     min-height: auto;
}

.notifaction-toggle p {
     color: #5C5C5C;
     font-size: 12px;
     font-weight: 400;
     line-height: 21px;
     /*text-transform: capitalize;*/
     text-transform: none;
}

.activity-page .form-group .form-control {
     border-radius: 9px;
     background: #F0EDED;
     color: #3C3C3C;
     font-size: 16px;
     font-weight: 400;
     height: 60px;
     max-width: 464px;
     width: 100%;
     padding-left: 50px;
     line-height: normal;
     border: none;
}

.activity-page .form-group {
     position: relative;
     flex: 1;
}

.activity-page form {
     margin-bottom: 20px;
}

.activity-page .profile-box .form-select {
     color: #000;
     font-size: 14px;
     font-weight: 500;
     border-radius: 5px;
     border: 1px solid #D6E4FF;
     height: 50px;
     padding: 16px 20px;
     max-width: 134px;
}

.activity-page .form-group .img-holder {
     position: absolute;
     top: 50%;
     transform: translate(0, -50%);
     left: 23px;
}

.activity-page .form-group .form-control::placeholder {
     color: #3C3C3C;
}

.activity-page .profile-box form {
     display: flex;
     align-items: center;
     justify-content: space-between;
}

.text-box h4 {
     color: #000;
     font-size: 16px;
     font-weight: 500;
     line-height: normal;
}

.document-activity-history {
     display: flex;
     align-items: start;
     grid-gap: 7px;
     border-bottom: 1px dotted #CACACA;
     padding: 16px 0px;
}

.document-activit-wrapper {
     overflow-y: scroll;
     height: calc(100vh - 320px);
     padding-right: 20px;
}

.document-activit-wrapper::-webkit-scrollbar {
     width: 4px;
}

.document-activit-wrapper::-webkit-scrollbar-track {
     background: #f9f7f4;
}

.document-activit-wrapper::-webkit-scrollbar-thumb {
     background: #ff360b;
}

.password-page form {
     max-width: 444px;
     margin: 24px auto 0px;
}

.document-activity-history p {
     color: #525252;
     font-size: 14px;
     margin-top: 2px;
     font-weight: 400;
     line-height: normal;
}

/* home-page */
.navbar-nav .nav-item .nav-link {
     color: #535353;
     font-size: 16px;
     font-weight: 400;
     line-height: normal;
     padding: 0px 17px;
     position: relative;
}

header {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
}

.navbar-nav .nav-item .nav-link.active img {
     display: block;
     margin-top: 3px;
     position: absolute;
     right: 14px;
}

.navbar-nav .nav-item .nav-link.active {
     color: #FF3621;
     font-weight: 700;
}

.right-nav .dropdown-toggle::after {
     content: none;
}

.nav-right {
     display: flex;
     align-items: center;
     margin-left: auto;
     grid-gap: 24px;
}

.nav-right .btn-pdf {
     padding: 14px 22px;
}

.bg-orange-dark {

     background: #FF4800;
}

.link {
     color: #535353;
     font-size: 16px;
     font-weight: 500;
     line-height: normal;
}

.text-box h1 {
     color: #535353;
     font-size: 60px;
     font-weight: 700;
     line-height: 125.096%;
     letter-spacing: -1.2px;
}

.text-box h1 span {
     color: #FF4800;
}

.hero-sec .text-box p {
     margin: 8px 0px 16px;
}

.hero-sec ul {
     display: flex;
     align-items: center;
     grid-gap: 14px;
}

.text-description {
     color: #535353;
     font-size: 18px;
     font-weight: 400;
     line-height: 137.582%;
}

.hero-sec ul li a {
     font-size: 18px;
     font-weight: 500;
     line-height: normal;
     border-radius: 5px;
}

.hero-sec .text-box {
     max-width: 670px;
}

.hero-sec .text-box p {
     max-width: 550px;
}

.btn-default {
     padding: 16px 27px;
     color: #FF4800;
     background: rgba(255, 72, 0, 0.10);
}

.hero-sec {
     padding: 167px 0px 94px;
     background-image: url(/static/images/hero-bg.png);
     background-repeat: no-repeat;
     background-size: cover;
}

.logo-sec .image-holder {
     background-color: #F5F5F5;
     border-radius: 10px;
     display: flex;
     align-items: center;
     justify-content: center;
     height: 94px;
}

.logo-sec {
     padding: 34px 0px 54px;
}

.image-wrapper {
     position: relative;
}

.image-wrapper .img-holder {
     position: absolute;
     bottom: -31px;
     right: -12px;
}

.about-sec .title span {
     color: #FF3621;
     font-size: 24px;
     font-weight: 500;
     line-height: 32px;
     /*text-transform: capitalize;*/
     text-transform: none;
}

.title h2 {
     color: #535353;
     font-size: 40px;
     font-weight: 700;
     line-height: 42px;
     /*text-transform: capitalize;*/
     text-transform: none;
}

.about-sec .title h2 {
     margin-bottom: 11px;
}

.divider {
     max-width: 155px;
     text-align: end;
}

.title p {
     color: #737373;
     font-family: 'Euclid Circular A';
     font-size: 20px;
     font-weight: 400;
     line-height: 31px;
}

.about-sec {
     padding-bottom: 95px;
}

.title h6 {
     color: #FF3621;
     font-size: 20px;
     font-weight: 500;
     line-height: 42px;
     margin-top: 11px;
}

.title ul {
     margin-top: 16px;
}

.title ul li {
     display: flex;
     align-items: start;
     grid-gap: 11px;
     margin-bottom: 16px;
}

.title h4 {
     font-size: 28px;
     font-weight: 500;
     line-height: 45px;
     color: #535353;
}

.product-sec {
     background: #1B3139;
     padding: 38px 0px 48px;
}

.product-sec .title {
     max-width: fit-content;
     margin: 0 auto;
}

.product-sec .nav-pills {
     grid-gap: 28px;
     justify-content: center;
     margin: 20px 0px 25px;
}

.product-sec .nav-pills .nav-link {
     color: #1B3139;
     font-size: 22px;
     font-weight: 500;
     line-height: 42px;
     /*text-transform: capitalize;*/
     text-transform: none;
     border-radius: 8px;
     background: rgba(255, 255, 255, 0.30);
     min-width: 192px;
     width: 100%;
     height: 66px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.product-sec .nav-pills .nav-link.active,
.product-sec .nav-pills .nav-link:hover {
     background: #FFF;
}

.product-box {
     border-radius: 15px;
     padding: 30px 36px 30px 36px;
     border: 1px solid rgba(255, 255, 255, 0.40);
     background: rgba(255, 255, 255, 0.20);
     display: flex;
     align-items: center;
     grid-gap: 28px;
}

.product-box-right {
     flex: 1;
}

.product-box-right h4 {
     color: #FFF;
     font-size: 24px;
     font-weight: 700;
     line-height: 20px;
}

.product-box .body-text {
     margin: 8px 0px 14px;
}
.product-hero .text-box h2 {
     color: #000;
     font-size: 40px;
     font-weight: 700;
     line-height: 136.697%;
}

.product-hero .text-box h2 span {
     color: #FF4800;

}

.product-hero-2 {
     background-color:#F5F5F5; ;
     background-repeat: no-repeat;
     background-size: cover;
     padding: 202px 0px 147px;
}

.product-hero-2 .text-box h2 {
     color: #000;
     font-size: 40px;
     font-weight: 700;
     line-height: 136.697%;
}

.product-hero-2 .text-box h2 span {
     color: #FF4800;

}

.body-text p {
     color: #FFF;
     font-family: "Euclid Circular A";
     font-size: 18px;
     font-weight: 400;
     line-height: 30px;
}

.body-text ul li {
     list-style-type: disc;
     color: #FFF;
     margin-left: 20px;
}

.btn-list {
     display: flex;
     grid-gap: 18px;
     align-items: center;
}

.btn-list .btn-pdf {
     background: #FFF;
     color: #1B3139;
     padding: 13px 16px;
}

.btn-list .btn-default {
     color: #FFF;
     background: rgba(255, 255, 255, 0.30);
     padding: 12px 23px;
}

.data-sec {
     background: #F5F5F5;
     padding: 40px 0px 48px;
}

.title h3 {
     color: #535353;
     font-size: 32px;
     font-weight: 700;
     line-height: 42px;
}

.title h3 span {
     color: #FF3621;
}

.title {
     max-width: fit-content;
     margin: 0 auto;
}

.data-card {
     border-radius: 16px;
     margin-top: 30px;
     background: #FFF;
     box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
}

.data-card .img-holder img {
     border-radius: 16px 16px 0px 0px;
}

.data-card-body {
     padding: 12px 22px 22px 20px;
}

.data-card-body p {
     color: #353535;
     font-family: "Euclid Circular A";
     font-size: 18px;
     font-weight: 400;
     line-height: 29px;
     margin-bottom: 10px;
}

.data-card-body span {
     color: #737373;
     font-size: 16px;
     font-weight: 500;
     line-height: 20px;
     /*text-transform: uppercase;*/
     text-transform: none;
}

.ai-sec {
     padding: 36px 0px;
}

.ai-box {
     border-radius: 20px;
     background: rgba(247, 214, 227, 0.64);
     padding: 38px 64px 34px;
     margin-top: 14px;
}

.ai-box .nav-pills .nav-link {
     color: #1B3139;
     font-size: 20px;
     font-weight: 500;
     line-height: 42px;
     text-transform: capitalize;
     padding: 0 13px 3px;
}

.signup-cta p a:hover {
     text-decoration: underline;
}

.ai-box .nav-pills .nav-link.active,
.ai-box .nav-pills .nav-link:hover {
     background-color: transparent;
     color: #FF3621;
     position: relative;
}

.faq-page .nav-link:hover {
     color: #FF3621;
}

.ai-box .nav-pills .nav-link.active::after {
     content: '';
     background-image: url(/static/images/active-line.svg);
     background-size: 100% 100%;
     background-repeat: no-repeat;
     width: 100%;
     height: 10px;
     position: absolute;
     bottom: 0;
     left: 0;
}

.ai-box .nav-pills {
     grid-gap: 6px;
     justify-content: center;
}

.ai-box p {
     color: #000;
     font-size: 16px;
     font-weight: 400;
     line-height: 30px;
}

.ai-box ul {
     margin: 12px 0px 15px;
}

.ai-box ul li {
     display: flex;
     align-items: center;
     grid-gap: 11px;
     margin-bottom: 18px;
}

.ai-box h4 {
     color: #000;
     font-size: 24px;
     font-weight: 700;
     line-height: 32px;
     margin-bottom: 8px;
}

.blog-box {
     border-radius: 19px;
     background: #1B3139;
     margin-top: 24px;
}

.blog-box .image-holder img {
     border-radius: 19px 19px 0px 0px;
}

.blog-box .blog-box-body {
     padding: 18px 21px 21px;
}

.blog-box .blog-box-body p {
     color: #FFF;
     font-size: 18px;
     font-weight: 400;
     line-height: 29px;
}

.blog-box .blog-box-body a {
     font-weight: 600;
     /*text-transform: uppercase;*/
     text-transform: none;
     color: #fff;
}

.blog-box .blog-box-body span {
     color: #D7D7D7;
     font-size: 16px;
     display: block;
     margin-top: 10px;
     font-weight: 500;
     line-height: 20px;
     /*text-transform: uppercase;*/
     text-transform: none;
}

.blog-sec {
     padding: 200px 0px 100px;
}

.blog-sec .principle-box .img-holder {
     margin: -20px -28px 20px;
}

.blog-sec .principle-box h4 {
     margin: 8px 0px 2px;
}

.blog-sec .btn-link {
     margin-top: 12px;
}

.btn-link {
     display: flex;
     align-items: center;
     grid-gap: 16px;
     color: #FF6B30;
     font-size: 18px;
     margin-top: 20px;
     background: transparent;
     border: 0;
}

.modal-2 .modal-dialog {
     max-width: 840px;
}

#uploadButton.loading::after {
     content: '';
     display: inline-block;
     font-size: 24px;
     line-height: 15px;
     width: 22px;
     height: 15px;
     margin-left: 5px;
     background-color: transparent;
     animation: dotsAnimation 1s steps(3, end) infinite;
}

.modal-box {
     display: grid;
     grid-template-columns: 6fr 6fr;
}

.modal-box .title {
     max-width: 100%;
     margin: 0 auto;
     text-align: center;
}

.modal-box .title p {
     font-size: 16px;
     min-height: 90px;
     line-height: 24px;
     min-height: 90px;
     max-width: 297px;
     margin: 0 auto;
}

.modal-content {
     z-index: 99;
}

.right-divider {
     border-right: 1px solid #d5a9a9;
}

.overlay {
     background-color: rgba(0, 0, 0, 0.15);
     position: fixed;
     left: 0;
     top: 0;
     height: 100%;
     width: 100%;
}

.blog-sec .principle-box .img-holder img {
     max-height: 245px;
     min-height: 245px;
     object-fit: cover;
     width: 100%;
     border-top-left-radius: 13px;
     border-top-right-radius: 13px;
     object-position: center;
}

.blog-sec .principle-box {
     padding: 20px 28px 20px;
     margin-bottom: 40px;
     height: auto;
     display: block;
}

.blog-sec .principle-box span {
     font-size: 16px;
     color: #FF6B30;
     font-weight: 500;
}

.case-box {
     border-radius: 20px;
     background: rgba(247, 214, 227, 0.64);
     padding: 45px 34px 47px;
}

.case-box p {
     color: #505050;
     font-size: 16px;
     font-weight: 400;
     line-height: 30px;
}

.blog-sec .title h4 {
     font-weight: 700;
     font-size: 48px;
     margin-bottom: 80px;
}

.case-box-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 10px;
}

.case-box-header h4 {
     color: #000;
     font-size: 24px;
     font-weight: 700;
     line-height: 32px;
}

/* footer */
footer {
     background: #1B3139;
     padding: 44px 0px 42px;
}

footer .text-box {
     max-width: 510px;
     margin: 0 auto;
}

.footer-links {
     padding-top: 24px;
     margin-top: 24px;
     border-top: 1px solid rgba(255, 255, 255, 0.30);
     display: flex;
     justify-content: space-between;
     grid-gap: 24px;
     margin-bottom: 12px;
}

.copy-text p {
     color: #FFF;
     font-size: 14px;
     font-weight: 400;
     letter-spacing: 0.42px;
}

footer .text-box h2 {
     color: #FFF;
     font-size: 48px;
     font-weight: 700;
     line-height: 47px;
}

footer .text-box p {
     color: rgba(255, 255, 255, 0.47);
     font-size: 18px;
     font-weight: 400;
     line-height: 30px;
     margin: 10px 0px;
}

.btn-contact {
     color: #FFF;
     font-size: 16px;
     font-weight: 500;
     border-radius: 5px;
     padding: 12px 23px;
     background: rgba(255, 255, 255, 0.30);
}

.footer-links h5 {
     color: #FFF;
     font-size: 18px;
     font-weight: 700;
     line-height: normal;
     margin-bottom: 5px;
}

.footer-links li a {
     color: rgba(255, 255, 255, 0.80);
     font-size: 16px;
     font-weight: 400;
     line-height: 40px;
     display: block;
}

.social-list {
     display: flex;
     align-items: center;
     justify-content: center;
     grid-gap: 11px;
     margin-top: 11px;
}

.social-list li a {
     border: 1px solid #fff;
     width: 34px;
     height: 34px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
}

/* contact */
.contact-box {
     border-radius: 14px;
     border: 1px solid #FF4800;
     background: rgba(255, 255, 255, 0.20);
     padding: 60px 54px 49px 56px;
}

.contact-sec {
     padding: 116px 0px 54px;
     background-image: url(/static/images/contact-bg.png);
     background-repeat: no-repeat;
     background-size: cover;
}

.contact-box p {
     color: #545454;
     font-size: 14px;
     font-weight: 400;
     line-height: 143.773%;
}

.contact-box h3 {
     margin-bottom: 6px;
}

.contact-box .form .form-control {
     background-color: transparent;
     border: 0.5px solid #B5B5B5;
}

.contact-box .form .btn-pdf {
     background-color: #FF4800;
     padding: 18px 60px;
}

/* product */
.product-hero {
     background-image: url(/static/images/hero-bg.png);
     background-repeat: no-repeat;
     background-size: cover;
     padding: 202px 0px 147px;
}

.product-hero .text-box h2 {
     color: #000;
     font-size: 40px;
     font-weight: 700;
     line-height: 136.697%;
}

.product-hero .text-box h2 span {
     color: #FF4800;

}

.service-box {
     border-radius: 16px;
     border: 1px solid rgb(255, 72, 0, 0.3);
     padding: 43px 58px 43px 36px;
     background: rgba(239, 245, 245, 0.20);
}

.product-hero .text-box p {
     color: #424242;
     font-size: 24px;
     font-weight: 400;
     line-height: 136.697%;
     margin: 6px 0px 20px;
     max-width: 610px;
}

.service-page .text-box h4 {
     color: #3F3F3F;
     font-size: 24px;
     font-weight: 600;
     margin-bottom: 2px;
     margin-top: 24px;
}

.service-page .profile-box {
     padding: 76px 38px 40px;
}

.service-page .text-box p {
     color: #383838;
}

.service-box .title h4 {
     margin: 14px 0px 6px;
     font-weight: 700;
     max-width: 512px;
     line-height: 119%;
}

.service-box .title p {
     font-family: "DM Sans", sans-serif;
     max-width: 563px;
}

.service-box {
     margin-top: 40px;
}

.service-title-box {
     border-radius: 31px;
     background: rgba(255, 72, 0, 0.10);
     color: #FF4800;
     font-size: 16px;
     font-weight: 600;
     line-height: 42px;
     /*text-transform: capitalize;*/
     text-transform: none;
     padding: 7px 23px;
     max-width: fit-content;
}

.work-box {
     background-image: url(/static/images/work-bg.png);
     background-repeat: no-repeat;
     background-size: 100% 100%;
     padding: 0px 126px 0px 70px;
     display: flex;
     align-items: center;
     justify-content: space-between;
     grid-gap: 40px;
}

.work-box h2 {
     color: #FFF;
     font-size: 36px;
     font-weight: 600;
     line-height: 136.697%;
     margin-bottom: 14px;
     max-width: 504px;
}

.work-sec {
     padding: 64px 0px 70px;
}

.work-box .img-holder {
     margin-bottom: -36px;
}

.work-box .btn-pdf {
     color: #FF692E;

}

.services-box {
     display: grid;
     grid-template-columns: 4fr 4fr 4fr;
     grid-gap: 20px;
     margin-top: 30px;
}

.services-box-docs {
     display: grid;
     /*grid-template-columns: 8fr 8fr 8fr;*/
     grid-gap: 20px;
     margin-top: 30px;
}

.ai-serice-box {
     border-radius: 18px;
     border: 1px solid rgb(255, 72, 0, 0.4);
     background: #F5F5F5;
     padding: 34px 20px 31px;
}

.ai-serice-box h6 {
     color: #3F3F3F;
     font-size: 16px;
     font-weight: 500;
     line-height: normal;
     margin-top: 8px;
}

.top-header {
     display: flex;
     align-items: center;
     grid-gap: 13px;
     justify-content: center;
     border-bottom: 1px solid #FFD2BE;
     padding-bottom: 20px;
     margin-bottom: 15px;
}

.pdf-modal .modal-dialog {
     max-width: 366px;
}

.pdf-modal .modal-content {
     border-radius: 11px;
     border: 1px solid #FF4800;
     background: #FFF;
     box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
}

.top-header .pdf-box {
     border-radius: 8px;
     background: #FCE9EA;
     width: 60px;
     height: 60px;
     display: flex;
     padding: 10px 14px;
     border: none;
     align-items: center;
     justify-content: center;
}

.modal-backdrop {
     background: rgba(255, 255, 255, 0.60);

}

.pdf-modal .modal-body {
     padding: 24px;
}

.pdf-modal h6 {
     color: #1C1C1C;
     font-size: 18px;
     font-weight: 500;
     line-height: normal;
}

.pdf-modal .btn-pdf {
     margin-top: 8px;
     background: rgba(255, 72, 0, 0.80);

}

.topbar .dropdown-menu {
     border-radius: 3px;
     background: #FFF;
     box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);
}

.service-page .profile-box {
     background-image: url(/static/images/lines-shape.png);
     background-repeat: no-repeat;
     background-size: cover;

}

.service-page .profile-box .curve-line img {
     width: 100%;
}

.topbar .dropdown-item {
     color: #000;
     font-size: 14px;
     font-weight: 400;
     line-height: normal;
     display: flex;
     align-items: center;
     grid-gap: 10px;
     padding: 8px 19px;
}

/* login */
.login-wrapper {
     display: flex;
     height: 100vh;
     overflow: hidden;
}

.login-left {
     width: 60%;
     background-image: url(/static/images/login-bg.png);
     background-repeat: no-repeat;
     background-size: cover;
     display: flex;
     align-items: center;
     justify-content: center;
     padding: 0px 38px;
}

.login-right {
     width: 40%;
}

.login-box h2 {
     color: #FFF;
     font-size: 24px;
     font-weight: 700;
     margin: 22px 0px 12px;
}

.login-box h2 span {
     color: #FF4800;
     font-weight: 800;
     background-color: #fff;
     padding: 5px 12px;
     display: inline-block;
}

.login-box p {
     color: #F0F0F0;
     font-size: 16px;
     font-weight: 400;
     line-height: 25px;
     max-width: 505px;
     margin: 0 auto;
}

.swiper-pagination-bullet {
     border-radius: 16px;
     width: 12px;
     height: 12px;
     background-color: rgba(255, 255, 255, 0.40);
     opacity: 1 !important;
}

.swiper-pagination-bullet-active {
     background-color: rgba(255, 255, 255, 1);
     width: 30px;
}

.login-left .swiper-pagination {
     position: static;
     margin-top: 17px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
     -webkit-appearance: none;
     margin: 0;
}

input[type=number] {
     -moz-appearance: textfield;
}

.account-page .login-right {
     justify-content: start;
     width: 40%;
     flex: 0 0 40%;
     max-width: 40%;
     padding: 32px 28px 24px 24px;
     display: block;
     height: auto;
     min-height: 100vh;
     overflow-y: visible;
}

.account-page .login-wrapper {
     height: auto;
     min-height: 100vh;
     overflow: visible;
}

.account-page .form .form-control,
.account-page .form .form-select {
     color: #2f2f2f;
     font-size: 14px;
     line-height: 1.35;
     height: 54px;
     padding: 0 16px;
}

.account-page .form .form-control::placeholder {
     color: #6f6f6f;
     opacity: 1;
}

.account-page .form .form-select {
     padding-right: 40px;
}

.account-page .form .input-box .img-holder {
     right: 16px;
}

.account-page .tab-content,
.account-page .tab-pane {
     width: 100%;
     max-width: 100%;
     overflow-x: hidden;
}

.account-page .form .row {
     --bs-gutter-x: 16px;
     margin-left: 0;
     margin-right: 0;
}

.account-page .form .form-control.is-invalid,
.account-page .form .form-select.is-invalid {
     border-color: #dc3545 !important;
     background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='12 12 24 24'%3e%3ccircle cx='24' cy='24' r='11' fill='none' stroke='%23dc3545' stroke-width='2'/%3e%3cpath fill='%23dc3545' d='M24 8a16 16 0 1 0 0 32 16 16 0 0 0 0-32zm0 30a14 14 0 1 1 0-28 14 14 0 0 1 0 28z'/%3e%3c/svg%3e");
     background-repeat: no-repeat;
     background-position: right calc(0.375em + 0.1875rem) center;
     background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

.account-page .messages {
     margin-bottom: 20px;
}

.account-page .messages .alert {
     border-radius: 8px;
     border: none;
     padding: 12px 16px;
     font-size: 14px;
}

.account-page .messages .alert-error,
.account-page .messages .alert-danger {
     background-color: #f8d7da;
     color: #721c24;
}

.account-page .login-left {
     width: 60%;
     flex: 0 0 60%;
     max-width: 60%;
     padding: 0px 16px;
}

.account-page .login-left .login-box img {
     max-width: 70%;
     height: auto;
     margin: 0 auto;
     display: block;
}

.form-select:focus {
     box-shadow: none;
}

.account-page .form-control .form-select {
     background-color: transparent;
     max-width: fit-content;
     border: none;
}

.login-right {
     padding: 90px 54px 40px 40px;
     display: flex;
     justify-content: center;
     width: 100%;
     flex-direction: column;
     height: 100vh;
     overflow-y: scroll;
}

.login-right::-webkit-scrollbar {
     width: 4px;
}

.login-right::-webkit-scrollbar-track {
     background: #f9f7f4;
}

.login-right::-webkit-scrollbar-thumb {
     background: #ff360b;
}

.login-right h2 {
     color: #3F3F3F;
     font-size: 36px;
     font-weight: 700;
}

.login-heading {
     max-width: fit-content;
     text-align: end;
}

.login-right p {
     color: #505050;
     font-family: "Euclid Circular A";
     font-size: 18px;
     font-weight: 400;
     line-height: 25px;
     max-width: 442px;
}

.login-right span {
     color: #FF4800;
}

.login-right .form {
     width: 100%;
     margin: 18px 0px;
}

.signup-cta p {
     color: #7A7A7A;
     line-height: 42px;
}


.signup-cta p span,
.signup-cta p a {
     color: #FF4800;
     font-weight: 500;
}

.signup-cta {
     margin-top: 10px;
}

.login-right .btn-pdf {
     background: #FF4800;
     padding: 28px 10px;
     width: 100%;
     margin-top: 16px;
}

.login-right .link {
     font-weight: 400;
     color: #464646;
     font-family: "Euclid Circular A";
}

.login-right .form .form-group {
     margin-bottom: 18px;
}

.login-right .nav-item {
     width: 50%;
}

.login-right .nav-pills {
     grid-gap: 24px;
     flex-wrap: nowrap;
     margin-top: 17px;
}

.login-right .nav-pills .nav-link {
     border-radius: 10px;
     background: #F5F5F5;
     display: flex;
     align-items: center;
     justify-content: center;
     grid-gap: 10px;
     color: #707070;
     width: 100%;
     font-size: 20px;
     font-weight: 400;
     border: 1px solid transparent;
     line-height: 42px;
}

.login-right .nav-pills .nav-link.active {
     border: 1px solid #FF4800;
     background: rgba(255, 72, 0, 0.10);
}

.login-right .nav-pills .nav-link.active svg path {
     fill: #FF4800;
}

.faq-page .accordion-list .nav-link {
     color: #FF4800;
     font-size: 14px;
     font-weight: 400;
     padding: 5px 21px;
}

.faq-page .accordion-list .nav-link.active {
     color: #FF4800;
     font-weight: 600;
     background-color: transparent;
     position: relative;
}

.faq-page .accordion-list .nav-link.active::after {
     content: '';
     border-radius: 22px;
     background: #FF4800;
     height: 6px;
     width: 100%;
     position: absolute;
     bottom: -5px;
     left: 0;
}

.faq-page .nav-pills {
     grid-gap: 9px;
     justify-content: center;
     flex-wrap: nowrap;
     margin-top: 20px;
}

.accordion-item:first-of-type .accordion-button {
     border-top-left-radius: 0px;
     border-top-right-radius: 0px;
}

.faq-page .tab-content {
     margin-top: 22px;
}

.accordion-button:not(.collapsed) {
     color: #313131;
     background-color: transparent;
     box-shadow: none;
}

.accordion-item {
     border: none;
     border-bottom: 1px dotted #CACACA;
}

.intro-paragraph {
     border-bottom: 1px dotted #CACACA;
     padding: 14px 0px;
}

.intro-paragraph p {
     color: #5C5C5C;
     font-size: 13px;
     font-weight: 400;
     line-height: 21px;

}

.intro-paragraph:first-child {
     padding-top: 0px;
}

.intro-paragraph:last-child {
     border-bottom: none;
}

.accordion-body {
     padding: 0 11px;
}

.accordion-button:not(.collapsed)::after {
     background-image: url(/static/images/minus.svg);
     background-size: 14px;
}

.accordion-button::after {
     background-image: url(/static/images/plus.svg);
     background-size: 14px;
}

.accordion-button {
     color: #313131;
     font-size: 14px;
     font-weight: 400;
     line-height: 22px;
     padding: 16px 0;
     border: none;
}

.accordion-header {
     margin-bottom: 0px;
}

.how-work-sec .title h4 {
     color: #222222;
     font-weight: 700;
}

.how-work-sec {
     padding: 55px 0px 64px;
}

.work-card h4 {
     color: #2F2F2F;
     font-size: 26px;
     font-weight: 600;
     line-height: 136.697%;
     margin-bottom: 5px;
     text-align: center;
}

.work-card p {
     color: #646464;
     font-size: 18px;
     font-weight: 400;
     text-align: center;
     line-height: 136.697%;
     max-width: 349px;
     margin: 0 auto;
}


.work-card {
     text-align: center;
}

.card-circle {
     position: relative;
}

.card-circle .card-icon {
     position: absolute;
     top: 46%;
     left: 47%;
     transform: translate(-50%, -50%);
}

.card-2 .card-circle .card-icon {
     top: 47%;
     left: 48%;
}

.card-3 .card-circle .card-icon {
     top: 47%;
     left: 48%;
}

.work-cards {
     max-width: 1178px;
     margin: 24px auto 0px;
}

.about-hero {
     background-image: url(/static/images/about-hero.png);
     background-repeat: no-repeat;
     background-size: 100% 100%;
     background-position: top;
     padding: 200px 0px 0px;
     max-height: 675px;
}

.about-hero h2 {
     color: #000;
     text-align: center;
     font-size: 40px;
     font-weight: 700;
     line-height: 136.697%;
     max-width: 560px;
     margin: 0 auto 40px;
}

.about-hero h2 span {
     color: #FF4800;
}

.vision-sec {
     padding: 445px 0px 40px;
}

.about-page .service-title-box {
     margin-bottom: 10px;
}

.mission-sec {
     margin-bottom: 60px;
}

.seprator {
     padding-top: 44px;
}

.about-page .title h4 {
     font-weight: 700;
     color: #3C3C3C;
}

.principle-box {
     border-radius: 13px;
     background: #FFF4F0;
     padding: 62px 28px 30px;
     height: 100%;
}

.principle-sec .title {
     margin-bottom: 30px;
}

.principle-box h4 {
     color: #000;
     font-size: 20px;
     font-weight: 600;
     line-height: 32px;
     margin: 24px 0px 2px;
}

.principle-box p {
     color: #505050;
     font-size: 14px;
     font-weight: 400;
     line-height: 24px;
}

.service-sec {
     background: #F1FCFF;
     padding: 47px 0px;
     margin: 60px 0px;
}

.service-sec .nav-pills .nav-link {
     color: #696969;
     font-size: 20px;
     font-weight: 500;
     line-height: 136.697%;
     text-align: start;
     padding: 15px 20px;
     margin-bottom: 24px;
     position: relative;
}

.service-sec .nav-pills .nav-link.active {
     padding: 34px 20px;
     background-color: transparent;
     color: rgba(255, 72, 0, 1);
}

.service-sec .nav-pills .nav-link:hover {
     color: rgba(255, 72, 0, 1);
}

.btn-default:hover {
     background: rgba(255, 72, 0, 0.70);
     color: #fff;
}

.service-sec .nav-pills .nav-link::after {
     content: '';
     border-radius: 24px;
     background: rgba(255, 72, 0, 0.20);
     width: 8px;
     height: 100%;
     position: absolute;
     left: 0;
     top: 0;
}

.tab-content-box p {
     color: #000;
     font-size: 20px;
     font-weight: 400;
     line-height: 170%;
     margin-top: 20px;
}

.service-sec .nav {
     margin-top: 26px;
}

.service-sec .nav-pills .nav-link.active::after {
     background: rgba(255, 72, 0, 1);
}

.solution-sec .principle-box {
     padding: 26px 33px 29px;
}

.solution-sec {
     padding-bottom: 60px;
}

.solution-sec .solution-box-header {
     display: flex;
     align-items: center;
     justify-content: space-between;
}

.solution-sec .principle-box h4 {
     margin: 5px 0px 2px;
}

.ace-sec .title h4 {
     margin-bottom: 6px;
}

.solution-sec .title {
     margin-bottom: 27px;
}

.solution-sec .img-circle {
     background-color: #FFF;
     width: 100px;
     height: 100px;
     display: flex;
     align-items: center;
     justify-content: center;
     border-radius: 50%;
}

.solution-sec h2 {
     color: #F4D8CC;
     font-size: 64px;
     font-weight: 400;
     line-height: 24px;
}

.techonology-list {
     display: flex;
     align-items: start;
     grid-gap: 24px;
     margin-top: 18px;
     margin-bottom: 8px;
}

.ace-sec {
     padding-bottom: 60px;
}

.techonology-list h6 {
     color: #000;
     font-size: 22px;
     font-weight: 600;
     line-height: 157%;
}

.flex-1 {
     flex: 1;
}

.techonology-box {
     width: 100px;
     height: 100px;
     border-radius: 50%;
     background-color: #FFDDD0;
     display: flex;
     align-items: center;
     justify-content: center;
}

.team-sec {
     padding: 60px 0px;
}

.journey-sec .img-holder {
     margin-bottom: 20px;
}

.top-space {
     margin-top: 20px;
}

.title strong {
     color: #373737;
}

.contact-boxes {
     display: grid;
     grid-template-columns: 6fr 6fr;
     grid-gap: 24px;
     margin-top: 16px;
}

.get-in-touch-sec {
     padding: 70px 0px 50px;
}

.contact-boxes .box {
     border-radius: 13px;
     background: #FFF4F0;
     display: flex;
     align-items: center;
     grid-gap: 13px;
     padding: 25px 35px 23px;
}

.contact-boxes .box span {
     color: #373737;
     font-size: 15px;
     font-weight: 600;
     line-height: 157%;
}

.contact-boxes .box h4 {
     color: #000;
     font-size: 20px;
     font-weight: 600;
     line-height: 157%;
}

.about-page .work-box h2 {
     margin: 0 auto;
}

.about-page .work-box p {
     color: rgba(255, 255, 255, 0.90);
     font-size: 20px;
     font-weight: 600;
     line-height: 157%;
     margin: 4px 0px 18px;
}

.about-page .work-box {
     padding: 44px 0px 35px;
     text-align: center;
     display: block;
}

.btn-contact:hover {
     opacity: 0.8;
     color: #fff;
}

.navbar-nav .nav-item .nav-link:hover {
     color: #FF3621;
}

.social-list li a:hover {
     background-color: #FF6B30;
     border-color: #FF6B30;
}

.footer-links li a:hover {
     text-decoration: underline;
}

.about-page .work-box .btn-pdf {
     background: #FFF;

}

.file-list {
     display: flex;
     align-items: center;
     grid-gap: 20px;
     margin-top: 8px;
}

.file-box {
     background-color: rgba(255, 109, 51, 0.2);
     width: 24px;
     height: 24px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.activity-page .accordion-body p {
     font-size: 14px;
     font-weight: normal;
     color: #000;
}

.activity-page .accordion-body {
     padding: 19px 60px;
}

.activity-page .document-activity-history {
     border-bottom: none;
     padding: 0px;
}

.activity-page .accordion-button {
     padding: 16px 0px 0px;
     display: flex;
     align-items: center;
     justify-content: space-between;
}

.activity-page .accordion-button.collapsed {
     padding-bottom: 16px;
}

.activity-page .accordion-button::after {
     content: none;
}

.btn-files {
     font-size: 14px;
     font-weight: 600;
     color: #fff;
     padding: 9px 27px;
     background-color: #FF6B30;
     border: 1px solid #000;
     filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.25));
     border-radius: 6px;
}

.btn-files:hover {
     background-color: transparent;
     color: #FF6B30;
}

.para-scroll,
.para-scroll2 {
     overflow-y: scroll;
     /*height: 250px;*/
     height: 500px;
     padding-right: 20px;
     margin-bottom: 20px;
}

.para-scroll2 {
     /*height: 300px;*/
     height: 500px;
}

.para-scroll::-webkit-scrollbar,
.para-scroll2::-webkit-scrollbar {
     width: 4px;
     border-radius: 10px;
}

.para-scroll::-webkit-scrollbar-track,
.para-scroll2::-webkit-scrollbar-track {
     background: transparent;
     border-radius: 10px;
}

.para-scroll::-webkit-scrollbar-thumb,
.para-scroll2::-webkit-scrollbar-thumb {
     background: #FF6B30;
     border-radius: 10px;
}

/* admin-css */
.user-page .balance-box.notifaction {
     padding: 12px;
}

.text-box h3 {
     color: #000;
     font-size: 22px;
     font-weight: 600;
     line-height: normal;
}

.dashboard-box-wrapper {
     display: grid;
     grid-template-columns: 4fr 4fr 4fr;
     grid-gap: 24px;
     margin-top: 15px;
}

.dashboard-box {
     border-radius: 12px;
     background: #FFF;
     padding: 20px 16px;
     margin-bottom: 24px;
}

.box-heading {
     display: flex;
     align-items: center;
     grid-gap: 10px;
     margin-bottom: 14px;
}

.box-heading span {
     border-radius: 8px;
     background: #FFE5DB;
     width: 36px;
     height: 36px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.box-heading h6 {
     color: #929292;
     font-size: 16px;
     font-weight: 600;
     line-height: 24px;
     letter-spacing: -0.16px;
}

.dashboard-box h2 {
     color: var(--black-100, #1C1C1C);
     font-family: "Inter", sans-serif;
     font-size: 28px;
     font-weight: 700;
     line-height: 36px;
}

.btn-see {
     color: #FF4800;
     font-size: 13px;
     font-weight: 500;
     line-height: 16px;
     letter-spacing: -0.13px;
     border-radius: 12px;
     border: 1px solid var(--Brand-Color-Gray-200, #E8E8E8);
     background: #FFF;
     width: 100%;
     padding: 13px 14px;
}

.credit-content span {
     color: #FF4800;
     font-size: 48px;
     font-weight: 600;
     line-height: 48px;
     letter-spacing: -1.44px;
}

.credit-content p {
     color: #929292;
     font-size: 13px;
     font-weight: 600;
     line-height: 16px;
     letter-spacing: -0.13px;
     margin-bottom: 44px;
}

.credit-content {
     margin-top: -90px;
     margin-bottom: 60px;
}

.summary-heading {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 36px;
     grid-gap: 20px;
}

.summary-box {
     border-radius: 12px;
     background: #FFF;
     padding: 30px 20px 20px;
}

.summary-box .form-select {
     color: #B0B0B0;
     font-size: 13px;
     font-weight: 500;
     line-height: 16px;
     border-radius: 8px;
     border: 1px solid #E8E8E8;
     background-color: #FFF;
     letter-spacing: -0.13px;
     padding: 11px 20px;
     min-width: 102px;
     max-width: fit-content;
}

.progress-box {
     display: flex;
     align-items: center;
     justify-content: space-between;
     margin-bottom: 8px;
}

.progress-box span {
     color: #929292;
     font-size: 14px;
     font-weight: 600;
     line-height: normal;
}

.progress {
     height: 12px;
     background: #FFE5DB;
     border-radius: 5px;
}

.progress-bar {
     border-radius: 5px;
     background: #FF4800;
}

.progress-box-wrapper {
     margin-bottom: 30px;
}

.btns-list {
     display: flex;
     align-items: center;
     grid-gap: 14px;
}

.btns-list li .btn-pdf {
     padding: 12px 18px;
     background: #FF6B30;

}

.btns-list li .btn-pdf.bg-orange {
     background: #FFE5DB !important;
     color: #FF6B30;
}

.top-box-wrapper {
     display: flex;
     align-items: center;
     justify-content: space-between;
}

.user-page .form {
     display: flex;
     align-items: center;
     grid-gap: 11px;
     max-width: 100%;
     margin: 5px 0px 11px;
}

.user-page .form .form-select {
     border-radius: 5px;
     background-color: #F5F5F5;
     height: 34px;
     padding: 5px 10px;
     color: #929292;
     font-size: 14px;
     font-weight: 400;
     line-height: 100%;
     border: none;
     width: 97px;
}

.user-page .form .form-control {
     padding-left: 48px;
     height: 43px;
     min-width: 265px;
}

.user-page .form .input-box .img-holder {
     right: auto;
     left: 16px;
}

.table .dropdown-toggle {
     background-color: rgba(0, 0, 0, 0.05);
     width: 24px;
     height: 24px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     padding: 0;
     justify-content: center;
}

.dropdown-toggle::after {
     content: none;
}

.table .dropdown-menu {
     background: #FFF;
     padding: 0;
     margin: 0;
}

.table>:not(caption)>*>* {
     border-bottom: none;
     box-shadow: none;
}

.table .form-check-input {
     border-radius: 2px;
     border: 1px solid #444748;
     width: 16px;
     height: 16px;
}

.table thead tr th {
     color: #000;
     font-size: 16px;
     font-weight: 600;
     line-height: normal;
     background: #F5F5F5;
     padding: 18px 21px;
}

.table thead tr th:first-child {
     border-radius: 6px 0px 0px 6px;
}

.table thead tr th:last-child {
     border-radius: 0px 6px 6px 0px;
}

.table tbody tr td {
     color: #929292;
     font-size: 14px;
     font-weight: 500;
     padding: 18px 21px;
     line-height: 20px;
     letter-spacing: 0.5px;
     border-bottom: 1px solid #CCD1D1;
}

.table .dropdown-menu a {
     display: flex;
     align-items: center;
     grid-gap: 10px;
     color: var(--BODY, #6C757D);
     font-size: 14px;
     font-weight: 500;
     line-height: 150%;
     padding: 10px 16px;
     border-bottom: 1px solid var(--DIM, #E3E3E3);

}

.pagination-list {
     display: flex;
     align-items: center;
     justify-content: end;
     grid-gap: 24px;
}

.pagination-list a {
     display: flex;
     align-items: center;
     justify-content: center;
     grid-gap: 4px;
     color: #929292;
     font-size: 14px;
     font-weight: 400;
     line-height: 120%;
}

.pagination-list .form-select {
     border-radius: 5px;
     background-color: #FAFAFA;
     padding: 8px 10px;
     color: #929292;
     font-size: 14px;
     font-weight: 400;
     line-height: 120%;
     min-width: 72px;
     width: fit-content;
     background-image: url(/static/images/chevrons-up-down.svg);
     background-repeat: no-repeat;
}

.user-modal .modal-content {
     border-radius: 8px;
     background: #FFF;
     padding: 0px 20px 20px;
}

.modal-header {
     padding: 24px 0px 5px;
     border-bottom: 1px solid var(--Text-Placeholder, #D7D6DB);
}

.modal-title {
     color: #000;
     font-size: 16px;
     font-weight: 600;
     line-height: 100%;
}

.modal-header .btn-close {
     background-image: url(/static/images/close.svg);
     background-repeat: no-repeat;
     background-size: contain;
     margin: 0;
     padding: 4px;
     background-size: 26px;
}


.user-modal .form {
     margin: 0;
     max-width: 100%;
}

.user-modal .modal-body {
     padding: 0;
}

.user-modal .modal-body .form .form-group {
     margin-bottom: 14px;
}

.user-modal .modal-dialog {
     max-width: 728px;
}

.user-modal .modal-body .form label {
     color: #929292;
}

.user-modal .modal-body .form label span {
     color: #FF3636;
}

.user-modal .modal-body .form .form-control,
.user-modal .modal-body .form .form-select {
     border-radius: 5px;
     border: 1px solid #E3E3E3;
     background-color: #FFF;
     height: 46px;

}

.user-modal .modal-body .form {
     padding-top: 26px;
}

.btn-cancel {
     color: #FF6B30;
     font-size: 14px;
     font-weight: 500;
     line-height: 20px;
     border-radius: 6px;
     border: 1px solid #FF6B30;
     box-shadow: 0px 1px 2px 0px rgba(105, 81, 255, 0.05);
     padding: 14px 32px;
}

.modal-footer a {
     min-width: 110px;
}

.modal-footer>* {
     margin: 0px;
}

.modal-footer {
     border-top: 1px solid #E6E6E6;
     padding: 20px 0px 0px;
     display: flex;
     align-items: center;
     justify-content: end;
     grid-gap: 10px;
}

.logout-modal .modal-dialog {
     max-width: 373px;
}

.logout-modal .modal-content {
     border-radius: 10px;
     background: #FFF;
     border: none;
}

.logout-modal .modal-body {
     text-align: center;
     padding: 30px;
}

.logout-modal .modal-body h2 {
     color: #212529;
     font-size: 26px;
     font-weight: 600;
     line-height: 150%;
     margin: 3px 0px 12px;
}

.logout-modal .modal-body p {
     color: #929292;
     font-size: 16px;
     font-weight: 400;
     line-height: 150%;
}

.logout-modal .modal-footer {
     border: none;
     padding: 0;
     margin-top: 36px;
     justify-content: center;
}

.logout-modal .btn-cancel,
.logout-modal .btn-pdf {
     padding: 7px 32px;
}

.modal-backdrop {
     background: rgba(0, 0, 0, 0.40);
}

.modal-backdrop.show {
     opacity: 1;
}

.btn-cancel:hover {
     background-color: #FF6B30;
     color: #fff;
}

.notifaction-wrapper {
     display: flex;
     align-items: center;
     grid-gap: 12px;
     padding: 24px 16px;
     border-bottom: 1px solid #F1F4F9;
}

.notifaction-right-content {
     display: flex;
     align-items: start;
     justify-content: space-between;
     grid-gap: 10px;
     flex: 1;
}

.notifaction-wrapper .notifaction-avatar {
     border-radius: 20px;
     background: #FFE5DB;
     width: 40px;
     height: 40px;
     display: flex;
     align-items: center;
     justify-content: center;
}

.flex-1 {
     flex: 1;
}

.notifaction-wrapper h4 {
     color: #000;
     font-size: 14px;
     font-weight: 600;
     margin-bottom: 10px;
     line-height: 100%;
}

.notifaction-wrapper p {
     color: #929292;
     font-size: 14px;
     font-weight: 400;
     line-height: 100%;
}

.notifaction-wrapper p span {
     font-weight: 500;
}

.circle-progress {
     position: relative;
     text-align: center;
}

.barOverflow {
     position: relative;
     overflow: hidden;
     width: 310px;
     height: 155px;
     margin: 0 auto;
}

.bar {
     position: absolute;
     top: 0;
     left: 0;
     width: 310px;
     height: 310px;
     border-radius: 50%;
     box-sizing: border-box;
     border: 25px solid #eee;
     transform: rotate(45deg);
     border-bottom-color: #FF4800;
     border-right-color: #FF4800;
}

.dropdown-item.active, .dropdown-item:active {
     color: #1e2125;
     background-color: #e9ecef;
}





.news-container {
     display: flex;
     flex-wrap: wrap;
     gap: 20px;
     justify-content: center;
     padding: 20px;
 }
 
 .news-card {
     border: 1px solid #ccc;
     border-radius: 8px;
     width: 300px;
     overflow: hidden;
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
     background-color: #fff;
     transition: all 0.2s ease-in-out;
 }
 .news-card:hover { 
     transform: scale(1.02);
     box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
 }
 
 .news-image img {
     width: 100%;
     height: 200px;
     object-fit: cover;
 }
 
 .news-content {
     padding: 15px;
 }
 
 .news-title {
     font-size: 18px;
     margin: 0 0 10px;
 }
 
 .news-title a {
     color: #007bff;
     text-decoration: none;
 }
 
 .news-title a:hover {
     text-decoration: underline;
 }
 
 .news-meta {
     font-size: 14px;
     color: #666;
 }
 .spinner {
     border: 16px solid #FF6B30; 
     border-top: 16px solid #FF6B30; 
     border-radius: 50%;
     width: 120px;
     height: 120px;
     animation: spin 2s linear infinite;
     margin: 20px auto;
 }
 
 @keyframes spin {
     0% { transform: rotate(0deg); }
     100% { transform: rotate(360deg); }
 }

 #processingMessage {
     font-size: 14px;
     color: #FF6B30;  /*Red color to make it stand out */
     /*font-weight: bold;*/
     text-align: center;
     margin-top: 20px;
 }
 #stepMessage {
     font-size: 16px;
     color: #333;  /*Red color to make it stand out */
     /*font-weight: bold;*/
     text-align: center;
     margin-top: 20px;
 }

 #timeElapsed {
     font-size: 16px;
     color: #333;  /*Red color to make it stand out */
     /*font-weight: bold;*/
     text-align: center;
     margin-top: 20px;
 }

 .processing-container {
     background-color: #f9f9f9;
     border: 1px solid #ddd;
     border-radius: 8px;
     padding: 20px;
     margin-top: 20px;
     text-align: center;
     box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
     animation: fadeIn 0.5s ease-in-out;
 }
 
 .processing-header {
     font-size: 1.2rem;
     font-weight: bold;
     color: #333;
     margin-bottom: 10px;
 }
 
 .progress-messages {
     display: flex;
     flex-direction: column;
     gap: 10px;
     justify-content: center;
     align-items: center;
 }
 
 .step-message {
     font-size: 1rem;
     font-weight: 500;
     color: #333;
 }
 
 .time-elapsed {
     font-size: 0.9rem;
     color: #333;
 }
 
 .spinner {
     margin-top: 10px;
     border: 4px solid #f3f3f3;
     border-top: 4px solid #FF6B30;
     border-radius: 50%;
     width: 40px;
     height: 40px;
     animation: spin 1s linear infinite;
 }

 
 
 /* Keyframes for spinner animation */
 @keyframes spin {
     0% {
         transform: rotate(0deg);
     }
     100% {
         transform: rotate(360deg);
     }
 }
 
 /* Keyframes for fade-in animation */
 @keyframes fadeIn {
     from {
         opacity: 0;
         transform: scale(0.95);
     }
     to {
         opacity: 1;
         transform: scale(1);
     }
 }
 
