@font-face {
    font-family: 'Roboto';
    src: url('../fonts/roboto/Roboto-Regular.woff2') format('woff2'),
        url('../fonts/roboto/Roboto-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
:root {
    --primaryfont:                          "Roboto";

    --primary_color:                        #722C85;
    --secondary_color:                      #F9556D;
    --body_color:                           #EADDFF;
    --content-color:                        #212529;
    --heading-color:                        #222222;
    --white:                                #ffffff; 
    --black:                                #000000;
    --accent:                               #495057;
    --accent-hover:                         #495057; 

 
    --btn1bg:                               rgba(114, 44, 133, 1);
    --btn1border:                           rgba(114, 44, 133, 1);
    --btn1text:                             rgba(255, 255, 255, 1);
    --btn1hvrbg:                            rgba(255, 255, 255, 1);
    --btn1hvrborder:                        rgba(114, 44, 133, 1);
    --btn1hvrtext:                          rgba(114, 44, 133, 1);
    
    --btn2bg:                               rgba(249, 85, 109, 1);
    --btn2border:                           rgba(249, 85, 109, 1);
    --btn2text:                             rgba(255, 255, 255, 1);
    --btn2hvrbg:                            rgba(255, 255, 255, 1);
    --btn2hvrborder:                        rgba(249, 85, 109, 1);
    --btn2hvrtext:                          rgba(249, 85, 109, 1);
}

* { box-sizing: border-box; }
*:focus { outline: none; }
::-moz-focus-inner { border: 0; }
::-webkit-scrollbar { width: 12px; border-radius: 10px; height: 90%; margin: auto; }
::-webkit-scrollbar-track { -webkit-box-shadow: unset; }
::-webkit-scrollbar-thumb { background-color: transparent; outline: none; border: 0; border-left: 3px solid #D9D9D9; }

/* Slick css */
.slick-slider .slick-arrow { background: none; border: none; z-index: 9; position: absolute; top: 45%; left: 0; width: 50px; height: 50px; font-size: 0px; color: #fff; transition: 400ms; cursor: pointer; }
.slick-slider .slick-arrow.slick-next { left: auto; right: 0; }
.slick-slider .slick-dots { text-align: center; padding: 0; margin: 0; }
.slick-slider .slick-dots li { display: inline-block; margin: 0 5px; }
.slick-slider .slick-dots li button { width: 30px; height: 5px; overflow: hidden; text-indent: -99999px; background-color: rgb(163 163 163 / 50%); border: none; padding: 0; cursor: pointer; transition: 400ms; }
.slick-slider .slick-dots li.slick-active button { background-color: #56A86D; }

html, body{ height:100%; }
#root { height: 100%;width: 100%; }
#root .app-container { height: 100%; }
#root .app-container .modal-dialog { width: 100%; height: 100%; display: grid; place-content: center; }

/* Animation */
@keyframes growDown {
    0% {
        transform: scaleY(0)
    }
    80% {
        transform: scaleY(1.1)
    }
    100% {
        transform: scaleY(1)
    }
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: var(--primaryfont); margin:0; padding: 0; font-style: normal; } 
h1 span, h2 span, h3 span, h4 span, h5 span , h6 span { color:var(--primary_color); } 
h1, .h1 {  font-size: 64px; line-height: 84px; font-weight: 700; color: var(--heading-color); } 
h2, .h2 {  font-size: 42px; line-height: 50px; font-weight: 700; color: var(--heading-color); } 
h3, .h3 {  font-size: 16px; line-height: 30px; font-weight: 600; color: var(--heading-color); } 
h4, .h4 {  font-size: 16px; line-height: 21px; font-weight: 600; color: var(--heading-color); } 
h5, .h5 {  font-size: 14px; line-height: 20px; font-weight: 500; color: var(--heading-color); } 
h6, .h6 {  font-size: 14px; line-height: 16.41px; font-weight: 400; color: var(--heading-color); } 

a { font-family: var(--primaryfont); text-decoration: none; color: var(--accent); font-size: 14px; line-height: 20px; font-weight: 400; transition:400ms; } 
a:hover, a:focus { color:#494953; } 

p { font-family: var(--primaryfont); margin:0 0 5px 0; font-size: 14px; color: var(--content-color); font-weight: 400; } 
p:last-child { margin:0; } 

ul { font-family: var(--primaryfont); margin: 0; padding: 0; } 
li { list-style: none; } 

@media (max-width:1024px) { h4 { font-size: 18px; } 
 a { font-size: 14px; } 
 }

 @media (max-width:575px) { h5 { font-size: 14px; } 
 }
 
@media (min-width:1440px) { a { font-size: 16px; } 
}

.btn_group > div { display: inline-block; margin: 0 6px; vertical-align: middle; }
.btn_group > div:first-child { margin-left: 0; margin-bottom: 5px; }
.btn_group > div:last-child { margin-right: 0; margin-bottom: 5px; }
.cta_btn a,
.cta_btn[class*=button-] a,
.cta_btn [type=submit],
.cta_btn button { display: inline-block; font-size: 14px; font-weight: 400; line-height: 22px; letter-spacing: 0.5px; padding: 5px 16px; min-width: 120px; border-radius: 5px; text-align: center; text-transform: capitalize; vertical-align: middle; text-decoration: none; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; outline: none !important; cursor: pointer; }
.cta_btn.sml-btn a,
.cta_btn.sml-btn[class*=button-] a,
.cta_btn.sml-btn [type=submit],
.cta_btn.sml-btn button { font-size: 14px; line-height: 22px; font-weight: 400; padding: 5px 15px; min-width: 100px; }
.cta_btn.icon-btn i,
.cta_btn.icon-btn[class*=button-] a i,
.cta_btn.icon-btn [type=submit] i,
.cta_btn.icon-btn button i { margin-right: 5px; font-size: 12px; }
.cta_btn.icon-btn img,
.cta_btn.icon-btn[class*=button-] a img,
.cta_btn.icon-btn [type=submit] img,
.cta_btn.icon-btn button img { width: 15px; height: 15px; margin-right: 5px; }
.button-1 a,
.button-1 button,
.button-1 input[type="submit"] { background-color: var(--btn1bg); color: var(--btn1text); border: 1px solid var(--btn1border); }
.button-1 a:hover,
.button-1 button:hover,
.button-1 input[type="submit"]:hover { background-color: var(--btn1hvrbg); color: var(--btn1hvrtext); border: 1px solid var(--btn1hvrborder); }
.button-2 a,
.button-2 button,
.button-2 input[type="submit"] { background-color: var(--btn2bg); color: var(--btn2text); border: 1px solid var(--btn2border); }
.button-2 a:hover,
.button-2 button:hover,
.button-2 input[type="submit"]:hover { background-color: var(--btn2hvrbg); color: var(--btn2hvrtext); border: 1px solid var(--btn2hvrborder); }

@media (max-width:1024px) {
	.cta_btn a,
	.cta_btn[class*=button-] a,
	.cta_btn [type=submit],
	.cta_btn button { min-width: 200px; padding: 6px 10px; font-size: 14px; }
}
@media (max-width:991px) {
	.btn-group > div { display: block; margin: 0 0 8px; }
}
@media (max-width:767px) {
	.cta_btn a,
	.cta_btn[class*=button-] a,
	.cta_btn [type=submit],
	.cta_btn button { padding: 5px 8px; }
}
@media (max-width:575px) {
	.cta_btn a,
	.cta_btn[class*=button-] a,
	.cta_btn [type=submit],
	.cta_btn button { padding: 5px; }
	.btn_group > div:last-child { margin: 0; }
	.cta_btn a,
	.cta_btn[class*=button-] a,
	.cta_btn [type=submit],
	.cta_btn button { min-width: 85px; }
}
@media (min-width:1440px) {
	.cta_btn a,
	.cta_btn[class*=button-] a,
	.cta_btn [type=submit],
	.cta_btn button { padding: 10px 24px; }
}

input { font-family: var(--primaryfont); padding: 3px 5px; margin-bottom: 15px; outline: none; border: 1px solid; border-radius: 5px; font-size: 14px; } 
label { display: block; font-size: 14px; } 
textarea { resize: none } 
::-webkit-input-placeholder,input::-webkit-input-placeholder,textarea::-webkit-input-placeholder { color: #c2c2c2; opacity: 1 } 
::-moz-placeholder,input::-moz-placeholder,textarea::-moz-placeholder { color: var(--accent-hover); opacity: 1 } 
:-ms-input-placeholder,input:-ms-input-placeholder,textarea:-ms-input-placeholder { color: var(--accent-hover); opacity: 1 } 
:-moz-placeholder,input:-moz-placeholder,textarea:-moz-placeholder { color: var(--accent-hover); opacity: 1 } 
input[type=file] { background: none; color: #000; box-sizing: border-box; outline: none; resize: none; border: 0; transition: all .3s; font-size: 12px; width: 170px; } 
.form-control:focus { box-shadow: none; color: #495057; outline: 0; box-shadow: none; border-bottom: 1px solid var(--primary_color); } 
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; } 

/* Default Form Code */
.default-form .form_group .form_group-field > label span.form_group-required{display:none;}
.default-form .form_group .form_group-field > label span:not(:empty) + span.form_group-required{display:inline-block;}
.default-form .form_group .form_group-field .input{margin:0;}
.default-form .form_group label{display:block;}
.default-form .form_group fieldset{border:none;margin:0;max-width:none;padding:0;}
.default-form .form_group fieldset.form-columns-2{margin:0 -14px;}
.default-form .form_group fieldset.form-columns-2 .form_group-field{width:calc(50% - 28px); margin:0 14px; float:left;}
.default-form .form_group fieldset.form-columns-3{margin:0 -14px;}
.default-form .form_group fieldset.form-columns-3 .form_group-field{width:calc(33.33% - 28px); margin:0 14px; float:left;}
.default-form .form_group .hs_submit{padding:25px 0 0;}
.default-form .form_group .legal-consent-container{font-size:13px;padding:17px 0 0;}
.default-form .form_group .inputs-list{list-style:none;margin:0; padding:0;}
.default-form .form_group .inputs-list input[type="checkbox"]{opacity:0;position:absolute;}
.default-form .form_group .inputs-list span{margin:0;padding:2px 0 0 40px;position:relative; cursor:pointer;display: inline-block;}
.default-form .form_group .inputs-list span:after{background-color:#FFF; border:solid 2px #bfc6d8; content:'';height:20px;left:0;position:absolute;top:5px;width:20px;border-radius: 6px;}
.default-form .form_group .inputs-list span:before{border-bottom:2px solid #175ca4;border-left:2px solid #175ca4;content:'';height:4px;left:6px;position:absolute;top:13px;transform:rotate(-41deg);width:10px;z-index:1;}
.default-form .form_group .inputs-list span:before{border-bottom-width:0; border-left-width:0;}
.default-form .form_group .inputs-list input[type="checkbox"]:checked + span:before{border-bottom-width:2px; border-left-width:2px;}
.default-form .form_group .inputs-list span span{display:none;}
.default-form .form_group fieldset[class*="form-columns-"] select{width:100% !important;}
.default-form div.hs_error_rollup{display: none;}

.default-form .form_group .form_group-field > label{color:#d8d8d8;font-weight: 500;padding:0 0 5px;}

@media (max-width:767px){
    .default-form .form_group fieldset.form-columns-2, .default-form .form_group fieldset.form-columns-3{margin:0;}
    .default-form .form_group fieldset.form-columns-2 .form_group-field, .default-form .form_group fieldset.form-columns-3 .form_group-field{width:100%; margin:0; float:none;}
    .default-form .form_group fieldset .input .hs-input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), 
    .default-form .form_group fieldset.form-columns-2 .input .hs-input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]), 
    .default-form .form_group fieldset.form-columns-3 .input .hs-input:not([type="radio"]):not([type="checkbox"]):not([type="submit"]):not([type="button"]):not([type="image"]):not([type="file"]){width:100%;}
    .default-form .form_group label{padding:0;}
}
.submitted-message{text-align:center;color:#155724;background-color:#d4edda;border-color:#c3e6cb;position:relative;padding:.75rem 1.25rem;margin-bottom:1rem;border:1px solid #c3e6cb;border-radius:.25rem;}
.submitted-message p{margin:0 !important;}
@media (max-width:767px){
    input[type="submit"]{font-size:18px;min-width:auto;padding:10px;}
}
body .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a{max-width: none; white-space: inherit; overflow: visible;}

.app-container .app-header { height: 80px; display: flex; align-items: center; position: relative; z-index: 1; transition: all 0.5s ease; background: var(--white); padding: 15px 20px; box-shadow: 1px 10px 20px rgba(0, 0, 0, 0.1); } 
.app-container .app-header .app-header__logo { display: flex; align-items: center; transition: width .2s; } 
.app-container .app-header .app-header__logo .logo .short-logo { display: none; } 
.app-container .app-header .app-header__logo .logo .logo img { height: 50px; } 
.app-container .app-header .app-header__content { display: flex; align-items: center; justify-content: end; flex: 1; } 
.app-container .app-header .app-header__content .app-header-right .nav-right { display: flex; justify-content: space-between; align-items: center; gap: 30px; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .nav-right-icon { font-size: 16px; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .user-sec { border-radius: 50%; text-align: center; cursor: pointer; transition: 1s; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .user-sec .user-sec-profile { position: relative; cursor: pointer; } 
.app-container .app-header .user-sec .user-sec-profile .avtar_img { height: 33px; width: 33px; border-radius: 50%; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .user-sec .user-sec-profile .dropdown-menu.show { padding: 0; min-width: 10rem !important; background-color: var(--white); text-align: left; margin-top: 35px !important; animation: growDown 300ms ease-in-out forwards; transform-origin: top center; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .user-sec .user-sec-profile .dropdown-menu.show li { padding: 4px 4px 4px 10px; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .user-sec .user-sec-profile .dropdown-menu.show li button { background: transparent; border: 0; } 
.app-container .app-header .app-header__content .app-header-right .nav-right .request-demo-sec a:hover i, .app-container .app-header .app-header__content .app-header-right .nav-right .help-sec a:hover i, .app-container .app-header .app-header__content .app-header-right .nav-right .not-sec a:hover i { color: var(--primary_color); } 
.app-container .app-header .app-header__content .app-header-right .nav-right .help-sec a:hover, .app-container .app-header .app-header__content .app-header-right .nav-right .request-demo-sec:hover { color: var(--primary_color); } 
.app-container .app-header .app-header__content .not-sec .badge { position: absolute; top: -5px; right: -3px; padding: 0px 2px; border-radius: 50%; background: #ff0000; color: #ffffff; } 
.hamburger { display: none; cursor: pointer; } 
.hamburger .bar { display: block; width: 25px; height: 3px; margin: 5px auto; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; background-color: #000; } 
.main-body .app-sidebar { background: #5d0f72; padding: 20px 0 0; display: flex; flex-direction: column; justify-content: space-between; width: 224px; box-shadow: 1px 10px 20px rgba(0, 0, 0, 0.1); height: calc(100vh - 80px); } 
.main-body .app-sidebar .top-sec { flex: 1; } 
.main-body .app-sidebar .top-sec .workspace-accordion { display: flex; flex-direction: column; } 
.main-body .app-sidebar .top-sec .workspace-accordion .accordion-item>.accordion-collapse { padding: 0 0 0 45px; margin-bottom: 10px; } 
.main-body .app-sidebar i { color: var(--white); margin-right: 5px; } 
.main-body .app-sidebar .myhome-sec { padding: 0 8px 0 8px; } 
.main-body .app-sidebar .myhome-sec .accordion-body { padding: 0; } 
.main-body .app-sidebar .myhome-sec .accordion-item .accordion-header .accordion-button .sidebar-icon { width: 28px; height: 28px; font-size: 18px; margin: auto 10px auto 0; display: inline-flex; align-items: center; justify-content: center; } 
.main-body .app-sidebar .myhome-sec .accordion-item:not(:first-of-type) { margin-top: 5px; } 
.main-body .app-sidebar .myhome-sec .accordion-item .accordion-button { background: transparent; padding: 8px; border-radius: 10px; } 
.main-body .app-sidebar .myhome-sec .accordion-item .accordion-button:focus { box-shadow: none; background: none; } 
.main-body .app-sidebar .myhome-sec .accordion-item .accordion-button:hover { background-color: #942cc04d; } 
.main-body .app-sidebar .myhome-sec .accordion-item:first-of-type> .accordion-button { padding-top: 0; } 
.main-body .app-sidebar button.accordion-button { padding: 8px; display: flex; border-radius: 10px !important; } 
.main-body .app-sidebar .myhome-sec .accordion-item { border: none; background: transparent; } 
.main-body .app-sidebar .myhome-sec .accordion-item .sidebar-heading, .main-body .app-sidebar .invite-sec .sidebar-heading, .main-body .app-sidebar.active .app-header-right .sidebar-heading { color: var(--white); } 
.main-body .app-sidebar .home-collapse a { font-size: 14px; } 
.main-body .app-sidebar .home-collapse ul.btn-toggle-nav li>a:not(.dropdown-toggle) { display: flex; align-items: center; } 
.main-body .app-sidebar i.edit-icon { margin-right: 8px !important; } 
.main-body .app-sidebar .home-collapse .btn-toggle-nav i { width: 10px; height: 15px; margin-right: 5px; } 
.main-body .app-sidebar .profile-collapse .btn-toggle-nav li a i { margin-right: 10px; } 
.main-body .app-sidebar .home-collapse li { display: flex; align-items: center; transition: 1s; justify-content: space-between; } 
.main-body .app-sidebar .home-collapse li a:not(.dropdown-toggle) { padding: 5px 0; color: var(--white); } 
.main-body .app-sidebar .home-collapse1 li a { padding: 0 7px 0 7px; color: var(--accent); } 
.main-body .app-sidebar .home-collapse1 li { border: 1px solid transparent; border-radius: 10px; height: 2.2rem; display: flex; align-items: center; gap: 5px; transition: 1s; justify-content: space-between; } 
.main-body .app-sidebar .invite-sec { padding: 0 20px 0 20px; border-top: 1px solid #a79a9a; } 
.main-body .app-sidebar .invite-sec a { display: flex; align-items: center; gap: 19px; border: 1px solid transparent; padding: 20px 5px; transition: 1s; } 
.main-body .app-sidebar .invite-sec i { font-size: 18px; } 
.main-body .app-sidebar .app-header-right .nav-right { display: none; } 

/************ Responsive CSS ***************/
@media(max-width:1024px){
 .main-body .app-sidebar .top-sec .myhome-sec .home-collapse li a { font-size: 14px; } 
 }
@media (max-width:991px){
 .main-body .app-sidebar .top-sec .myhome-sec .home-collapse li a { padding: 0; } 
.main-body .app-sidebar.active .app-header-right { padding: 4px 8px 0 8px; } 
.main-body .app-sidebar.active .app-header-right .nav-right { display: flex; flex-direction: column; align-items: flex-start; gap: 20px; padding: 0 8px; } 
.main-body .app-sidebar.active .app-header-right i { width: 25px; font-size: 18px; } 
.main-body .app-sidebar.active .app-header-right .nav-right .nav-right-icon { display: flex; align-items: center; } 
.main-body .app-sidebar.active .app-header-right .nav-right .not-sec { padding: 0; } 
.main-body .app-sidebar.active .app-header-right .sidebar-icon { width: 28px; height: 28px; font-size: 18px; margin: auto 10px auto 0; display: inline-flex; align-items: center; justify-content: center; } 
.app-container .app-header .user-sec-profile .dropdown-menu.show li i { padding-right: 10px; } 
 }
@media (max-width:767px){
 .app-container .app-header { justify-content: space-between; } 
.app-container .app-header .app-header__logo { width: 60%; justify-content: space-between; } 
.app-container .app-header .app-header__logo .header__pane { order: 0; } 
.app-container .app-header .app-header__logo .header__pane .hamburger { display: block; } 
.app-container .app-header .app-header__logo .header__pane .hamburger.active .bar:nth-child(2) { opacity: 0; } 
.app-container .app-header .app-header__logo .header__pane .hamburger.active .bar:nth-child(1) { transform: translateY(8px) rotate(45deg); } 
.app-container .app-header .app-header__logo .header__pane .hamburger.active .bar:nth-child(3) { transform: translateY(-8px) rotate(-45deg); } 
.app-container .app-header .app-header__logo .logo { order: 1; } 
.app-container .app-header .app-header__mobile-menu { order: 2; } 
.app-container .app-header .app-header__mobile-menu .hamburger { display: block; } 
.app-container .app-header .hamburger-sidebar { display: none; } 
.app-container .app-header .app-header__content { display: none; } 
.main-body .app-sidebar { position: fixed; left: -100%; opacity: 0; transition: 0.3s; z-index: 1; } 
.main-body .app-sidebar.active { left: 0; opacity: 1; width: 200px; } 
.main-body .app-sidebar.active .top-sec { display: flex; flex-direction: column; gap: 9px; } 
.app-container .app-header .app-header__logo { width: 64% !important; justify-content: space-between; gap: 50px; } 
/* .main-body .app-sidebar.active .app-header-right { padding: 10px; } */
.main-body .app-sidebar.active .top-sec { gap: 0; } 
 }
@media (max-width:575px){
 .app-container .app-header.active { min-width: 100%; } 
.main-body .app-sidebar { width: 200px; } 
 }
@media (min-width:992px){
 .app-container .app-header .hamburger-sidebar { margin-left: 50px; cursor: pointer; transition: 0.5s ease-in-out; padding: 20px 30px 20px 20px; } 
.app-container .app-sidebar.side-in~.main-outer { left: 85px; width: calc(100% - 85px); transition: 0.5s ease-in-out; } 
.app-container .app-sidebar.side-in { width: 85px; transition: all 0.5s ease-in-out; } 
.app-container .app-header.side-in .logo-with-name { display: none; transition: 0.5s ease-in-out; } 
.app-container .app-header.side-in .short-logo { display: block; transition: 0.5s ease-in-out; } 
.app-container .app-sidebar.side-in .sidebar-heading { display: none; } 
.app-container .app-sidebar.side-in .workspace-accordion .accordion-item h2 .accordion-button::after { display: none; } 
.app-container .app-sidebar.side-in .accordion-item .accordion-header .accordion-button .sidebar-icon { margin: auto 10px auto 7px; } 
.app-container .app-sidebar.side-in .top-sec .workspace-accordion .accordion-item>.accordion-collapse { display: none; } 
.app-container .app-sidebar.side-in .myhome-sec .accordion-not { pointer-events: none; } 
.app-container .hamburger-sidebar .minsidebar { display: flex; align-items: center; justify-content: center; padding: 9px 10px; background-color: var(--primary_color); border-radius: 50%; border: none; } 
.app-container .hamburger-sidebar .minsidebar i { color: var(--white); font-size: 14px; } 
.app-container .app-header.side-in .hamburger-sidebar { margin-left: 0; } 
.app-container .app-header.side-in .hamburger-sidebar .minsidebar { transform: translate(-65px, calc(100vh - 135px)) rotate(180deg); transition: 0s ease-in-out; } 
 }
@media (min-width:1201px){
 .app-container .app-header.side-in .hamburger-sidebar { margin-left: 25px; } 
 }
 @media (min-width:1440px){
 .app-container .app-header .app-header__content .app-header-right .nav-right .user-sec .user-sec-profile .dropdown-menu.show
 {
 min-width: 175px !important; } 
 }

.dropdown-menu.show { padding: 0; } 
.app-container .main-body { display: flex; flex-flow: row wrap; } 
.main-body .main-outer { background-color: #f7f9fc; height: calc(100vh - 80px); width: calc(100% - 224px); padding: 20px 35px; display: flex; flex-direction: column; padding-left: 40px; } 
.main-body .main-outer .model { min-height: 44px; margin-bottom: 25px; } 
.main-body .main-outer .model .upload-file-sec { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } 
.main-body .main-outer .model .upload-file-sec h3 { text-transform: capitalize; } 
.main-body .main-outer .model .upload-file-sec h3 a { font-size: 16px; font-weight: 700; color: var(--primary_color); } 
.main-outer .outer { overflow-x: auto; height: 100%; } 
.main-outer .outer .file-sec { display: flex; justify-content: space-between; align-items: center; padding: 0 0 20px 0; } 
.main-outer .outer .file-sec .file-type { display: flex; gap: 15px 35px; flex-wrap: wrap; border-bottom: 1px solid #ddd; } 
.main-outer .outer .file-sec .file-type button { font-family: var(--primaryfont); text-decoration: none; background-color: transparent;border: 0; text-transform: capitalize; font-weight: 700; display: inline-block; border-bottom: 1px solid transparent; transition: .3s; font-size: 14px; line-height: 24px; padding: 0 0 10px 0; } 
.main-outer .outer .file-sec .file-type button .doc_no { margin-left: 5px; } 
.main-outer .outer .file-sec .file-type button:hover,
.main-outer .file-sec .file-type button.active,
.main-outer .file-sec .file-type button:focus { border-color: var(--secondary_color); color: var(--secondary_color); } 
.main-outer .outer .file-sec .search-sec,
.main-outer .profile-search-sec .search-sec { display: flex; align-items: center; margin-right: 15px; } 
.main-outer .outer .file-sec .search-sec .input-group,
.main-outer .profile-search-sec .search-sec .input-group { width: 231px; margin-right: 8px; } 
.main-outer .outer .file-sec .search-sec .has-search,
.main-outer .profile-search-sec .search-sec .has-search { position: relative; } 
.main-outer .outer .file-sec .search-sec .form-inp-btn,
.main-outer .profile-search-sec .search-sec .form-inp-btn { position: absolute; top: 6px; right: 7px; background-color: transparent; border: none; font-size: 14px; color: #495057; } 
.main-outer .outer .file-sec .search-sec .form-control-inp,
.main-outer .profile-search-sec .search-sec .form-control-inp { background-color: transparent; width: 240px; height: 31px; padding: 2px 9px 2px 9px; font-size: 14px; line-height: 14px; outline: none; border: 0; border-radius: 0; border-bottom: 1px solid var(--primary_color); } 
.main-outer .outer .filter-box { display: flex; justify-content: center; padding: 3px 13px; gap: 6px; border: 1px solid var(--primary_color); border-radius: 5px; width: 95px; align-items: center; } 
.main-outer .outer .filter-box i { color: #6c757d; } 
.main-outer .outer .table-responsive { height: calc(100% - 44px - 25px); min-width: 970px; border-radius: 20px; } 
.main-outer .outer .table-responsive table tr,
.main-outer .outer .table-responsive table th { text-align: center; } 
.main-outer .outer .table-responsive table a { font-size: 12px; line-height: 18px; transition: 1s; color: #4C5566; } 
.main-outer .outer .table-responsive table tr td:nth-child(2) { text-align: left; } 
.main-outer .outer .table-responsive table tr:last-child td:first-child { border-bottom-left-radius: 20px; } 
.main-outer .outer .table-responsive table tr:last-child td:last-child { border-bottom-right-radius: 20px; } 
.main-outer .outer .table-responsive table tr:last-child td { border:none; } 
.main-outer .outer .table-responsive table tr td a.approve { background-color: #c7f9c6; padding: 4px 7px; border-radius: 30px; } 
.main-outer .outer .table-responsive table tr td a.in-review { background-color: #c9e4ff; padding: 4px 7px; border-radius: 30px; } 
.main-outer .outer .table-responsive table tr td a.reject { background-color: #ff5c5c; color: var(--white); padding: 4px 7px; border-radius: 30px; } 
.main-outer .outer .table-responsive table tr th a { font-weight: 600; } 
.main-outer ul.download-dropdown { inset: 5px auto auto 43px !important; } 
.main-outer .delete { margin-left: 4px; } 
[data-tab-content] { display: none; } 
.active[data-tab-content] { display: table; } 
.modal.show .modal-dialog { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } 
.modal.fade .modal-dialog { transition: transform .3s ease; transform: translate(-50%, -50%); position: absolute; top: 50%; left: 50%; } 
.btn-sec .download-dropdown li a { text-align: center; } 
.table-responsive table tr td a .file-dropdown-icon { transform: rotate(90deg); } 

/*Profile page*/
.main-outer .main-c { display: flex; gap: 50px; flex-wrap: wrap; } 
.main-outer .main-c .info-sec { flex: 1; } 
.main-outer .main-c .info-sec p { font-size: 12px; } 
.main-outer .main-c .upload-sec { flex: 2; padding: 15px 25px; background: var(--white); border-radius: 20px; } 
.outer .avtar-sec .avtar-upload .profile-pic { display: flex; align-items: center; gap: 15px; } 
.outer .avtar-sec .avtar-upload .profile-pic img { border-radius: 50%; box-shadow: 0px 0px 5px 0px #c1c1c1; cursor: pointer; width: 80px; height: 80px; background-color: #ddd; } 
.main-c .upload-sec .upload-btn .primary-button,
.main-outer .delete-sec .primary-button { font-size: 14px; border: 1px solid transparent; border-radius: 5px; margin: 20px 0; padding: 3px 7px; } 
.main-c .upload-sec .upload-btn .primary-button:hover,
.delete-sec .primary-button:hover { border: 1px solid var(--primary_color); } 
.main-c .upload-sec .form .form-group input { width: 100%; } 

/* Profile Setting */
.upload-file-sec h3 span { font-size: 16px; font-weight: 700; color: var(--primary_color); text-transform: capitalize; } 
.main-outer .profile-search-sec { display: flex; justify-content: flex-end; } 
.app-container .profile-search-sec { padding: 12px 0 20px; } 
.main-outer .table-responsive .switch { display: inline-block; position: relative; width: 40px; height: 21px; border-radius: 20px; background: var(--primary_color); vertical-align: middle; cursor: pointer; } 
.main-outer .table-responsive .switch::before { content: ''; position: absolute; top: 5px; left: 5px; width: 10px; height: 10px; background: #fafafa; border-radius: 50%; transition: left 0.28s cubic-bezier(0.4, 0, 0.2, 1); } 
.main-outer .table-responsive input:checked + .switch { background: #6750A4; } 
.main-outer .table-responsive input:checked + .switch::before { left: 27px; background: var(--white); } 
.main-outer .table-responsive ul.dropdown-menu { text-align: left; min-width: 7rem !important; } 
.outer .table-responsive img.avtar_img { height: 33px; width: 33px; border-radius: 50%; } 
.main-outer .profile tr.files-info td:first-child>a { display: flex; justify-content: center; gap: 7px; align-items: center; } 
.main-outer .outer table td.status a { background-color: rgba(0, 255, 0, 0.25); color: rgb(33 38 34, 0.90); padding: 5px 10px; border-radius: 10px; } 

/* Integration page */
.main-outer .outer .card-body-content .contact-button { background-color: #A6A6A6; color: var(--white); border: none; } 
.main-outer .outer .card-body-content .contact-button:hover { background-color: var(--primary_color); } 
.main-outer .filter-buttons { display: flex; align-items: center; border: 1px solid #c88fd7; border-radius: 5px; } 
.main-outer .filter-buttons .list-view-button { border-right: 1px solid #c88fd7; border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; } 
.main-outer .filter-buttons .grid-view-button { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; } 
.main-outer .filter-buttons .list-view-button,
.main-outer .filter-buttons .grid-view-button { color: var(--primary_color); padding: 3px 10px; font-size: 14px; cursor: pointer; border-radius: 3px; } 
.main-outer .filter-buttons .list-view-button:hover,
.main-outer .filter-buttons .grid-view-button:hover,
.main-outer .filter-buttons .view-button.active { color: #fff; background-color: var(--primary_color); } 
.main-outer .filter-button .list-view-button { margin-right: 10px; } 
.main-outer .outer .list { list-style: none; margin: 0; padding: 0; display: flex; } 
.main-outer .outer .list.list-view-filter { flex-direction: column; } 
.main-outer .outer .list.list-view-filter .card-body-content .card-content { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 15px; padding: 0; } 
.main-outer .outer .list.list-view-filter .card-body-content { padding: 0 10px 0 0 !important; } 
.main-outer .outer .list.list-view-filter .card-body-content .card-content { text-align: center; } 
.main-outer .outer .list.list-view-filter li .list-group-item .card-content img { border-top-left-radius: 6px; border-bottom-left-radius: 6px; } 
.main-outer .outer .list.grid-view-filter { flex-flow: row wrap; align-items: center; justify-content: center; gap: 20px; } 
.main-outer .outer .list.grid-view-filter li { width: 300px; margin-top: 0 !important; margin-bottom: 0 !important; } 
.main-outer .outer .list.grid-view-filter li .list-group-item { padding: 10px 15px; display: flex; flex-direction: column; align-items: center; gap: 25px; } 
.main-outer .outer .list.grid-view-filter li .list-group-item .card-content { text-align: center; } 
.main-outer .outer .list.grid-view-filter li .list-group-item .card-content img { height: 125px; width: auto; margin-bottom: 25px; box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.2), 0 2px 5px 0 rgba(0, 0, 0, 0.19); } 

/* Document Page */
.main-outer .outer .file-sec .search-sec.doc-search-sec { margin-left: auto; } 
.main-outer .outer .doc-sec { margin: 0 0 20px 0; min-width: 970px; } 
.main-outer .outer .doc-sec .doc-title { gap: 15px; } 
.main-outer .outer .doc-sec .doc-title h5 { line-height: 18px; font-weight: 600; color: #4C5566; } 
.main-outer .outer .doc-sec .sec-time { gap:25px; } 
.main-outer .outer .doc-sec .doc-sec1 { width: 49%; padding: 10px 15px; background-color: var(--white); border-radius: 10px; } 
.main-outer .outer .doc-sec .doc-sec2 { width: 49%; padding: 10px 15px; background-color: var(--white); border-radius: 10px; } 
.main-outer .outer .doc-table.table-responsive { height: auto; } 

/* Frame */
.profile-card-body { display: flex; align-items: center; justify-content: center; height: 100vh; background-color: #ebf0fc; } 
.profile-card { background-color: white; color: #130c35; height: auto; border-radius: 10px; box-shadow: none; display: flex; align-items: center; justify-content: center; flex-direction: column; } 
.profile-card-content .profile-card-item { display: flex; align-items: center; padding: 5px; } 
.profile-card-content .profile-card-img { padding: 0 20px 0 0; } 
.profile-card-content .profile-card-img img { height: 31px; } 
.profile-card-content .profile-card-link { display: flex; align-items: center; text-decoration: none; color: #000; } 
.profile-card-list { list-style: none; } 
.profile-card-list .profile-card-item { display: block; position: relative; width: 100%; padding: 7px } 
.profile-card-list .profile-card-item input[type=radio] { position: absolute; visibility: hidden; } 
.profile-card-list .profile-card-item label { display: block; position: relative; font-weight: 400; font-size: 18px; padding: 0px 50px; z-index: 9; cursor: pointer; } 
.profile-card-list .profile-card-item .check { display: block; position: absolute; border: 3px solid var(--black); border-radius: 100%; height: 23px; width: 23px; top: 9px; left: 21px; z-index: 5; transition: border .25s linear; } 
.profile-card-list .profile-card-item .check::before { display: block; position: absolute; content: ''; border-radius: 100%; height: 13px; width: 13px; top: 2px; left: 2px; margin: auto; } 
.profile-card-list .profile-card-item input[type=radio]:checked ~ .check::before { background: var(--black); } 
.profile-card-list .profile-card-item input[type=radio]:checked ~ label { color: var(--black); } 
.profile-card-item .profile-link { font-size: 22px; color: #686868; font-weight: 400; text-transform: capitalize; padding: 0 12px; } 

/*Model Popup*/
.modal-content { border-radius: 10px; padding: 15px 25px 10px; } 
.modal-content .modal-body { padding: 30px 8px 8px 8px !important; } 
.modal-content .modal-head { display: flex; justify-content: space-between; align-items: center; padding: 3px 15px 6px; } 
.modal-header { border-bottom: none; } 
.modal-head .close-btn { height: 1px; width: 1px; color: black; outline: none; } 
.modal-head .close-btn:focus { outline: none; box-shadow: none; } 
hr.border-hr { margin: 0; color: var(--accent); opacity: 1; } 
button:focus { outline: none; } 
.modal-content .modal-body .model-form-control { border-radius: 5px; background-color: var(--body_color); padding: 5px 13px; color: var(--black); margin-top: 5px; } 
.form-control:focus { color: var(--accent); background-color: var(--white); border-color: #dcdcdc; outline: 0; box-shadow: none; } 
.modal-content .modal-body .model-form-control::placeholder,
.member-link-sec input::placeholder { font-size: 14px; } 
.modal-dialog .modal-content { width: 450px; margin: 0 auto; background: var(--white); } 
.modal-footer { border-top: none !important; } 
.modal-footer .btn { padding: 6px 67px; } 
.modal-footer .save-btn,
.done-btn { padding: 6px 75px; border-radius: 10px; background-color: var(--primary_color); color: var(--white); border: 1px solid var(--primary_color); font-size: 14px; transition: 1s; } 
.modal-footer .save-btn:hover,
.done-btn:hover { background-color: #8f16b1; color: var(--white); } 
.modal-footer .cancel-btn { padding: 6px 75px; border-radius: 10px; background-color: var(--btn1hvrbg); color: var(--btn1hvrtext); border: 1px solid var(--btn1hvrborder); font-size: 14px; transition: 1s; } 
.modal-footer .cancel-btn:hover { background-color: var(--btn1bg); color: var(--btn1text); } 
.modal-footer .delete-btn { padding: 6px 12px; border-radius: 10px; background-color: var(--white); color: var(--primary_color); border: 1px solid var(--primary_color); font-size: 14px; transition: 1s; } 
.modal-head .modal-data img { height: 18px; margin: 0 12px; } 
.modal-head .modal-data { font-size: 16px; font-weight: 900; } 
.nav-tabs .span-nav-link { height: 25px; width: 25px; border-radius: 50%; background-color: var(--body_color); margin-right: 15px; display: block; line-height: 25px; text-align: center; font-size: 15px; font-weight: bold; } 
hr.border-hrr { width: 100%; border-top: 1px solid black; } 
.modal-body .nav-tabs { border: none; padding: 10px 0px; } 
.modal-body .nav-tabs .nav-link { color: #D0BCFF; border: none; display: flex; justify-content: center; align-items: center; font-size: 15px; font-weight: 500; } 
.modal-body .nav-tabs .nav-link.active { color: #333333; } 
.member-link-sec .member-inp { height: 40px; width: 300px; padding: 10px; border: 1px solid var(--accent); } 
.modal-content .member-btn { padding: 5px 12px; border-radius: 10px; background-color: var(--white); color: var(--primary_color); border: 1px solid var(--primary_color); font-size: 14px; } 
.modal-body .member-content-sec { padding: 3px 0; } 
.modal-body .member-content-sec h5 { font-size: 15px; font-weight: 400; } 
.member-content-sec .member-inp-sec { height: 35px; width: 100%; padding: 10px; } 
.modal-body .member-content-sec h4 { font-size: 15px; } 
.modal-body .form-group textarea { background: #dcdcdc; border-radius: 9px; padding: 6px 6px; margin-top: 5px; border: none; } 
.modal-body .form-group textarea:focus { box-shadow: none; outline: 0; } 
.modal-footer { padding: 8px 0; } 
.modal-footer.upload-sec { justify-content: space-around; } 
.modal-content .date-section { position: relative; height: 120px } 
.modal-content .date-section .date-section-center { position: absolute; top: 50%; left: 0; right: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%) } 
.date-section-center .date-form { position: relative; max-width: 642px; width: 100%; margin: auto; padding: 16px; border-radius: 5px; z-index: 20; } 
.date-section-center .date-form::before { content: ''; position: absolute; left: 0; right: 0; bottom: 0; top: 0; z-index: -1; } 
.date-section-center .date-form .date-form-group { position: relative; } 
.date-section-center .date-form .date-form-control { background-color: var(--body_color); height: 45px; padding: 0px 10px; border: none; border-radius: 10px; color: #000; -webkit-box-shadow: 0px 0px 0px 2px transparent; box-shadow: 0px 0px 0px 2px transparent; -webkit-transition: 0.2s; transition: 0.2s; } 
.date-section-center .date-form .date-form-control::placeholder { color: #000; } 
.date-section-center .date-form input[type="date"].date-form-control:invalid { color: #3f3d3d; } 
.date-section-center .date-form input[type="date"].date-form-control+.date-form-label { opacity: 1; top: -22px; left: 5px; } 
.date-section-center .date-form .date-form-label-1 { position: absolute; top: -19px; left: 7px; color: #000; font-size: 16px; font-weight: 500; letter-spacing: 1.3px; line-height: 5px; transition: 0.2s all; } 
.date-section-center .date-form .date-form-label-2 { position: absolute; top: -3px; left: 54%; color: #000; font-size: 16px; font-weight: 500; letter-spacing: 1.3px; line-height: 5px; transition: 0.2s all; } 

/*New Model File*/
.file-upload-data { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 70px; gap: 8px; border: 1px dashed #333333; background-color: var(--white); border-radius: 10px; } 
.file-upload-data img { height: 30px; } 
.file-upload-data input[type="file"] { max-width: 100%; } 
.file-upload-data input { height: 35px; margin: 0 auto; width: 211px; } 
.file-upload-data h4 { text-transform: capitalize; color: #000; } 
.upload-from-device .google-drive-img,
.upload-from-device .dropbox-img { height: 20px; margin-left: 8px; } 
.file-upload-body { display: flex; align-items: center; justify-content: center; height: 100vh; } 
.modal-body .nav-tabs .nav-link-btn { color: #D0BCFF; border: none; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: 900; background: none; line-height: 20px; margin-right: 10px; } 
.modal-body .nav-tabs .nav-link-btn.active { color: var(--accent); } 
.nav-tabs .span-nav-link-tab { height: 25px; border-radius: 50%; background-color: var(--body_color); margin-right: 10px; width: 25px; display: block; line-height: 25px; text-align: center; font-size: 15px; font-weight: bold; } 
.modal-footer-tab { border-top: none !important; } 
.modal-body .file-upload-data .file { position: relative; display: flex; justify-content: center; align-items: center; } 
.modal-body .file-upload-data .file > input[type='file'] { display: none } 
.modal-body .file-upload-data .file > label { font-size: 14px; font-weight: 400; cursor: pointer; outline: 0; user-select: none; border-radius: 5px; background-color: var(--primary_color); color: var(--white); padding: 7px 10px; display: flex; justify-content: center; align-items: center; transition: 1s; } 
.modal-body .file-upload-data .file i { margin-right: 5px; } 
.modal-body .file-upload-data .file--upload > label:hover { border: none; background-color: #8f16b1; } 
.modal-footer-tab .nav-item .nav-item-link { text-decoration: none; } 

/* Login Page */
.inp-sec { position: relative; } 
.loggin-link .btn-sign { font-size: 12px; color: var(--black); } 
.loggin-link .btn-sign-span { color: var(--primary_color) !important; text-decoration: underline; cursor: pointer; font-size: 12px; } 
.login-icon-img,
.create-icon-img { background: none; border: none; color: #000; font-size: 13px; position: absolute; right: 2%; top: 25%; z-index: 9; } 
.login-icon-img,
.create-icon-img .fa { font-size: 16px; } 
.modal-dialog.login .modal-content { width: 500px; padding: 30px 20px 20px; } 
form.login-form { padding: 0 30px 30px; } 
form.login-form .mail-inp { margin-top: 25px; margin-bottom: 0; } 
form.login-form .pass-inp { margin-bottom: 0; } 
.mail-inp::placeholder,
.pass-inp::placeholder { color: #333333; } 
form.login-form .forgot-pass { margin: 5px 0 0; } 
form.login-form .forgot-pass h5:hover { color: var(--primary_color); cursor: pointer; } 
#mysignup .forgot-pass { opacity: 0; } 

/* Download Dropdown */
ul.dropdown-menu { background-color: var(--white); text-align: left; min-width: 7rem !important; } 
.dropdown-menu.show a.dropdown-item { padding: 5px 0 5px 10px; display: flex; align-items: center; gap: 10px; border-radius: 0; color: var(--black); border: none; } 
.button-2.cta_btn.icon-btn .dropdown-menu.show a.dropdown-item { background-color: var(--white); } 
.btn-sec a::after { display: none; } 
.dropdown-toggle::after { display: none; } 
.dropdown-menu.show a.dropdown-item:active,
.dropdown-menu.show a.dropdown-item:hover,
.dropdown-menu.show a.dropdown-item:focus { background-color: #f1f1f1; color: #000; transition: 0.3s ease-in-out; } 
.invoice-sec ul.dropdown-menu li .dropdown-item { padding: 5px 10px; } 
.invoice-sec .dropdown-menu.show a.dropdown-item:active i,
.invoice-sec .dropdown-menu.show a.dropdown-item:hover i,
.invoice-sec .dropdown-menu.show a.dropdown-item:focus i { color: #000; transition: 0.3s ease-in-out; } 

/* invoice dropdown */
.invoice-dropdown-toggle::after { display: none; } 
.main-body .app-sidebar .home-collapse .invoice-sec ul.dropdown-menu { background-color: #471954; text-align: center; inset: 0 auto auto -110px !important; min-width: 7rem !important; } 
.main-body .app-sidebar .home-collapse .invoice-sec ul.dropdown-menu li:hover a.dropdown-item,
.main-body .app-sidebar .home-collapse .invoice-sec ul.dropdown-menu li:hover i { background-color: #5d0f72; transition: 0.3s ease-in-out; color: var(--white); } 
.file-dropdown-toggle::after { display: none; } 
.accordion-button:not(.collapsed) { background: var(--white); box-shadow: none; } 
.workspace-accordion .accordion-item h2 .accordion-button::after { width: 16px; height: 16px; background-size: cover; position: absolute; right: 10px; filter: brightness(0) invert(1); } 
.workspace-accordion .accordion-item h2 .accordion-button.btn-hidden::after { display: none; } 
.app-header .hamburger-sidebar { display: none; } 

/* Notification dropdown */
.notificationLink { position:relative; } 
.notificationContainer { background-color: #fff; border: 1px solid rgba(100, 100, 100, .4); -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, .25); overflow: hidden; position: absolute; top: 60px; right: 80px; width: 400px; height: 200px; z-index: 1; display: none; } 
.notificationContainer:before { content: ''; display: block; position: absolute; width: 0; height: 0; color: transparent; border: 10px solid black; border-color: transparent transparent white; margin-top: -20px; margin-left: 124px; } 
.notificationContainer .notificationTitle { font-weight: bold; padding: 8px; font-size: 14px; letter-spacing: 0.8px; color: #4C5566; background-color: var(--white); position: fixed; z-index: 10; width: 398px; border-bottom: 1px solid #dddddd; } 
.notificationContainer .notificationsBody { padding: 33px 0px 0px 0px !important; min-height:160px; } 
.notificationContainer .notificationFooter { background-color: #e9eaed; text-align: center; font-weight: bold; padding: 8px; font-size: 12px; border-top: 1px solid #dddddd; } 
.notificationContainer .notificationFooter a { font-size: 12px; } 


/************ Responsive CSS ***************/
@media (min-width:1440px){
    .main-outer .outer .file-info a { font-size: 14px; } 
    .main-outer .outer .file-sec .file-type button { font-size: 16px; } 
    .file-dropdown-toggle ul.dropdown-menu { inset: -14px auto auto 92% !important; } 
    .main-outer .outer .table-responsive table tr td a { font-size: 14px; } 
    .main-outer .filter-buttons .list-view-button,
    .main-outer .filter-buttons .grid-view-button { padding: 5px 10px; font-size: 18px; } 
 }
@media (max-width:1200px){
 .main-outer .outer .file-sec .file-type button { font-size: 12px; } 
 }
@media (max-width:1024px) { /* Profile Page */
.main-outer.profile { padding: 80px; } 

/* Login page */
.border-footer { display: none; } 
.icon-img { top: 57%; } 
 }
@media (max-width:991px){
 .main-body .main-outer { transition: 0.3s; padding: 30px 15px; } 
.main-outer .outer table { overflow-x: auto; } 

/* Profile Page */
.main-outer.profile.active { padding: 40px; } 
.main-outer.profile.active input#old-pass { margin: 10px 25px; padding: 0; } 
.main-outer.profile.active input#new-pass { margin: 10px 20px; padding: 0; } 
.main-outer.profile.active input#confirm-pass { margin: 10px 0; padding: 0; } 
.main-outer.profile.active input#name { padding: 0; } 
form label { font-size: 14px; } 
input#name::placeholder { font-size: 14px; } 

/* Login Page */
.form-right .otp-heading { font-size: 24px !important; } 
.otp-below-heading { font-size: 13px; } 
.otp-field input { height: 26px; width: 26px; } 
 }
@media (max-width:768px){
 .form-left-image { width: 250px !important; } 
.icon-img { top: 77%; } 
.border-footer { display: none; } 
.form-right .otp-heading { font-size: 32px !important; } 
.otp-below-heading { font-size: 16px; } 
.otp-field input { height: 40px; width: 40px; } 
.otp-sec { margin-top: -25px; } 
body { height: auto; } 
 }
@media (max-width:767px){
 .main-body .main-outer { width: 100%; } 
.main-outer .model,
.file-sec { padding: 10px 0; } 
.main-outer .file-sec { flex-direction: column; gap: 10px; align-items: flex-start } 
.file-upload-sec { padding: 20px; } 
.file-upload-sec h4 { font-size: 16px; } 
.pagination-sec .go_to_page { font-size: 12px; } 
.pagination-sec span,
#pagination a,
.pagination-sec select { font-size: 12px; } 
.pagination-sec { padding: 10px; margin: 10px 0; } 
.file-info .files-info h3 { font-size: 22px; } 
.file-info .files-info h4 { font-size: 14px; } 
.btn-sec { display: flex; flex-wrap: wrap; gap: 5px; } 

/* New Profile Page */
.main-outer.active .main-c { display: block; } 

/* Profile Page */
.main-outer.profile { padding: 40px 80px; } 
.main-outer.profile.active { padding: 40px 20px; } 
.main-outer.profile.active .personal-setting form { display: flex; flex-direction: column; gap: 0; } 
.main-outer.profile.active form { display: flex; flex-direction: column; } 
.main-outer.profile.active input#old-pass,
.main-outer.profile.active input#new-pass,
.main-outer.profile.active input#confirm-pass { margin: 0; } 

/* Login Page */
.form-left .fins-img { display: none; } 
 }
@media (max-width:575px){
 .file-sec .file-type a,
.filter-box span { font-size: 14px; } 
.file-upload-sec h4 { font-size: 14px; } 
.form-outline input#search-focus { font-size: 14px; } 
.file-upload-sec input[type="file"] { font-size: 14px; } 
.upload-file-sec { flex-direction: column; gap: 10px; flex-wrap: wrap; } 
.upload-file-sec .primary-button,
.upload-file-sec .secondary-button { padding: 5px 8px; } 
.primary-button { padding: 5px; font-size: 14px; } 
.file-info .files-info h3 { font-size: 18px; } 
.pagination-sec { flex-direction: column; } 

/* Profile Page */
.main-outer.profile { padding: 40px 20px; } 
.main-outer .main-c .info-sec,
.main-outer .main-c .upload-sec { flex: 1; } 
.main-outer .main-c { display: block; } 
.main-outer .delete-sec .primary-button { margin: auto; } 
.main-c .upload-sec .upload-btn,
.main-outer .outer .delete-sec { display: flex; justify-content: center; } 
.main-c .upload-sec .form .form-group label { font-size: 12px; } 

/*Integation Page*/
.main-outer .outer .list.list-view-filter .card-body-content .card-content { padding-top: 10px; padding-bottom: 20px; justify-content: center; gap: 0 23px; } 
 }
@media (max-width:480px){
 .main-outer .file-sec .file-type { flex-wrap: wrap; gap: 0 15px; } 

/* Profile Page */
.main-outer.profile { padding: 40px; } 
.personal-setting form { flex-direction: column; gap: 10px; } 
.main-outer.profile input#old-pass { margin: 5px 0; padding: 0; } 
.main-outer.profile input#new-pass { margin: 5px 0; padding: 0; } 
.main-outer.profile input#confirm-pass { margin: 5px 0; padding: 0; } 
.main-outer.profile input#name { padding: 0; } 
.main-outer.profile.active .personal-setting form label { margin: 0; } 
form label { font-size: 14px; } 
.main-outer.profile.active form label { margin: 0 10px; } 
.password-change { display: flex; flex-direction: column; gap: 0; } 
.main-outer.profile.active input#name { width: 180px; } 
.main-outer.profile.active input#old-pass,
.main-outer.profile.active input#new-pass,
.main-outer.profile.active input#confirm-pass { margin: 0 10px; width: 180px; } 
 }