/*declaring variables*/
:root {
  --ps-primary: #3282c0;
  --ps-secondary: #019934;
  --ps-btn-gml: #ea4335;
  --ps-btn-twt: #1da1f2;
  --ps-btn-ln: #0077b5;
  --ps-btn-fb: #1877f2;
  --ps-priGrad: linear-gradient(#019934, #1c1b17);
  --ps-font-poppins: 'Poppins', sans-serif;
  --ps-font-noto: 'Noto Sans', sans-serif;
  --text-black:#000;
}
/* For Firefox */
/* Set the width of the scrollbar */
html {
  scrollbar-width: thin;
 scrollbar-width: 10px; /* Width of the scrollbar */
}

/* Set the color and shape of the thumb */
html {
  scrollbar-color: #ccc transparent; 
  scrollbar-border-radius: 10px;
}
/*declaring variables endss*/

@font-face {
    font-family: 'AAutoSignature1GD9j';
    src: url('../fonts/AAutoSignature1GD9j.eot');
    src: url('../fonts/AAutoSignature1GD9j.eot') format('embedded-opentype'),
         url('../fonts/AAutoSignature1GD9j.woff2') format('woff2'),
         url('../fonts/AAutoSignature1GD9j.woff') format('woff'),
         url('../fonts/AAutoSignature1GD9j.ttf') format('truetype'),
         url('../fonts/AAutoSignature1GD9j.svg#AAutoSignature1GD9j') format('svg');
}
@font-face {
    font-family: 'AngkanyaSebelasVGPDB';
    src: url('../fonts/AngkanyaSebelasVGPDB.eot');
    src: url('../fonts/AngkanyaSebelasVGPDB.eot') format('embedded-opentype'),
         url('../fonts/AngkanyaSebelasVGPDB.woff2') format('woff2'),
         url('../fonts/AngkanyaSebelasVGPDB.woff') format('woff'),
         url('../fonts/AngkanyaSebelasVGPDB.ttf') format('truetype'),
         url('../fonts/AngkanyaSebelasVGPDB.svg#AngkanyaSebelasVGPDB') format('svg');
}
@font-face {
    font-family: 'Pwsignaturetwor55O';
    src: url('../fonts/Pwsignaturetwor55O.eot');
    src: url('../fonts/Pwsignaturetwor55O.eot') format('embedded-opentype'),
         url('../fonts/Pwsignaturetwor55O.woff2') format('woff2'),
         url('../fonts/Pwsignaturetwor55O.woff') format('woff'),
         url('../fonts/Pwsignaturetwor55O.ttf') format('truetype'),
         url('../fonts/Pwsignaturetwor55O.svg#Pwsignaturetwor55O') format('svg');
}
@font-face {
    font-family: 'BatfideSignatureL39K3';
    src: url('../fonts/BatfideSignatureL39K3.eot');
    src: url('../fonts/BatfideSignatureL39K3.eot') format('embedded-opentype'),
         url('../fonts/BatfideSignatureL39K3.woff2') format('woff2'),
         url('../fonts/BatfideSignatureL39K3.woff') format('woff'),
         url('../fonts/BatfideSignatureL39K3.ttf') format('truetype'),
         url('../fonts/BatfideSignatureL39K3.svg#BatfideSignatureL39K3') format('svg');
}




body{font-family: var(--ps-font-noto);}
.card .card-body{font-family: var(--ps-font-noto);}
.history-info .dropdown-menu.show:before {content: '\f0d8'; font-family: 'Font Awesome 5 Free';
  position: absolute; top: -45px; font-size: 30px; color: black; overflow: visible; right: 0;}
  h1, .h1, .h1, h2, .h2, .h2, h3, .h3, .h3, h4, .h4, .h4 {letter-spacing: 0rem;}
  h1, .h1, .h1, h2, .h2, .h2, h3, .h3, .h3 {font-weight: normal;}
  h4, .h4, .h4, h5, .h5, .h5, h6, .h6, .h6 {font-weight: normal;}
  a {letter-spacing: 0rem;}
  .table th {font-weight: 500;}
  .table td {font-weight: 400;}
  .navbar .nav-link {font-weight: 400;}
  .cstmHeading1{color: #000; margin-bottom: 25px; font-weight: 300; padding-top: 20px;} 


/*custom buttons*/
.btn{font-family: var(--ps-font-noto); outline:none; box-shadow:none; position: relative; overflow: hidden;}
.fb{background:var(--ps-btn-fb)!important; font-family: var(--ps-font-noto);}
.fb:hover{background:#1b3772;}
.gml{background:var(--ps-btn-gml)!important; font-family: var(--ps-font-noto);}
.gml:hover, .gml:active{background:#b7261a;}
.twt{background:var(--ps-btn-twt)!important; font-family: var(--ps-font-noto);}
.twt:hover{background:#082b75;}
.ln{background:var(--ps-btn-ln)!important; font-family: var(--ps-font-noto);}
.ln:hover, .ln:active{background:#004d77;}
.btn.btn-login { background: #019934;}
.btn-login i.fas.fa-check{ position: absolute;opacity: 0.1;left: 2px;top: 4px; font-size: 58px;}
.btn-login i.fas.fa-times { position: absolute;opacity: 0.1;left: 2px;top: 4px;font-size: 58px;}
.btn.btn-login:hover { background: #246239;}
.btn-primary{background:#019934;}
.btn-primary:hover,.btn-primary:focus,.btn-primary:active{background:#246239;}
.btn-danger{background:#e7113c;}
.btn-danger:hover,.btn-danger:focus,.btn-danger:active{background:#9f0c29;}
.btn-danger{background:#e7113c;}
.btn-danger:hover,.btn-danger:focus,.btn-danger:active{background:#9f0c29;}
.border-start-danger{border-left-color: #f55242 !important;}
.border-start-orange{border-left-color: #fb7440 !important;}
.border-start-primary {  border-left-color: #0061f2 !important; }
.border-start-secondary { border-left-color: #6900c7 !important; }
.border-start-success {  border-left-color: #2dce89 !important; }
.border-start-lg { border-left-width: 0.25rem !important;   }
.btn-snd{background: var(--ps-primary);}
.text-black{color:var(--text-black);}

/*custom heading*/  
.heading-border {  position: relative;  display: inline-block;  color: #019934;  font-size: 31px;}  
.heading-border::before {  content: "";  height: 3px;  width: 70%;  background: #019934;  position: absolute;  bottom: 0;}  
/*custom heading*/

/*global animation on button*/
.btn::before {background: linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); content: ""; display: block; height: 100%;
    left: -75%; position: absolute; top: 0; transform: skewX(-25deg); width: 50%; z-index: 2;}
    .btn:hover::before,.btn:focus::before { animation: shine .85s}
/*global animation on button ends*/

/*custom buttons ends*/

hr.horizontal.dark{background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));}

/*animation effect 2*/
.tpCds .card { position: relative; overflow: hidden; cursor: pointer;}
.tpCds .card {width:100%;  border-radius: 0px; background:#fff; box-shadow: 0px 0px 5px #666; min-height: 118px;}
.tpCds .card::before {background: linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 100%); content: ""; display: block; height: 100%;
    left: -75%; position: absolute; top: 0; transform: skewX(-25deg); width: 50%; z-index: 2;}
    .tpCds .card:hover::before,.tpCds .card:focus::before { animation: shine .85s}
    .tpCds .card.gradRed::before {background: linear-gradient(to right,rgba(245, 96, 54, 0.4) 0%,rgba(245, 96, 54, 0.1) 100%); content: ""; display: block; height: 100%; left: -75%; position: absolute; top: 0; transform: skewX(-25deg); width: 20%; z-index: 2;}
    .tpCds .card.gradBlu::before {background: linear-gradient(to right,rgba(105, 108, 228, 0.4) 0%,rgba(105, 108, 228, 0.1) 100%); content: ""; display: block; height: 100%; left: -75%; position: absolute; top: 0; transform: skewX(-25deg); width: 20%; z-index: 2;}
    .tpCds .card.gradOrng::before {background: linear-gradient(to right,rgba(251, 177, 64, 0.4) 0%,rgba(251, 177, 64, 0.1) 100%); content: ""; display: block; height: 100%; left: -75%; position: absolute; top: 0; transform: skewX(-25deg); width: 20%; z-index: 2;}
    .tpCds .card.gradGrn::before {background: linear-gradient(to right,rgba(45, 206, 137, 0.4) 0%,rgba(45, 206, 137, 0.1) 100%); content: ""; display: block; height: 100%; left: -75%; position: absolute; top: 0; transform: skewX(-25deg); width: 20%; z-index: 2;}

    @keyframes shine {
        100% {
            left: 125%
        }
    }
/*animation effect 2 ends*/

/*activity-feed starts*/
.activity-feed { padding: 15px; width: 50%; margin: 0 auto;}
.activity-feed .feed-item {position: relative; padding-bottom:65px;padding-left: 30px;border-left: 2px solid #e4e8eb;}
.activity-feed .feed-item:last-child {border-color: transparent;}
.activity-feed .feed-item:after {content: ""; display: block; position: absolute; top: 0; left: -6px; width: 10px; height: 10px; border-radius: 6px; background: #fff;border: 1px solid #ccc;}
.activity-feed .feed-item .date {position: relative;top: -5px;color: #8c96a3;text-transform: uppercase;font-size: 13px;}
.activity-feed .feed-item .text {position: relative;top: -3px;}
.activity-feed .feed-item1 {    position: relative;    padding-bottom: 65px;    padding-left: 30px;    border-left: 2px solid #0bc132;}
.activity-feed .feed-item1:after {    content: ""; display: block; position: absolute; top: 0; left: -6px; width: 10px; height: 10px;  border-radius: 6px;background: #0bc132;  border: 1px solid #0bc132;}
.feed-text{  color: #ccc;}
.tracking-date {  position: absolute;  left: -3rem; top: -10px; width: 7.5rem;  text-align: right;}
#activitystatus .modal-body {height: 420px; overflow: hidden; overflow-y: auto;}
/*activity-feed ends*/

/*common styles for all pages*/
.btn-close{background: url(../img/close-icon.svg)no-repeat;}
.navbar-vertical.navbar-expand-xs{z-index: 999;}
.modal-body{height: 350px;}
.modal{--bs-modal-width: 550px; z-index: 9999; width: 800px;  margin: 0 auto; left: 0; right: 0;}
.modal .btn-close{width: 20px; height: 20px; padding: 0!important; position: absolute;
    right: 20px; top: 25px;}
.text-orange{color:#fb8840;}
a.dropdown-item {cursor: pointer;}

/*common styles for all pages ends*/

.navbar-nav i { color: #019934; font-size: 18px;}
.navbar-vertical .navbar-nav .nav-link .icon i { font-size: 16px; top: 0;}
.navbar-vertical .navbar-nav .nav-link.active .icon i, .navbar-vertical.bg-white .navbar-nav>.nav-item .nav-link:hover .icon i { color: #019934;opacity:1;}

/*header*/
.user-prf {max-width: 35px;  margin-right: 10px;}
.dropdown .btn.dropdown-toggle {background: none;color: #fff;box-shadow: none; margin: 0 0 0 20px;    padding: 0; font-weight: 300;}
.btn:hover:not(.btn-icon-only){transform: none;}
.dropdown:not(.dropdown-hover) .dropdown-menu {margin-top: 15px !important;}
.dropdown .dropdown-menu.show li a i.fas {margin-right: 6px;}
.dropdown .dropdown-menu.show li:hover a i.fas{color: #0f5624;}
.dropdown .dropdown-menu.show li .dropdown-item {padding: 8px 10px 8px 15px;}
.navbar-nav li.nav-item.dropdown .badge {position: absolute;top: -10px;left: 11px;background: #fff;width: 22px;height: 18px;padding: 0; color: #000;  border-radius: 12px; line-height: 18px; box-shadow: 0px 0px 5px #000; font-weight: 400;}
.navbar-nav li.nav-item.dropdown a .fa-bell { font-size: 18px; color:#fff;}
.shake {animation: shake 2s infinite;}
@keyframes shake {0%, 25%, 83%, 100% {transform: scale(1) rotatez(0deg) translateX(0);}
6.25%, 31.25%, 56.25%, 81.25% {transform: scale(1.1) rotatez(-10deg) translateX(2px);}
18.75%, 43.75%, 68.75%, 93.75% {transform: scale(0.9) rotatez(10deg) translateX(-2px);}}
.dropdown .dropdown-menu.show li .dropdown-item .noti-icn i {background: #019934; width: 35px; height: 35px; border-radius: 10px; line-height: 35px; text-align: center; margin-right:10px;}
.dropdown .dropdown-menu.show li .dropdown-item .noti-icn i::before { font-size: 16px; color: #fff;}
.dropdown .dropdown-menu.show li .dropdown-item h6 span { color: #000;}
.ntfys{height: 300px;overflow: hidden; overflow-y: auto;}
.nav-link.show ~ .notify-parent:before { font-family: "FontAwesome"; content: "\f0d8"; position: absolute;
    top: 31px; right: 8px; left: auto; font-size: 22px; color: #fff; transition: top 2s ease;}

/*header ends*/

/*body*/
.jumbotron {padding: 4rem 2rem; background-color: #eaecf4; border-radius: 0.3rem;}
.bg-primary { background-color: var(--ps-primary) !important; background: var(--ps-priGrad);}
.mb-logo{display:none!important;}
.navbar {box-shadow: 0px 0px 5px #000!important;}
.dasBrd .navbar {box-shadow: none!important; background: transparent;}
.dasBrd .navbar.position-fixed {background: #3b82b7 !important; box-shadow: none!important; z-index: 999;
    width: calc(100% - 20rem); box-sizing: border-box; top: 0px; border-radius: 0;}
.desk-show{display:block;}
.xs-show{display:none;}
input{border: none!important; border-bottom: 1px solid #ccc!important; border-radius: 0!important;}
input[type="radio"]{border:1px solid #ccc!important; border-radius: 50%!important;}
input:focus{box-shadow:none!important; border-bottom: 1px solid #000!important;}

.was-validated .form-check-input:valid~.form-check-label, .form-check-input.is-valid~.form-check-label {color: #000;}

/*.dasBrd .navbar.position-fixed #navbar { justify-content: space-between!important;}*/
.dasBrd .navbar.position-fixed #navbar .dshbrd-hdr {position: absolute; text-align: left; right: auto; top: 10px; z-index: 999; left: 40px;}
.dasBrd .navbar.position-fixed #navbar .dshbrd-hdr p, .dasBrd .navbar.position-fixed #navbar .dshbrd-hdr p a {
    margin: 0;}
.scroll-to-top {position: fixed;right: 1rem;bottom: 1rem;display: none;width: 2.75rem;
  height: 2.75rem; text-align: center; color: #fff; background: rgba(90, 92, 105, 0.5);
  line-height: 46px; z-index: 1;}

.scroll-to-top:focus, .scroll-to-top:hover {
  color: white;
}

.scroll-to-top:hover {
  background: #5a5c69;
}

.scroll-to-top i {
  font-weight: 800;
}

/*body ends*/

/*footer*/
.social-icons a img{max-width:15px; margin:5px;}
.social-icons i {color: #ccc;font-size: 18px; margin: 0 6px; height: 30px; width: 30px; line-height: 30px; text-align: center;}
.social-icons i.fa-facebook-f:hover {background: #1093f4; height: 30px; width: 30px; border-radius: 50%; color:var(--bs-white);}
.social-icons i.fa-twitter:hover {background: #27a1fc; height: 30px; width: 30px; border-radius: 50%; color:var(--bs-white)}
.social-icons i.fa-instagram:hover {background:  #ec683b; height: 30px; width: 30px; border-radius: 50%; color:var(--bs-white)}
.social-icons i.fa-linkedin-in:hover {background: #1a82ba; height: 30px; width: 30px; border-radius: 50%; color:var(--bs-white)}
.social-icons i.fa-youtube:hover {background: #e91a07; height: 30px; width: 30px; border-radius: 50%; color:var(--bs-white)}
.footer .nav-link:hover {color: var(--ps-primary);}
/*footer ends*/

/*dashboard*/
.dasBrd .card-body .text-xs {font-size: 13px !important;}
/*.dasBrd .bg-gradient-primary{background: #019934;}*/
.dasBrd .bg-gradient-primary{background: #ccc; width: 100px; height: 100px; line-height: 80px; font-size: 25px; position: absolute; right: -29px; top: -26px;}

.dasBrd .icon-shape i{opacity: 1;}
.navbar-vertical.navbar-expand-xs{overflow-y: hidden;}
.navbar-vertical.navbar-expand-xs .navbar-collapse{height: 80vh;}
 .dasBrd .lead{text-align: center; color: #000;}
 .dasBrd .modal { width: 400px;}
 .dasBrd .modal-body { height: auto;}
 .navbar-nav li.nav-item.dropdown .badge sup { font-size: 9px;}
 .dropdown .dropdown-menu.dropdown-menu-end:before{right: 48px;}
 :not(.main-content) .navbar .dropdown .dropdown-menu{right: 0px; left: auto;}
 .dropdown .dropdown-menu.show:before{right: 34px; left: auto; text-shadow: 0px -2px 5px #000;}

 .dasBrd .card.border-left-success .card-body .row.no-gutters .text-decoration-underline {
    color: #000;}
  .dasBrd .card .card-body .activeBar{font-weight: 400; text-transform: capitalize; color: #000;}
  .pie-chart-parent .dashboard-reports { display: none;}
  .lead.btnLead .btn-primary{font-weight: 400!important; letter-spacing: 0!important;}

/*dashboard ends*/

/*login page*/
/*.loginBg{background:url('../img/psimg2.jpg')no-repeat; background-size:cover;}*/


.loginBg{
    background:url('../img/PaperSign_e_bnr.jpg')no-repeat; background-size:100% 100%; animation: color-me-in 2s;
    -webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 3s;
-webkit-animation-direction: alternate;
}

.registr-page{
    background: url('../img/signup-cover.jpg'); background-position: top;
    animation: regt-bg-frame 2s;
    -webkit-animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: infinite;
-webkit-animation-duration: 3s;
-webkit-animation-direction: alternate;
}




@keyframes color-me-in {
  0% {
    background:url('../img/paper-pen.jpg')no-repeat; background-size:100% 100%;
  }
  
  50% {
    background:url('../img/esign4.jpg')no-repeat; background-size:100% 100%;
  }
  100% {
    background:url('../img/PaperSign_e_bnr.jpg')no-repeat; background-size:100% 100%;
  }
}


@keyframes regt-bg-frame {
  0% {
    background:url('../img/paper-pen.jpg')no-repeat; background-size:100% 100%;
  }
  
  50% {
    background:url('../img/esign4.jpg')no-repeat; background-size:100% 100%;
  }
  100% {
    background:url('../img/PaperSign_e_bnr-short.jpg')no-repeat; background-size:100% 100%;
  }
}




.fgBg{background:url('../img/psimg1.jpg')no-repeat; background-size:cover;}
.otpBg{background:url('../img/psimg3.jpg')no-repeat; background-size:cover;}
.bg-gradient-primary { background-image: linear-gradient(310deg, #019934 0%, #19201b 100%);}
.hrDivider {position: relative;}
.hrDivider p {background: #999;width: 30px;display: inline-block; position: absolute; top: -13px; left: 0; right: 0; margin: 0 auto; text-align: center; border-radius: 23px; color: #fff;}
.gml,.fb,.btn-login, .btn-user{position:relative; overflow: hidden; color: #fff!important;}    
.gml .fab.fa-google {font-size: 70px; position: absolute; opacity: 0.1; left: 0; top: 1px;}  
.fb .fab.fa-facebook-f { position: absolute; opacity: 0.1; left: 2px; top: 8px; font-size: 62px;}
.twt .fab.fa-twitter {font-size: 70px; position: absolute; opacity: 0.1; left: 0; top: 1px;}  
.ln .fab.fa-linkedin-in { position: absolute; opacity: 0.1; left: 2px; top: 8px; font-size: 62px;}
.btn-login i.fas.fa-sign-in-alt { position: absolute; opacity: 0.1; left: 2px; top: 4px; font-size: 58px;}
.btn-login i.fas.fa-redo-alt { position: absolute; opacity: 0.1; left: 2px; top: 4px; font-size: 58px;}
.btn-user i.fa-shield-alt{position: absolute; opacity: 0.1; left: 2px; top: 4px; font-size: 58px;}
.btn-user {background: #66728a;}
.btn-user:hover {background: #3f4d68;}

.gml.btn-primary:not(:disabled):not(.disabled):active{background:#e33a2c; color:#fff;}
.gml.btn-primary:focus{background:#e33a2c; color:#fff;}
.btn-login:hover {background: #3d4b9f;}
.btn-login:focus{box-shadow:none;}
.lgn .form-check.form-switch {justify-content: space-between;}
.lgn .form-check.form-switch .frgtPwd a {font-size: 0.875rem; font-weight: 400; color:#000;}
.form-switch .rembrMe .form-check-input{border-radius: 30px!important; border-bottom:none!important}
.lgn .card-body input {padding-left: 0;}
.modal-body .card { box-shadow: none;}
div#otp {width: 300px; margin: 0 auto;}
div#otp input { border-radius: 0!important; padding: 0;}

div#dotp input {border-radius: 0!important; box-shadow: none;}
button.close {border: 1px solid #ccc; background: #ffff; width: 30px; height: 30px; font-size: 18px;
    line-height: 26px;}
.field-icon {float: right; margin-top: -32px; position: relative; margin-right: 10px; position: relative;
}
.loginParent .card-header p { color: #A0A0A0;}

/*new login design*/

.loginParent form#user-login .nav-tabs {margin-bottom: 40px;}
/* .loginParent ul#myTab li { width: 50%; display: inline-block;} */
.loginParent ul#myTab li { width: 50%; display: inline-block; margin: 0 auto;}
.loginParent ul#myTab li button {color: #a0a0a0; width: 100%;}
.loginParent ul#myTab li button.active {border-bottom: 5px solid #019934; width: 100%;
    color: #A0A0A0; padding-bottom: 5px;}
.loginParent #myTabContent{height: auto;} 
.login-block-else { text-align: center;}
.login-block-else .login-block-else-btn {border: 1px solid #019934; background: none; width: 100%; padding: 10px;
    box-sizing: border-box; border-radius: 9px; color: #000;font-size: 14px; font-weight: bold; margin: 30px 0 15px 0;
display: inline-block;}
.or-sec { position: relative;}
.or-sec:before {content: '';height: 1px; background: #9B9B9B; width: 100%; position: absolute;
    top: 11px; z-index: 0; left: 0;}
.or-sec span {background: #fff; z-index: 9; position: relative; padding: 15px;}
.login-block-else p { color: #A0A0A0;}   
.login-block-else p a {color: #475993; text-decoration: underline;}
.loginParent button#sendotp { background: #019934;}
.loginParent button#sendsmsotp { background: #019934;}
.login-block-else .card-body input#contact{padding: 0.75rem 0.75rem 0.75rem 84px!important;}
.login-block-else .card-body input#contact{padding: 0.75rem 0.75rem 0.75rem 84px!important;}
.form-switch .form-check-label{color: #000;}
.frgtPwd {  width: 100%;text-align: right;}

.btnGml { border: 1px solid #999!important; }
.btnGml span { margin-left: 10px; color: #000; font-weight: 500;}
.btnGml:hover {background: #444;}
.btnGml:hover span { color: #fff;}
/*new login design ends*/

/*login page ends*/

/*sign Up page*/
.regt .card .card-header {padding-bottom: 0;}
.regt .card .card-header h4 {margin-bottom: 0;}
.regt .card .card-body input {height: 48px; border: none; border-bottom: 1px solid #ccc; border-radius: 0; box-shadow: none;}
.regt .card .card-body input[type="radio"] {height: auto; vertical-align: middle;}
.Gndr label {padding: 0 20px 0 0; margin: 0; line-height: normal; vertical-align: middle;}
.card .card-body .Subrpn input[type="checkbox"] {height: 20px; border: 1px solid #ccc!important; border-radius: 5px!important;}
.regt .card{margin-bottom: 20px;}
.regt .btn.btn-login {position:relative; height: 50px;}
.regt .btn-login i.fa-user-plus {position: absolute; opacity: 0.1; left: 2px; top: 4px; font-size: 50px;}
.navbar .navbar-nav .nav-item:hover a.nav-link { color: #000;}
.regt .regt-othrs a i {font-size: 22px; color:#ccc;}
.regt .regt-othrs a.btnGml:hover{background:#e94235; opacity: 1;}
.regt .regt-othrs a.btnGml:hover i{ color:#fff;}
.regt .regt-othrs a.btnFb:hover{background:#1877f2; opacity: 1;}
.regt .regt-othrs a.btnFb:hover i{ color:#fff;}
.regt .regt-othrs a.btnTwt:hover{background:#1da1f2; opacity: 1;}
.regt .regt-othrs a.btnTwt:hover i{ color:#fff;}
.regt .regt-othrs a.btnLn:hover{background:#0077b5; opacity: 1;}
.regt .regt-othrs a.btnLn:hover i{ color:#fff;}
.regt-othrs a {border: 1px solid #ccc;}
.regt .card-body input {padding-left: 0;}
.regt .card-body input#phone {padding-left: 50px;}
.regt .was-validated .form-check-input:invalid~.form-check-label{color: #344767;}
.regt .form-check-input:checked[type="checkbox"]{background-image: linear-gradient(310deg, #3282c0 0%, #3282c0 100%);}
/*sign Up page ends*/

/*forgot password*/

/*forgot password ends*/

/*upload css starts*/
.upldPge .form-container {display: flex;justify-content: center;align-items: center;}
.upldPge .upload-files-container {background-color: #fff;width: 100%;padding: 30px 60px;border-radius: 40px;
display: flex;  align-items: center;    justify-content: center;flex-direction: column;
box-shadow: rgba(0, 0, 0, 0.24) 0px 10px 20px, rgba(0, 0, 0, 0.28) 0px 6px 6px;}
.upldPge .label {display: contents !important; margin-bottom: 0.5rem;}
.upldPge .drag-file-area {border:2px dashed #AEAEAF;border-radius: 23px;margin: 10px 0 35px;padding: 30px 50px; width: 100%;text-align: center;background: #F5F8FC;}
.upldPge .drag-file-area .upload-icon { font-size: 50px;}
.upldPge .drag-file-area h3 {font-size: 23px;margin: 0 0 15px 0; color: #019934;}
.drag-file-area label { font-size: 19px;}
.upldPge .drag-file-area label .browse-files-text { color: #019934; font-weight: bolder;cursor: pointer; border-bottom: 2px dashed #019934;}
.upldPge .browse-files span {position: relative;top: -25px;}
.upldPge .default-file-input {opacity: 0;position: absolute;height: 30px;z-index: 99;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.ddd .browse-files span {top: 0;}
.upldPge .cannot-upload-message {font-size: 17px;display: flex;align-items: center; margin: 5px 0;
padding: 5px 10px 5px 30px; border-radius: 5px; color: #BB0000; display: none;}

@keyframes fadeIn {
  0%   {transform: scale(0.9);}
  100% {transform: scale(1.0);}
}
.upldPge .cannot-upload-message span, .upldPge .upload-button-icon {padding-right: 10px;}
.upldPge .cannot-upload-message span:last-child {padding-left: 20px;cursor: pointer;}
.upldPge .file-block {color: #f7fff7;background-color: #019934; transition: all 1s; width: 60%;
position: relative; display: none;  flex-direction: row;    justify-content: space-between;
align-items: center;margin: 10px 0 15px;padding: 10px 20px; border-radius: 25px;cursor: pointer; animation: fadeIn 1.5s;}

.upldPge .file-info {display: flex; align-items: center;font-size: 15px;}
.upldPge .file-icon {margin-right: 10px;}
.upldPge .file-name, .upldPge .file-size {padding: 0 3px;}
.upldPge .remove-file-icon {cursor: pointer;}
.upldPge .progress-bar {display: flex;position: absolute;bottom: 0; left: 4.5%; width: 0;height: 5px;
border-radius: 25px;background-color: #4BB543;}
.upldPge .upload-button {background-color: #019934;color: #f7fff7; font-size: 18px;border: none;border-radius: 9px;margin:0 30px 0 0;   padding: 7.5px 50px;cursor: pointer;  font-weight: 500;}

   .cstmHeading{color: #fff; margin-bottom: 25px; font-weight: 300; padding-top: 5px;} 
 .accntPge .overlay img { max-width: 60px;}  
 .upldPgePopup .uplDesk { min-height: 132px;}
 .upldPgePopup.modal {width: 740px;}

.upload-doc-name {width: 100%; position: relative;}
.upload-doc-name label { display: block; margin-left: 0; color: #6F6F6F; font-size: 16px;}
.upload-doc-name input#doc_name { border: none!important; width: 100%; border-radius: 12px!important;
    padding: 10px; box-shadow: 0px 0px 9px 2px rgba(0, 0, 0, 0.12); margin-bottom: 35px;}
.upload-doc-name input#doc_name:focus{outline:none; box-shadow: 0px 0px 9px 2px rgba(0, 0, 0, 0.12)!important;}   
.doc-name-info{position: absolute; right: 10px; top: 42px} 
.upldPge .drag-file-area input#file-upload { font-size: 0; width: 100px; height: 100px;
    border: none!important; z-index: 9; position: relative; top: 5px; right: 0px;  opacity: 0; cursor: pointer;}
.upldPge .drag-file-area p { color: #A4A4A4; font-size: 15px;}    
.upload-files-container #file-list {width: 100%; background: #fff; box-shadow: 0px 0px 9px 2px rgba(0, 0, 0, 0.12); border-radius: 12px; margin-top: 35px; padding: 0; margin-bottom: 25px;}
.upload-files-container #file-list li {border-bottom: 1px solid #CECECE; height: auto; width: 100%; display: inline-block; vertical-align: middle; margin: 0; box-shadow: none; padding: 19px 10px; position: relative; white-space: normal; word-break: break-all; border-radius: 0; color: #000;
    font-size: 14px;  font-weight: 600;}
.upload-files-container #file-list li .remove-btn {position: absolute; top: 22px; right: 15px;
    font-size: 0; width: 23px; height: 23px; border: none; background: transparent url(../img/trash-upload.png)no-repeat center;}
.upload-files-container #file-list li:before {content: ""; background: transparent url(../img/doc-img.png)no-repeat center; width: 23px; height: 23px; display: inline-block; position: relative;
    top: 5px; margin-right: 10px;}    
.upload-files-container #file-list li:last-child { border-bottom: none;}    
.cancel-upload {border: 1px solid #6F6F6F!important; width: 168px; text-align: center; margin: 0; color: #6F6F6F; font-size: 18px; font-weight: 500; padding: 7.5px 50px;}
.browse-area-upld { position: relative; border: none; padding: 0 30px; border-radius: 5px; margin: 0 30px;}
.browse-area-upld img { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    z-index: 0; box-shadow: 0px 0px 5px #000; border-radius: 50%;}
 .browse-area-upld i { position: absolute; left: 50%; top: 39%; transform: translate(-50%, -50%);
    z-index: 0; font-size: 30px; color: #000;}   

 .uploadParent { display: flex; flex-direction: row; justify-content: center;
    align-items: center; padding: 40px 0 50px 0;}   
  .dropBox-area { border: 1px solid #ccc; padding: 25px 50px; border-radius: 5px;}  
  .drive-area {border: 1px solid #ccc; padding: 25px 50px; border-radius: 5px; margin-right: 30px;}
  .dropBox-area i {color: #000; font-size: 30px; display: block;  margin-bottom: 10px;}
  .drive-area i {color: #000; font-size: 30px; display: block;  margin-bottom: 10px;}
  .url-area{border: 1px solid #ccc; padding: 17px 62px; border-radius: 5px;}
  .url-area i {color: #000; font-size: 30px; display: block;  margin-bottom: 10px;}
  .browse-area-upld i:after {content: 'Browse'; position: absolute; top: 41px; left: -9px;
    font-weight: normal; font-size: 16px; color: #666;  right: 0;  font-family: var(--ps-font-noto);
}
 
/*upload css ends*/

/*emailfield starts*/
.emlFldPge .input-group-append {cursor: pointer;}
.emlFldPge .container{ position: relative; }
.emlFldPge .image {opacity: 1; display: block; transition: .1s ease; backface-visibility: hidden; border-radius: 0.35rem;} 
.emlFldPge .middle {transition: .5s ease; opacity: 0; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%); text-align: center; }
.emlFldPge .container:hover .image { opacity: 0.3;}
.emlFldPge .container:hover .middle { opacity: 1;}
.emlFldPge .text { background-color: #019934; color: white; font-size: 16px; padding: 5px 10px;}
.emlFldPge .figure {padding: 4px; margin: auto; cursor: pointer; height: 262px; overflow: hidden;
    position: relative; }
.emlFldPge .figure-caption {background-color: #019934; color: white; padding: 2px; cursor: pointer; position: sticky;
    bottom: 0; left: 0; right: 0;}
.emlFldPge .form-container {margin-top: 50px;}
.emlFldPge .upload-files-container {display: flex; align-items: center;justify-content: center;flex-direction: column;}
.emlFldPge .label {  display: contents !important; margin-bottom: 0.5rem;}
.emlFldPge .drag-file-area {margin: 10px 0 15px;padding: 5px;   width: 100%;text-align: center;}
.emlFldPge .drag-file-area .upload-icon {font-size: 1.5rem;}
.emlFldPge .drag-file-area h3 {font-size: 26px;margin: 15px 0;}
.emlFldPge .drag-file-area label {  font-size: 19px;}
.emlFldPge .drag-file-area label .browse-files-text {   color: #019934; font-weight: bolder;    cursor: pointer;}
.emlFldPge .browse-files span { position: relative; top: -25px;}
.emlFldPge .default-file-input {    opacity: 0;}
.emlFldPge .card .card-header { padding: 1rem; background:#019934;}
.emlFldPge .card .card-header h5 {margin: 0; font-weight: 500; color:#fff;}

.browse-desk input[type=file]::file-selector-button {margin-right: 20px; border: none; background: #084cdf; padding: 10px 20px; border-radius: 10px; color: #fff; cursor: pointer; transition: background .2s ease-in-out;}
  .browse-desk input[type=file]::file-selector-button:hover {background: #0d45a5;}
  .browse-desk { border: 1px solid #ccc; width: 70%; margin: 0 auto; padding: 10px; border-radius: 5px;}
  .browse-desk input#file { border: none!important; width: 100%;}
 .modalMd {max-width: 800px;width: 100%!important; overflow-y: hidden;} 

 .emlFldPge .form-check:not(.form-switch) .form-check-input[type="radio"]:checked {padding: 5px; border-bottom: none!important;}
 .emlFldPge .form-check:not(.form-switch) .form-check-input[type="radio"]:after{width: 0.5rem; height: 0.5rem;}

/*emailfield ends*/

/*templatefield starts*/
.TmpPge .image {opacity: 1; display: block; transition: .1s ease; backface-visibility: hidden; border-radius: 0.35rem;} 
.TmpPge .middle {transition: .5s ease; opacity: 0; position: absolute; top: 50%; right: 0; transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%); text-align: center; }
.TmpPge .figure:hover .middle {  opacity: 1;}
.TmpPge .text { background-color: #d8dbd9; display: block; color: #000; font-size: 16px; padding: 5px 10px; border-radius: 4px;
  margin: 0px 0px 5px 0px;}
.TmpPge .figure {padding: 4px; margin: auto; cursor: pointer; height: 262px; overflow: hidden;
    position: relative; text-align: end;}
.TmpPge .figure-caption { color: #000; padding: 2px; cursor: pointer; position: sticky;
    bottom: 0; left: 0; right: 0; display: inline-block;}
.TmpPge .figure-caption ::before { content: ""; height: 2px; width: 70%; background: #019934;  position: absolute; bottom: 0; }
.TmpPge .card .card-header { padding: 1rem; background:#019934;}
.TmpPge .card .card-header h5 {margin: 0; font-weight: 500; color:#fff;}
.TmpPge .card {border: 2px solid #019934; border-radius: 0.35rem;}
/*templatefield ends*/

/*document sent finalPage starts*/
.finalPge {background: #fff; border-radius: 10px; width: 90%; margin: 0 auto; box-shadow: 0px 0px 10px #999;}
.finalPge i.fas.fa-file {font-size: 130px; color:#3282c0;}
.docSent { position: relative; width: 102px; margin: 0 auto;}
.finalPge i.fas.fa-file {font-size: 130px; color: #3282c0;}
.docSent .fa-check {position: absolute; bottom: 0; left: 50px; right: 0; color: #fff; font-size: 70px;
    text-shadow: 0px 0px 5px #000;}
.finalPge button.btn.btn-primary { font-weight: normal;  font-size: 18px;}    
/*document sent finalPage ends*/

/*account page start*/
.accntPge {background: #fff; width:100%; border-radius: 10px; padding: 30px; box-sizing: border-box;
   /* box-shadow: 0px 0px 5px #999;*/ margin-top: 100px!important;}
.accntPge select#country, .accntPge #timeZones{border: none!important; border-bottom: 1px solid #ccc!important; border-radius: 0!important; height: 50px;}
.accntPge .input-group .form-control:focus {border-left: none !important; border-right: none !important;}
.accntPge .image_area { margin: -130px auto 30px; width: 190px; position: relative;}
.accntPge img { display: block; max-width: 100%;}
.accntPge .preview {overflow: hidden; width: 160px; height: 160px; margin: 10px; border: 1px solid red;}
.accntPge .modal-lg{ max-width: 1000px !important;}
.accntPge .overlay {position: absolute;bottom: 10px;left: 0; right: 0; background-color: rgba(255, 255, 255, 0.5);
overflow: hidden; height: 0; transition: .5s ease; width: 100%;}
.accntPge .image_area:hover .overlay {height: 50%; cursor: pointer;}
.accntPge .text {color: #333; font-size: 20px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%);  -ms-transform: translate(-50%, -50%);  transform: translate(-50%, -50%);
text-align: center;}
.accntPge .image_area label {margin-left: 0;} 

/*account page ends*/

/*inbox page starts*/
.inboxPge .alert111{ z-index: 99999; position: fixed; top: 5px;left: 2%; width: 96%;} 
.inboxPge #example_length select { margin: 0 10px; padding: 8px 22px;}
.inboxPge #example_length label {font-family: var(--ps-font-noto); font-size: 15px;}
.inboxPge tbody tr th, .inboxPge tbody tr td {position: relative; -webkit-transition: .3s all ease;
    -o-transition: .3s all ease; transition: .3s all ease;}
.inboxPge tbody tr th:before, .inboxPge tbody tr th:after, .inboxPge tbody tr td:before, .inboxPge tbody tr td:after { -webkit-transition: .3s all ease; -o-transition: .3s all ease; transition: .3s all ease; content: ""; left: 0; right: 0; position: absolute; height: 1px; background: #007bff; width: 100%; opacity: 0;
visibility: hidden;}
table#dataTable tr th {background: var(--ps-priGrad); color: #fff; font-family: var(--ps-font-noto);
    font-weight: normal; padding: 15px 20px 15px 10px; font-size: 14px; text-align: center;}
.inboxPge .table>thead{    background: var(--ps-priGrad);color: #fff;font-family: var(--ps-font-noto);font-weight: normal;padding: 15px 20px 15px 10px;font-size: 14px;text-align: center;line-height: 40px;}
.dataTables_scrollBody::-webkit-scrollbar {height: 6px;}
table#dataTable tr td {padding: 20px 10px; font-family: var(--ps-font-noto); vertical-align: middle; border:none;
    font-size: 13px; color: #000; text-align: center;}  
.inboxPge tbody tr:hover th:before, .inboxPge tbody tr:hover th:after, .inboxPge tbody tr:hover td:before, .inboxPge tbody tr:hover td:after { opacity: 1; visibility: visible;}
.inboxPge tbody tr th:before, .inboxPge tbody tr td:before { top: -1px;}
.inboxPge th:before, .inboxPge tbody tr th:after, .inboxPge tbody tr td:before, .inboxPge tbody tr td:after {-webkit-transition: .3s all ease; -o-transition: .3s all ease; transition: .3s all ease; content: ""; left: 0; right: 0; position: absolute; height: 1px; background: #019934; width: 100%; opacity: 0; visibility: hidden;}
.inboxPge tbody tr th:after, .inboxPge tbody tr td:after { bottom: -1px;}
.inboxPge table.dataTable{border-collapse: collapse!important;}
.inboxPge tbody tr:hover th, .inboxPge tbody tr:hover td {background: rgba(0, 123, 255, 0.07);}
.inboxPge table.dataTable thead>tr>th.sorting:after, .inboxPge table.dataTable thead>tr>th.sorting_asc:after, 
.inboxPge table.dataTable thead>tr>th.sorting_desc:after, .inboxPge table.dataTable thead>tr>th.sorting_asc_disabled:after, .inboxPge table.dataTable thead>tr>th.sorting_desc_disabled:after, .inboxPge table.dataTable thead>tr>td.sorting:after, .inboxPge table.dataTable thead>tr>td.sorting_asc:after, .inboxPge table.dataTable thead>tr>td.sorting_desc:after, .inboxPge table.dataTable thead>tr>td.sorting_asc_disabled:after, .inboxPge table.dataTable thead>tr>td.sorting_desc_disabled:after{opacity: 1; top: 40%; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f338"; right:8px;}
.inboxPge .table thead th{padding: 10px 10px;}
.inboxPge table.dataTable thead th, table.dataTable thead td, table.dataTable tfoot th, table.dataTable tfoot td {text-align: center;}

.inboxPge #dataTable_paginate {margin: 20px 5px 20px 0;}  
.inboxPge .page-item .page-link, .inboxPge .page-item span{width: 44px; height: 44px;} 
.inboxPge #dataTable_paginate .pagination #dataTable_previous a.page-link { font-size: 0;}
.inboxPge #dataTable_paginate .pagination #dataTable_next a.page-link { font-size: 0;}

.inboxPge .page-item .page-link{border: 1px solid #019934; font-weight: 500!important; font-size: 16px;}
.inboxPge #dataTable_paginate .pagination #dataTable_previous a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f060"; font-size: 19px;}
.inboxPge #dataTable_paginate .pagination #dataTable_next a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f061"; font-size: 19px;}
.inboxPge .page-link.active, .inboxPge .active>.page-link{ background-color: #019934; border-color:#019934; color: #fff; font-weight: 500; font-size: 16px; }   
.inboxPge .page-link:hover{background-color: #019934; border-color:#019934; color: #fff;
font-weight: 500; font-size: 16px;}  
.inboxPge .paginate_button.page-item.next.disabled .page-link { opacity: 0.4; background: #ccc; border:1px solid #ccc;}
.inboxPge .paginate_button.page-item.next.disabled .page-link:hover { cursor: no-drop;}   
.inboxPge .paginate_button.page-item.previous.disabled .page-link { opacity: 0.4; background: #ccc; border:1px solid #ccc;}
.inboxPge .paginate_button.page-item.previous.disabled .page-link:hover { cursor: no-drop;}   
.inboxPge #dataTable_info { margin-top: 20px; font-size: 13px;}
.inboxPge #dataTable_filter label {font-family: var(--ps-font-noto); font-size: 15px;}
.inboxPge .btn.btn-primary.btn-tbl { width: auto; border-radius: 0; margin:0;}
div.dataTables_wrapper div.dataTables_length select{width: 60px;}
table#dataTable tr td i { font-size: 18px; -webkit-appearance: none;}
#formAccountSettings #status{height:40px; -webkit-appearance:none;}

.inboxPge #dataTable1_paginate .pagination #dataTable1_previous a.page-link{background: none;border: none;box-shadow: none;}
.inboxPge #dataTable1_paginate {margin: 20px 5px 20px 0;}  
.inboxPge #dataTable1_paginate .pagination #dataTable1_previous a.page-link { font-size: 0;}
.inboxPge #dataTable1_paginate .pagination #dataTable1_next a.page-link { font-size: 0;}
.inboxPge #dataTable1_paginate .pagination #dataTable1_previous a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f060"; font-size: 19px;}
.inboxPge #dataTable1_paginate .pagination #dataTable1_next a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f061"; font-size: 19px;}

.inboxPge #dataTable2_paginate .pagination #dataTable2_previous a.page-link{background: none;border: none;box-shadow: none;}
.inboxPge #dataTable2_paginate {margin: 20px 5px 20px 0;}  
.inboxPge #dataTable2_paginate .pagination #dataTable2_previous a.page-link { font-size: 0;}
.inboxPge #dataTable2_paginate .pagination #dataTable2_next a.page-link { font-size: 0;}
.inboxPge #dataTable2_paginate .pagination #dataTable2_previous a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f060"; font-size: 19px;}
.inboxPge #dataTable2_paginate .pagination #dataTable2_next a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f061"; font-size: 19px;}


.inboxPge #dataTable3_paginate .pagination #dataTable3_previous a.page-link{background: none;border: none;box-shadow: none;}
.inboxPge #dataTable3_paginate {margin: 20px 5px 20px 0;}  
.inboxPge #dataTable3_paginate .pagination #dataTable3_previous a.page-link { font-size: 0;}
.inboxPge #dataTable3_paginate .pagination #dataTable3_next a.page-link { font-size: 0;}
.inboxPge #dataTable3_paginate .pagination #dataTable3_previous a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f060"; font-size: 19px;}
.inboxPge #dataTable3_paginate .pagination #dataTable3_next a.page-link::before {font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f061"; font-size: 19px;}
/*inbox page ends*

/*sent page*/
.sntPge input[type="checkbox"] {border: 1px solid #ccc!important;}
.sntPge .form-check-input:checked[type="checkbox"] {background-image: linear-gradient(310deg, #25378f 0%, #25378f 100%);}
.sntPge .modal {width: 850px; margin: 0 auto; left: 0; right: 0;}
.sntPge .modal .modal-body { overflow: hidden; overflow-y: scroll;}
.sntPge .modal .modal-body img {border: 5px solid #ccc; margin-bottom: 15px;}
.sntPge .navbar { box-shadow: none!important;}
.sntPge .modal .modal-body .cstmCol h6 {margin: 0;}
.sntPge .modal .modal-body h5 {display:inline-block; margin-bottom:20px;border-bottom: 2px solid #3282c0; margin-top: 15px;}
.sntPge .modal .modal-body table tbody th {font-weight: normal;}
.sntPge .modal .table thead th { padding: 0.75rem 1.5rem 0.75rem 0;}

/*sent page ends*/ 

/*landing page*/

.lngPge .intro-header {padding-top: 50px; padding-bottom: 30px;text-align: center; color: #f8f8f8; 
    background: url(../img/esign1.jpg) no-repeat center center; background-size: cover;}
.lngPge .intro-message {position: relative; padding-top: 20%; padding-bottom: 20%;}
.lngPge .intro-message > h1 {margin: 0; text-shadow: 2px 2px 3px rgba(0,0,0,0.6); font-size: 4em; color: #fff;
font-weight: 500;}
.lngPge .intro-divider {width: 400px; border-top: 1px solid #f8f8f8; border-bottom: 1px solid rgba(0,0,0,0.2); margin: 0 auto;}
.lngPge .intro-message > h3 {text-shadow: 2px 2px 3px rgba(0,0,0,0.6); color: #fff; font-weight: 500;
font-size: 24px;}
.lngPge .network-name {text-transform: uppercase; font-size: 14px; font-weight: 400; letter-spacing: 2px;}
.lngPge .content-section-a {padding: 50px 0; background-color: #f8f8f8;}
.lngPge .content-section-b { padding: 50px 0; border-top: 1px solid #e7e7e7; border-bottom: 1px solid #e7e7e7;}
.lngPge .section-heading { margin-bottom: 30px;}
.lngPge .section-heading-spacer { float: left; width: 200px; border-top: 3px solid #191823;}
.lngPge .banner {padding: 100px 0; color: #f8f8f8; background: url(../img/esign3.jpg) no-repeat center center;
background-size: cover;}
.lngPge .banner h2 { margin: 0; color: #191823; text-shadow: 2px 2px 3px rgba(0,0,0,0.6); font-size: 3em;}
.lngPge .banner ul { margin-bottom: 0;}
.lngPge .intro-social-buttons{width: 50%; margin: 20px auto 0; display: flex;justify-content: space-evenly;}
.lngPge .intro-social-buttons li a.btn { color: #000; background: #fff; padding: 0; width: 110px; height: 110px; line-height: 100px; border-radius: 50%;}
.lngPge .btn.btn-lg i, .lngPge .btn-group-lg>.btn i { font-size: 2.2rem; position: relative; top: 12px; color: #ccc;}
.lngPge .intro-social-buttons li a.btn:hover i.fa-twitter {color: #27a1fc;}
.lngPge .intro-social-buttons li a.btn:hover i.fa-facebook {color: #1093f4;}
.lngPge .intro-social-buttons li a.btn:hover i.fa-linkedin {color: #ec683b;}


/*landing page ends*/

/*drag and drop canvas*/
.navbar-vertical .drag-drop-nav.navbar-nav .nav-link {cursor: all-scroll;padding-left: 1rem; padding-right: 1rem; font-weight: 500; color: #67748e; align-items: end;}
.navbar-vertical .drag-drop-nav.navbar-nav .nav-link .icon{margin-right: 10px;}
.canvas-container{margin-bottom: 80px;}
#demoCanvas{box-shadow: 0px 0px 5px #000;}
.canvas-container { margin-bottom: 0px;}
.canvas-container1 { margin-bottom: 0px;  overflow-x: hidden;  width: 830px; height:620px; scrollbar-color: #444 #999; scrollbar-width: thin;}
.canvsPge .dropped {background: #fff; padding: 5px 10px; border-radius: 5px; box-shadow: 0px 0px 5px #000;}
.canvsPge .dropped:hover{cursor:all-scroll;}
.navImg .dragImg img {display: block; padding: 10px 15px;}

/*drag and drop canvas ends*/

/*canvas file with thumbnails*/
#thumbnailContainer{padding: 0 0 50px 0;}
.scroll img {width: 90%; padding: 5px; box-sizing: border-box; border-width: 4px; border-style: solid;
    border-image: linear-gradient(to right, #ddd, #999) 1; height: auto;}
.thmbNails { position: fixed; right: 90px; bottom:21px; left: auto; width: 210px; height: 94%; overflow-y: scroll; background:#fff; scrollbar-color: #444 #999; scrollbar-width: thin;}
.docviewthumbnail .caption { text-align: center;}

.scrollbox-inner .scrollbox:hover{visibility: visible;}
::-webkit-scrollbar{ width: 5px;}
::-webkit-scrollbar-thumb{ background: #ccc;  border-radius: 10px;}
.table-responsive::-webkit-scrollbar {height: 5px;}
.accordion-body strong { color: #000;}
.accordion-button:not(.collapsed)::after{content:"\f0dd"; font-family: "Font Awesome 5 Free"; font-weight: 900; background-image:none; transform:none; top: -6px; position: relative;}
.accordion-button::after{content:"\f0de"; font-family: "Font Awesome 5 Free"; font-weight: 900; background-image:none;}
.btm-btm-stky {background: #ffffff; z-index: 99999; position: fixed; bottom: 0; left: 0; right: 0; text-align: center; padding: 10px; box-shadow: 0px 0px 5px #000;}
.btm-btm-stky .btn {margin: 0; font-weight: normal;}
.scrlTop {display: inline-block; background-color: #111940; width: 50px; height: 50px; text-align: center;
  border-radius: 50%; position: fixed; bottom: 6px; right: 30px; transition: background-color .3s, 
  opacity .5s, visibility .5s; opacity: 0; visibility: hidden; z-index: 1000;}
.scrlTop::after { content: "\f077"; font-family: FontAwesome; font-weight: normal;  font-style: normal;
font-size: 20px;  line-height: 50px; color: #fff;}
.scrlTop:hover { cursor: pointer; background-color: #333;}
.scrlTop:active { background-color: #555;}
.scrlTop.show { opacity: 1; visibility: visible;}
.scrlTop .fa-angle-up:before{content:none;}
.scrlTop.show i {left: 0; right: 0; position: absolute;}

.rtl-pnl .thmbNails{right: 20px; box-shadow:0px 0px 8px #999!important; border-radius: 15px;}
#drop canvas {padding: 10px; box-sizing: border-box; border-width: 4px; border-style: solid;
    border-image: linear-gradient(to right, #ddd, #999) 1;}

.lft-pnl-btns .scroll{margin-top: 0 !important; height: 600px; padding: 0; overflow: hidden; overflow-y: auto;
    border-width: 4px; border-style: solid; border-image: linear-gradient(to right, #ddd, #999) 1;
    box-sizing: border-box; width: 88%;}  
 .lft-pnl-btns .scroll img {width: 100%; padding:10px 5px 10px 10px; box-sizing: border-box; border-width: 0; border-style: solid; border-image: none;}   



/*canvas file with thumbnails*/

/*canvas document view*/
.lft-pnl-btns.canvsPge1 .scroll { margin-top: 0 !important; margin: 0 auto;}
/*canvas document view ends*/



/*test page*/
.canvsPge1 {margin: 0!important;}
.canvsPge1 div#drop { margin-top: 18px;}
.canvsPge1 .cutm-lft-pnl {border-radius: 1rem; background: #fff; max-width: 15.625rem !important;
    box-shadow: 0px 0px 8px #999!important; transition: all 0.2s ease-in-out; margin-left: 0!important;
    margin-top: 1rem !important; margin-right: 25px; /*position: fixed; top:0;left:0; */ height: 94vh;  overflow: hidden;}
.canvsPge1 .sdeNavImg img { padding: 1.5rem 2rem 1.5rem 2rem;/*1.5rem 2.8rem*/} 
.canvsPge1 .sdeNavImg img.logo-new{max-width: 250px;}
.canvsPge1 #sdeNav .nav-link.btn-drag { padding-left: 1rem; padding-right: 1rem; padding-top: 0.675rem; padding-bottom: 0.675rem;
margin: 0 8px; background: #fff;  border-radius: 5px;}
.canvsPge1 .dropped { background: #fff; padding: 5px 10px; border-radius: 5px; box-shadow: 0px 0px 5px #000; cursor: all-scroll; margin-bottom: 0;}
.canvsPge1 .icon-sm.icon {padding: 10px;}
.canvsPge1 div#sdeNav {height: 100%; overflow-y: auto; overflow-x: hidden; padding-bottom: 120px; scrollbar-color: #444 #999; scrollbar-width: thin;}
/*.canvsPge1 .canvas-container1{margin-left:260px;}*/
.canvsPge1 #sdeNav .nav-item .nav-link:hover {background-color: #f6f9fc; box-shadow: none;}
.canvsPge1 #sdeNav .nav-item .nav-link:hover .icon i {color: #019934; opacity: 1;}
.canvsPge1 .dropped .icon-sm.icon { padding: 0 10px; height: auto; display: inline-block;}
.canvsPge1 .dropped .icon-sm.icon i { font-size: 15px;}

/*test page ends*/

/*trails code*/
.canvsPge,#drop,#drop * { z-index: 0!important; position: relative;}
.drop-image { z-index: 0; position: relative;}
#drop.ui-droppable-active.ui-droppable-hover{ /*z-index: -1!important;*/ position:relative;}

.btn-drag{z-index: 99999!important;  position: relative;}
.btn-drag.ui-droppable-dragging { z-index: 9999999!important; position: relative;} 
/*trails code*/

/*custom alert messages*/
.custom-alerts {position: fixed; width: 100%; left: 0; right: 0; bottom: 0; z-index: 9999;}
.alert-danger { background-image: transparent; color: #f3410f; border-top: 5px solid #f3410f;
    background: #fff; border-radius: 0; text-align: center; box-shadow:0px 0px 5px #000; width: 100%;}
.alert-success{ background-image: transparent; color: #0d9391; border-top: 5px solid #0d9391;
background: #fff; border-radius: 0; text-align: center; box-shadow:0px 0px 5px #000; width: 100%;}   
.alert-warning{ background-image: transparent; color: #faa118; border-top: 5px solid #faa118;
background: #fff; border-radius: 0; text-align: center; box-shadow:0px 0px 5px #000; width: 100%;}   
.alert-info{ background-image: transparent; color: #3282c0; border-top: 5px solid #3282c0;
background: #fff; border-radius: 0; text-align: center; box-shadow:0px 0px 5px #000; width: 100%;}           

.alert-danger i {font-size: 22px; margin-left: 10px;}     
.alert-success i {font-size: 22px; margin-left: 10px;}     
.alert-warning i {font-size: 22px; margin-left: 10px;}     
.alert-info i {font-size: 22px; margin-left: 10px;}   

.clseAlert {position: absolute; right: 10px; width: 30px; height: 30px; background: #f03; color: #fff;
                    top: 23%; font-weight: 600; font-size: 18px; cursor: pointer; text-align: center; border:none;}  
/*custom alert messaes ends*/

/*loading icon*/
.loadingIcon {position: fixed; background: rgba(0,0,0,0.3); top: 0; left: 0; right: 0; bottom: 0;
    z-index: 9999; display: flex; align-items: center; justify-content: center;}
    .loadingIcon img{width:70px;}    
    .loadingIcon{background: rgba(0,0,0,0.3);}
    .loadingIcon #preloader-background {
        display: unset;
        text-align: center;
        padding: 20px;
    }
    .loadingIcon #preloader-background p {
        color: #fff;
        display: block;
        margin: 0;
        width: 100%;
    }
    .loadingIcon #preloader-background img {
        display: inline-block; width: auto;
    }
/*loading ends*/

/*email verification*/
.finalPge i.fas.fa-mail-bulk {font-size: 130px; color:#3282c0;}
/*email verification ends*/



/*modal tabs*/




/*signature fonts*/
.txtSignInpt { margin-right: 25px;}
#placeToPasteValue,#placeToPasteValue1,#placeToPasteValue2{font-family: 'Cedarville Cursive', cursive; font-size:30px; font-style: italic;}
.txtSign {display: flex; justify-content: flex-start; align-items: center; padding: 10px;
    min-height: 50px;}
/*signature fonts ends*/    
.txtSign #placeToPasteValue,.txtSign #placeToPasteValue1,.txtSign #placeToPasteValue2 {margin-left: 100px; padding: 20px;}
.txtSignlbl label { display: block; color: #999; font-weight: normal;}
.txtSignlbl input:focus { outline: none;}

.txtSignlbl .form-check input[type="radio"] { border: 1px solid #ccc!important; border-radius: 50%!important;
    height: 18px; width: 18px; margin-right: 15px;}
    .txtSignlbl .form-check:not(.form-switch) .form-check-input[type="radio"]:checked { padding: 5px;}


    .mdl-tabs .modal { width: 740px; margin: 0 auto; left: 0; right: 0; top: 50px;}
    .modal.show .modal-dialog{max-width: unset;}

    .mdl-tabs .modal .modal-dialog {width: 100%!important; max-width: unset; transform: none;}
    .slctImg .form-check:not(.form-switch) .form-check-input[type="radio"]{width: 18px; height: 18px; margin-right: 15px;}
    .slctImg .form-check label img{max-width:100px;}
    .slctImg .form-check { margin: 5px 0; vertical-align: middle;}
    .slctImg .form-check input[type="radio"] {border: 1px solid #ccc!important; border-radius: 50%!important;}
    .slctImg .form-check:not(.form-switch) .form-check-input[type="radio"]:checked { padding: 5px;}
    div#myTabContent { height: 286px; overflow: hidden; overflow-y: scroll;}
/*modal tabs ends*/


/*tabs draw canvas*/

.mdl-tabs #canvas {background: #fff;position: relative; border-radius: 10px; border: 1px solid gray;    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; cursor: url(../../assets/img/pen.png) 2 48, auto;  width:auto!important;}
.mdl-tabs .black{ background: #000000;}
.mdl-tabs .red { background: #ee0408;}
.mdl-tabs .blue { background: #053a72;}
.mdl-tabs .green { background: rgb(5, 153, 5);}
.mdl-tabs .selected { width: 20px; height: 20px; position: relative;}
.controls li{width: 20px; height: 20px; margin:10px; list-style: none;  display: inline-block;}
/*tabs draw canvas ends*/

.mdl-tabs ul#myTab { margin-bottom: 20px; margin: 0 auto 10px;}
.mdl-tabs ul#myTab li { margin-right: 30px;}
.mdl-tabs ul#myTab li button {color: #000; font-family: var(--ps-font-noto);}   
.mdl-tabs ul#myTab li button.active,.mdl-tabs ul#myTab li button:hover { border:none; border-bottom: 3px solid #019934; border-radius: 0; color: #019934;}
.mdl-tabs ul#myTab li button:hover{background: none; border: none; margin: 0; padding: 0; color: #3282c0;}
.nav-tabs .nav-link{background: none; border: none; border-top-left-radius: 0; border-top-right-radius: 0;
padding: 0; margin: 0;}
.mdl-tabs ul#myTab li button:hover{border-bottom: 3px solid #019934; border-radius: 0; color: #019934;}
.mdl-tabs .selected:before { content: ''; border: 1px solid #000; position: absolute; width: 28px;
    height: 28px; left: -4px; top: -4px;}
 .uploadSec{text-align: center; margin-top: 50px;}  
.uploadSec .uplDesk, .uploadSec .uplDrpbox, .uploadSec .uplDrive {display: inline-block; border: 1px solid #ccc; min-height: 120px; vertical-align: middle; padding: 22px 10px; box-sizing: border-box;
    margin-bottom: 10px; width: 49%;  text-align: center; border-radius: 10px; position: relative; overflow: hidden; cursor: pointer;}
.uploadSec .uplDesk label { display: block; font-weight: 400; font-size: 14px;}
.uplDrpbox label { font-size: 14px; font-weight: 400;}
.uploadSec .uplDesk input::placeholder {font-size: 20px;}
.uploadSec i.fab, .uploadSec i.fas {display: block; font-size: 40px; color: #ccc;}
.uploadSec i.fab:hover, .uploadSec i.fas:hover{color:#019934;}

.uplDesk:hover i, .uplDrpbox:hover i, .uplDrive:hover i{color:#019934;}
.uploadSec .uplDesk input#myfile {opacity: 0; position: absolute; height: 100px; cursor: pointer; z-index: 99; top: 50%;
    left: 50%; transform: translate(-50%, -50%);}

 .uploadSec .uplDrive { display: none;}   
 .uploadSec .uplDrpbox { display: none;} 

 .emlFldPge .middle:hover {opacity: 1;} 
 
 .emlFldPge .modal {width: 500px; margin: 0 auto; left: 0; right: 0;} 
 .emlFldPge .modal .modal-body {overflow: hidden; overflow-y: scroll;} 
 .emlFldPge .modal .modal-body img {padding: 5px; box-sizing: border-box; border-width: 4px; border-style: solid;  border-image: linear-gradient(to right, #ddd, #999) 1; margin-bottom: 15px;}
 .emlFldPge .figure-caption .col { width: 100px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
/*audittrail page starts*/
.adttrlPge .activities { max-height: 1208px; position: relative;  padding-bottom: 50px;}
.adttrlPge  .decor-default { background-color: #ffffff !important;}
.adttrlPge  div[class*='col-'] >  .col-inside-lg { padding: 20px;}
.adttrlPge  .activities .unit { border-bottom: 1px solid #d8d8d8; padding: 20px 0 20px 50px;  position: relative; overflow: hidden;}
.adttrlPge .activities .unit .avatar { display: block; width: 40px; height: 40px; position: absolute; top: 20px; left: 0;}
.adttrlPge .activities .unit .avatar img { display: block; border-radius: 50%;  max-width: 100%;}
.adttrlPge .activities .unit .field { overflow: hidden; font-size: 14px; line-height: 20px;}
.adttrlPge .activities .unit .field a {font-weight: bold; color: #333333;}
.adttrlPge .activities .unit .field.btn-group-xs {  padding: 20px 0 0;}
.adttrlPge .activities .unit .field { overflow: hidden; font-size: 14px; line-height: 20px;}
.adttrlPge .f-l { float: left;}
.adttrlPge .unit .avatar img{ width:50px  !important;height:50px !important;}
.downloadExcel { border-bottom: 1px dashed #344767;}
.downloadExcel:hover { color: #344767;border-bottom: 1px dashed #344767;}
/*auditrail page ends*/

/*billing page starts*/
.bllgPge .navbar{position: fixed; width:100%; z-index: 1;}
.bllgPge .pricing .card { border: none; border-radius: 1rem; transition: all 0.2s;  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1); }
.bllgPge .pricing hr { margin: 0.5rem 0; }
.bllgPge .pricing .card-title {  margin: 0.5rem 0; font-size: 18px; letter-spacing: .1rem;}
.bllgPge .pricing .card-price { font-size: 2.5rem;  margin: 0; } 
.bllgPge .pricing .card-price .period { font-size: 0.8rem; }
  
.bllgPge .pricing ul li {  margin-bottom: 1rem;}
  
.bllgPge .pricing .text-muted {  opacity: 0.7; }

.bllgPge  .pricing .btn { font-size: 80%; letter-spacing: .1rem;  padding: 1rem; opacity: 0.7; transition: all 0.2s; }

  /* Hover Effects on Card */
  
.bllgPge .faq_area { position: relative; z-index: 0; background-color: #f5f5ff;  }
.bllgPge .faq-accordian { position: relative; z-index: 1;}
.bllgPge .faq-accordian .card { position: relative; z-index: 1;  margin-bottom: 1.5rem; }
.bllgPge .faq-accordian .card:last-child { margin-bottom: 0;}
.bllgPge .faq-accordian .card .card-header {  background-color: #ffffff;  padding: 0;  border-bottom-color: #ebebeb; border-radius: 1rem;}
.bllgPge .faq-accordian .card .card-header h6 {  cursor: pointer;  padding: 1.75rem 2rem;  color: #3f43fd;  display: -webkit-box;  display: -ms-flexbox;  display: flex; -webkit-box-align: center; -ms-flex-align: center;  -ms-grid-row-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.bllgPge .faq-accordian .card .card-header h6 span { font-size: 1.5rem; }
.bllgPge .faq-accordian .card .card-header h6.collapsed { color: #070a57;}
.bllgPge .faq-accordian .card .card-header h6.collapsed span { -webkit-transform: rotate(-180deg);  transform: rotate(-180deg);}
.bllgPge .faq-accordian .card .card-body {  padding: 1.75rem 2rem; }
.bllgPge .faq-accordian .card .card-body p:last-child {  margin-bottom: 0;}
.bdr-x {border-left: 1px solid #ccc; border-right: 1px solid #ccc;}

.bllgPge span.lni-chevron-up::before {content: "\f107"; font: normal normal normal 14px/1 FontAwesome;
    border: none; vertical-align: middle; font-weight: 600;}

.bllgPge span.plus-up::before {font: normal normal normal 14px/1 FontAwesome;
    border: none; vertical-align: middle; font-weight: 600;}
    .qusf{cursor: pointer;}
 .bllgPge .faq-accordian .card .card-header h6.collapsed {padding: 1.75rem 2rem;}   
 .bllgPge .faq-accordian .card .card-header h6{padding: 1.75rem 2rem 0rem 2rem;}
 .bllgPge td {text-align: center;}
 .bllgPge .table td:first-child {text-align: left;}
 .bllgPge .tableFixHead {overflow-y: auto;height: 500px; }
 .bllgPge .tableFixHead .table>thead th {position: sticky;  top: 0px;background: #eee;}
 .bllgPge .table>thead { vertical-align: middle!important; background: #ccc;}
 .bllgPge table {border-collapse: collapse; /* make the table borders collapse to each other */width: 100%;}
 .bllgPge th, td {padding: 8px 16px; }
 .bllgPge th { background: #eee;}
 .bllgPge .table> :not(caption)>*>* {padding: 1.5rem 1rem!important;}
 .bllgPge tr:hover {background-color: #bcfbd2;}  
 .bllgPge .tableFixHead tr td:nth-child(3) {background: #bcfbd2;}  
 .bllgPge .accordion  .card-header h2[aria-expanded="true"] span.plus-up:before {content: "\f068";}
 .bllgPge .accordion  .card-header h2[aria-expanded="false"] span.plus-up:before {content: "\f067";}

/*billing page ends*/

/*contact page starts*/
.cntPge textarea { border: none!important; border-bottom: 1px solid #ccc!important; border-radius: 0!important; width: 100%;}
.cntPge input:focus::-webkit-input-placeholder {color: transparent}
.cntPge input:focus:-moz-placeholder { color: transparent}
.cntPge input:focus::-moz-placeholder { color: transparent}
.cntPge input:focus:-ms-input-placeholder { color: transparent}
.cntPge textarea:focus::-webkit-input-placeholder { color: transparent}
.cntPge textarea:focus:-moz-placeholder {color: transparent}
.cntPge textarea:focus::-moz-placeholder { color: transparent}
.cntPge textarea:focus:-ms-input-placeholder {  color: transparent}
.cntPge input::-webkit-input-placeholder { color: #adadad}
.cntPge input:-moz-placeholder { color: #adadad}
.cntPge input::-moz-placeholder {color: #adadad}
.cntPge input:-ms-input-placeholder { color: #adadad}
.cntPge textarea::-webkit-input-placeholder { color: #adadad}
.cntPge textarea:-moz-placeholder { color: #adadad}
.cntPge textarea::-moz-placeholder { color: #adadad}
.cntPge textarea:-ms-input-placeholder { color: #adadad}
.cntPge button:hover { cursor: pointer}
.cntPge .txt1 { font-size: 18px; line-height: 1.2;  color: #fff}
.cntPge .txt2 { font-size: 15px; line-height: 1.6; color: #999}
.cntPge .txt3 { font-size: 15px; line-height: 1.6; color: #019934;}
.cntPge .size1 { width: 355px;  max-width: 100%}
.cntPge .size2 { width: calc(100% - 43px)}
.cntPge .container-contactPS { width: 100%; min-height: 100vh; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; padding: 15px;}
.cntPge .wrap-contactPS { width: 1120px;box-shadow: 0 0.15rem 1.75rem 0 rgb(58 59 69 / 15%) !important; border-radius: 1rem; background: #fff; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; align-items: stretch; flex-direction: row-reverse}
.cntPge .contactPS-more { width: 50%; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; z-index: 0;padding: 30px 15px 0}
.cntPge .contactPS-more::before { content: "";display: block; position: absolute; z-index: -1; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,.8)}
.cntPge .contactPS-form { width: 50%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; padding: 56px 55px 63px}
.cntPge .contactPS-form-title { width: 100%; display: block; font-size: 30px; color: #333; line-height: 1.2; text-align: center; padding-bottom: 33px}
.cntPge .rs1-wrap-inputPS,.rs2-wrap-inputPS { width: 50%}
.cntPge .rs2-wrap-inputPS { border-left: none}
.cntPge textarea.inputPS { min-height: 139px; padding-top: 19px; padding-bottom: 15px}
.cntPge .container-contactPS-form-btn { width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; flex-wrap: wrap; justify-content: center; padding-top: 23px}
.cntPge .contactPS-form-btn { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; justify-content: center; align-items: center; padding: 0 20px; min-width: 200px; height: 50px; border-radius: 2px; font-size: 12px; color: #fff; line-height: 1.2; text-transform: uppercase; letter-spacing: 1px; -webkit-transition: all .4s; -o-transition: all .4s; -moz-transition: all .4s; transition: all .4s}

@media(max-width: 992px) {.cntPge .contactPS-form { width:60%; padding: 56px 30px 63px}.cntPge .contactPS-more {  width: 40%}}
@media(max-width: 768px) {.cntPge .contactPS-form {  width:100%}.cntPge .contactPS-more {  width: 100%}}
@media(max-width: 576px) {.cntPge .contactPS-form {  padding:56px 15px 63px }.cntPge .rs1-wrap-inputPS,.cntPge .rs2-wrap-inputPS {  width: 100%} .cntPge .rs2-wrap-inputPS {   border-left: 1px solid #e6e6e6;  border-top: none }}
@media(max-width: 992px) { .cntPge .alert-validate::before {   visibility:visible;   opacity: 1}}
.cntPge .validate-input { position: relative}
.cntPge .alert-validate::before { content: attr(data-validate); position: absolute; max-width: 70%; background-color: #fff; border: 1px solid #c80000; border-radius: 2px; padding: 4px 25px 4px 10px; top: 50%; -webkit-transform: translateY(-50%);-moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 2px; pointer-events: none; font-family: 'Noto Sans', sans-serif; color: #c80000; font-size: 13px; line-height: 1.4; text-align: left; visibility: hidden; opacity: 0; -webkit-transition: opacity .4s; -o-transition: opacity .4s; -moz-transition: opacity .4s; transition: opacity .4s}
.cntPge .alert-validate::after { content: "\f12a"; font-family: FontAwesome; display: block; position: absolute; color: #c80000; font-size: 16px; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 8px}
.cntPge .alert-validate:hover:before {  visibility: visible;  opacity: 1}
.cntPge .flex-w { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap;}
.cntPge .p-b-47 { padding-bottom: 47px;}
.cntPge .p-r-25 { padding-right: 25px;}
.cntPge .flex-col { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; -o-flex-direction: column; flex-direction: column;}
.cntPge .p-b-20 { padding-bottom: 20px;}
.cntPge .dis-flex { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex;}
.cntPge .flex-col-c-m { display: -webkit-box; display: -webkit-flex; display: -moz-box; display: -ms-flexbox; display: flex; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; -o-flex-direction: column; flex-direction: column; -ms-align-items: center; align-items: center; justify-content: center;}
/*contact page ends*/

/*settings page starts*/
.sttngpge a.nav-link.has-icon.preference { display: none;}
.sttngpge a.nav-link.has-icon.notification { display: none;}
.sttngpge .nav.nav-pills .nav-link{padding:5px 20px;}
.sttngpge .nav-pills .nav-link.active, .nav-pills .show>.nav-link { color: #fff; background-color: #019934;     border-radius: 40px; padding: 5px 20px;}
.sttngpge .mr-2{ margin-right: 0.5rem!important;}
.sttngpge .nav.nav-pills { background: #01993420; border-radius: 40px; position: relative;}
.sttngpge .card { box-shadow: 0 0.15rem 1.75rem 0 rgb(33 40 50 / 15%); }
.sttngpge .card .card-header { font-weight: 500;}
.sttngpge .card-header:first-child {  border-radius: 0.35rem 0.35rem 0 0; }
.sttngpge .card-header {  padding: 1rem 1.35rem;  margin-bottom: 0; background-color: rgba(33, 40, 50, 0.03); border-bottom: 1px solid rgba(33, 40, 50, 0.125); }
.sttngpge .form-control, .dataTable-input { display: block; width: 100%; padding: 0.875rem 1.125rem; font-size: 0.875rem; font-weight: 400; line-height: 1;  color: #69707a; background-color: #fff; background-clip: padding-box; border: 1px solid #c5ccd6; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0.35rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }

.sttngpge .nav-borders .nav-link.active {  color: #ffffff; border-bottom-color: #ffffff;}
.sttngpge .nav-borders .nav-link { color: #afa6a6; border-bottom-width: 0.125rem; border-bottom-style: solid; border-bottom-color: transparent; padding-top: 0.5rem; padding-bottom: 0.5rem;   padding-left: 0;  padding-right: 0; margin-left: 1rem;  margin-right: 1rem; }
.sttngpge .fa-2x {   font-size: 2em; }

.sttngpge .table-billing-history th, .table-billing-history td { padding-top: 0.75rem; padding-bottom: 0.75rem; padding-left: 1.375rem; padding-right: 1.375rem; }
.sttngpge .table > :not(caption) > * > *, .dataTable-table > :not(caption) > * > * {  padding: 0.75rem 0.75rem; background-color: var(--bs-table-bg); border-bottom-width: 1px;  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg); }
.sttngpge .h-100 {  height: 100% !important;}
.sttngpge .moving-tab { display: none!important;}
.iti.iti--allow-dropdown.iti--separate-dial-code .iti.iti--allow-dropdown .iti__flag-container .iti__arrow {
    display: none;}
.sttngpge #notification form p {color: #000!important; font-size: 14px;}
.sttngpge #notification form strong {color: #3282c0; font-weight: 500;}
/*settings page ends*/


.lngPge .container-fluid {--bs-gutter-x: 0px !important; overflow: hidden;}
.lngPge .img-fluid{border-radius: 1rem;}
.lngPge .col-sm-6 { position: relative;}
@media (min-width: 1200px){.lngPge .col-lg-offset-2 { margin-left: 16.66666667%; }}
@media (min-width: 1200px){.lngPge .col-lg-offset-1 { margin-left: 8.33333333%; }}
@media (min-width: 1200px){.lngPge .col-lg-5 { width: 41.66666667%; }}
@media (min-width: 1200px){.lngPge .col-lg-5 { float: left; } }
@media (min-width: 768px){.lngPge .col-sm-push-6 { left: 50%; }}
@media (min-width: 768px){.lngPge .col-sm-pull-6 {   right: 50%;  } }
@media (min-width: 768px){.lngPge .col-sm-6 {  float: left; }}


/*canvas view documnt page*/
.cutm-lft-pnl.cstm-btns-cnvs {padding: 20px; width: 250px;}
.cutm-lft-pnl.cstm-btns-cnvs .btn {display: block; width:100%;}
/*canvas view documnt page ends*/

.canvsPge1 .scroll { margin-top: 1rem !important;}
.sideimage::-webkit-scrollbar { height: 7px;}
.canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body::-webkit-scrollbar { height: 7px;}

/*popovers*/
.toast {z-index: 9; display: block; position:fixed; top: 40px; left: 285px; background: #ffffff; border-radius: 8px; box-shadow: 0px 0px 5px #000;}
.toast textarea {width: 100%; padding:5px 5px 5px 10px; border: 1px solid #ccc;}
.toast textarea:focus{outline:none;}
.toast .btn {width: 42%!important; display: inline-block!important; margin: 0 10px;}
.toast label {font-size: 17px; font-weight: normal; margin-left: 0;}
.toast i.fas {font-size: 24px; position: absolute;left: -9px; top: 40%; color: #fff; text-shadow: 0px 0px 5px #000; z-index: 0;}
/*popovers*/

/** fadeInLeft **/

@-webkit-keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-10px);
        -moz-transform: translatex(-10px);
        -o-transform: translatex(-10px);
        transform: translatex(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}
@-moz-keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-10px);
        -moz-transform: translatex(-10px);
        -o-transform: translatex(-10px);
        transform: translatex(-10px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}
@keyframes fadeInLeft {
    from {
        opacity:0;
        -webkit-transform: translatex(-100px);
        -moz-transform: translatex(-100px);
        -o-transform: translatex(-100px);
        transform: translatex(-100px);
    }
    to {
        opacity:1;
        -webkit-transform: translatex(0);
        -moz-transform: translatex(0);
        -o-transform: translatex(0);
        transform: translatex(0);
    }
}
.in-left {
    -webkit-animation-name: fadeInLeft;
    -moz-animation-name: fadeInLeft;
    -o-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 1s;
    -moz-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-delay: 1s;
    -moz-animation-delay: 1s;
    -o-animation-duration:1s;
    animation-delay: 1s;
}


/*error messages*/
#error-message { position: fixed; bottom: 0; left: 0; right: 0; z-index: 999;}
#error-message button.close {float: right;}

#sotp-message {position: fixed; bottom: 0; left: 0; right: 0; z-index: 999;}
#sotp-message button.close {float: right;}

#success-message {position: fixed; bottom: 0; left: 0; right: 0; z-index: 999;}
#success-message button.close {float: right;}
/*error messages*/


.canvas-container {  margin-bottom: 10px; width:775px!important;}
.canvas-container .canvas-container {border: none;}
canvas {width: 100%!important; border: 2px solid #ccc;}

:not(.main-content) .navbar .dropdown .dropdown-menu{display:none}
:not(.main-content) .navbar .dropdown .dropdown-menu.show {display: block;background: #fff; box-shadow: 0px 0px 5px #000;}

.dropdown-menu li.noActiveNotiy { text-align: center; margin: 100px 0;}

/*search page*/
table.srch-fltr-tble {table-layout: fixed; width: 100%; border: 1px solid #ccc; border-radius: 5px;}
table.srch-fltr-tble td input {width: 75%; height: 40px; font-size: 13px; display: inline-block;}
table.srch-fltr-tble td input:focus {outline:none;}
table.srch-fltr-tble td select#status {outline:none;font-size: 13px; border: none; border-bottom: 1px solid #ccc; width: 90%; height: 40px;}
.srch-tble{cursor: pointer;}
table.srch-fltr-tble td label { margin-left: 0; margin-right: 10px; display: inline-block;}
#dataTable_paginate .pagination #dataTable_previous a.page-link {font-size: 0;}
#dataTable_paginate .pagination #dataTable_next a.page-link {font-size: 0;}
#dataTable_paginate .pagination #dataTable_previous a.page-link::before {font-family: "Font Awesome 5 Free";
    font-weight: 900; content: "\f060"; font-size: 19px;}
#dataTable_paginate .pagination #dataTable_next a.page-link::before {font-family: "Font Awesome 5 Free";
    font-weight: 900; content: "\f061"; font-size: 19px;}
.page-item.active .page-link{color: #fff;}  

.srch-parent {position: relative;}
.srchBar{display:none; position: fixed; top: 7px; right: 36%; width: 30%;}  
.srchBar input[type="text"] {width: 100%; border-radius: 5px!important; height:45px; padding: 0 0 0 10px;
}
.srchBar input[type="text"]:focus{outline:none;}
.srchBar .srchClose {position: absolute; top: 0; right: -1px; width: 40px; height: 45px; border: none;
    background: #ddd; border-radius: 0 25px 25px 0; color: #666; font-size: 19px; text-transform: unset;}
.srch-fltr-tble tbody tr:hover td { background: none;}  
.srch-fltr-tble tbody tr td:before{content:none;}  
.srch-fltr-tble tbody tr td:after{content:none;}  
/*search page ends*/

.backlayer{ position: fixed; top: 0; left: 0; z-index: 1000; width: 100%; height: 100%; background-color: black;  filter: alpha(opacity=80);  opacity: 0.8; }
  .loader { margin: 300px 50%;  width: 48px; height: 48px; border: 3px solid #FFF;  border-radius: 50%;
    display: inline-block; position: relative; box-sizing: border-box; animation: rotation 1s linear infinite; } 
  .loader::after { content: '';  box-sizing: border-box; position: absolute; left: 50%; top: 50%;
    transform: translate(-50%, -50%); width: 56px; height: 56px; border-radius: 50%; border: 3px solid transparent;border-bottom-color: #FF3D00; }
  /* .loadingIcon:before {content: "It is going to take time please be patient …"; color: #fafbfd;
    position: absolute; top: 35%;}   */

  @keyframes rotation {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }

  .dshbrd-hdr { position: absolute; right: 30px; top: 80px;}

  /*header tooltip*/
  .tooltip-inner {color: #fff ;}
   .custom-tooltip { --bs-tooltip-bg: #000; --bs-tootip-color:#000;}
 /*header tooltip ends*/

 /*envelope history*/
 .envelope-history h5 {border-bottom: 2px solid #019934; width: auto; display: inline-block;
    margin-bottom: 20px;}
 .envelope-history table thead th {background: var(--ps-priGrad); color: #fff; font-family: var(--ps-font-noto);
    font-weight: normal; padding: 15px 10px; font-size: 14px; text-align: center;} 
    .envelope-history table tbody td {padding: 20px 10px; color: #000; font-size: 13px;} 
    .envelope-history table tbody th {font-size: 13px; font-family: var(--ps-font-noto);
    color: #000; padding: 20px 10px; font-weight: normal;} 
    .history-info { position: absolute;right: 40px; top: 20px;}
    .history-info .history-info-buttons { display: none;}
/*    .history-info .dropright .dropdown-menu.show{transform: translate(-166px, 32px)!important;}*/
    .history-info .dropdown-menu.show {text-align: center; padding: 15px 10px; width: 190px;
    top: 10px!important;}
    .history-info .dropdown-menu.show p { font-size: 14px;  text-align: left; margin: 5px 0 5px 0;}
    .history-info .dropdown-menu.show p i { padding-right: 5px;}
    .envelope-history .cstmCol p {color: #000;}
 /*envelope history ends*/

 /*canvas pages view with header*/
 .canvas-pages-head .thmbNails { height: 85%;}
 .canvas-pages-head .cntr-pnl{height: 559px; margin-top: 24px!important;}
 .canvas-pages-head .canvsPge1 .cutm-lft-pnl{height: 85vh; margin-top: 1.5rem !important;}
 .documentInfo div { line-height: 14px;}
 .documentInfo div span { font-size: 12px;}
 .canvas-pages-head .accordion-button{white-space: normal; word-break: break-all;}
/*canvas pages view with header*/

/*progress bar styles*/

/*loading progress bar*/
@-webkit-keyframes loader {
  0% {
    width: 0;
  }
  20% {
    width: 10%;
  }
  25% {
    width: 24%;
  }
  43% {
    width: 41%;
  }
  56% {
    width: 50%;
  }
  66% {
    width: 52%;
  }
  71% {
    width: 60%;
  }
  75% {
    width: 76%;
  }
  94% {
    width: 86%;
  }
  100% {
    width: 100%;
  }
}

@keyframes loader {
  0% {
    width: 0;
  }
  20% {
    width: 10%;
  }
  25% {
    width: 24%;
  }
  43% {
    width: 41%;
  }
  56% {
    width: 50%;
  }
  66% {
    width: 52%;
  }
  71% {
    width: 60%;
  }
  75% {
    width: 76%;
  }
  94% {
    width: 86%;
  }
  100% {
    width: 100%;
  }
}
.progress-bar {
  border-radius: 60px;
  overflow: hidden;
  width: 100%;
}
.progress-bar span {
  display: block;
}

.bar {
  background: rgba(0, 0, 0, 0.075);
}

.progress {
  -webkit-animation: loader 30s ease infinite;
          animation: loader 30s ease infinite;
  background: #3282c0;
  color: #fff;
  padding: 5px;
  width: 0;
}

.progress-bar {
  left: 50%;
  max-width: 50%;
  position: absolute;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
}
/*loading progress bar ends*/  

/*progress bar styles ends*/

/*create vault*/
.mdl-tabs.update-stamps #contact-tab { display: none;}
.update-stamps #home-tab{font-size: 0;}
.mdl-tabs.update-stamps #home-tab:before { content: "Stamps";  font-size: 16px;}

.mdl-tabs.update-stamps1 #contact-tab { display: none;}
.update-stamps1 #home-tab{font-size: 0;}
.mdl-tabs.update-stamps1 #home-tab:before { content: "Photos";  font-size: 16px;}
.create-vault-page { padding: 10px; margin-bottom: 150px;}
.create-vault-page .card .card-body{text-align: center;}
.create-vault-page .card .card-body img { padding: 10px 0 15px 0; margin: 0 auto 10px; 	user-drag: none; -webkit-user-drag: none; -moz-user-select: none; }

/*create vault ends*/

.clearNotify{display: none;}
.dasBrd.canvas-pages-head .navbar.position-fixed { margin: 0 auto!important; left: 0; right: 0;}
.dasBrd.canvas-pages-head .navbar.position-fixed div#navbar { justify-content: right!important;}
.emlFldPge form h3 {font-weight: normal; font-size: 22px;}

/*faq pages*/
.faqPage #faqAccordion .card {box-shadow: none;}
.faqPage #faqAccordion .card .card-header {padding: 1rem; border-top: 1px solid #ccc;
    border-radius: 0; cursor: pointer;}
.faqPage #faqAccordion .card .card-header h6 { font-size: 14px;}
.faqPage #faqAccordion .card .card-header h6.collapsed:after { content: "+"; position: absolute; right: 0;}
.faqPage #faqAccordion .card .card-header h6:after { content: "-"; position: absolute; right: 0;}
.faqPage #faqAccordion .card .card-body {padding: 0 15px;}
.faqPage #faqAccordion .card:last-child .card-header {border-bottom: 1px solid #ccc;}

.faqPage .accordion .accordion-item { border-bottom: 1px solid #ccc;}
.faqPage .accordion .accordion-item p, .faqPage .accordion .accordion-item ul li, .faqPage .accordion .accordion-item a, .faqPage .accordion .accordion-item ol li{color:#000;}
/*faq pages*/

.emlFldPge .form-select{background-position: right 4px center;}

/*chat page popup*/
.btnActiveUsers {background: #3282c0; border: none; color: #fff; padding: 5px; font-size: 12px;}
.btnMessages {background: #019934; border: none; color: #fff; padding: 5px; font-size: 12px;}
/*chat page popup ends*/

/*new paginations starts*/
/*square edge pagi*/
div.dataTables_wrapper div.dataTables_paginate ul.pagination{background: #fff; box-shadow: 0px 0px 5px #000; border-radius: 5px; display: inline-block; width:auto;
text-align: center; margin-right: 4px;}
div.dataTables_wrapper div.dataTables_paginate ul.pagination li {display: inline-block; border-right: 1px solid #999; padding: 0; margin: -1px 0 0 0;}
.inboxPge #dataTable_paginate .pagination #dataTable_previous a.page-link{background: none;
border: none; box-shadow: none;}
.inboxPge .page-item .page-link{border: none; margin: -1px 0 0 0; color: #019934; font-size: 14px;}
.inboxPge .page-link.active, .inboxPge .active>.page-link{border-radius: 0!important; color: #fff;}
.inboxPge .page-link:hover{border-radius: 0!important; color: #fff; background-color: #019934;}
.inboxPge #dataTable_paginate .pagination #dataTable_previous a.page-link:hover {
 background: #3282c0;}
.inboxPge #dataTable_paginate .pagination #dataTable_next a.page-link:focus{background: none; border: none; box-shadow: none;}
.inboxPge .paginate_button.page-item.next.disabled .page-link { opacity: 0.2; background: none; border: none; cursor: not-allowed;}
.inboxPge #dataTable_paginate .pagination #dataTable_next a.page-link { background-color: transparent; color: #019934;}
.inboxPge .page-link.active, .inboxPge .active>.page-link{background: #019934;}
/*square edge pagi ends*/
/*new paginations starts*/

.dropdown-toggle.active.show::after { content: ""; transform: rotate(180deg);}
.navbar-vertical.navbar-expand-xs .navbar-nav .nav-link.dropdown-toggle.show::after {
    content: ""; transform: rotate(180deg);}

 /*received docs*/
 #inboxforwardmodal { width: 600px; overflow: hidden;}
 #inboxforwardmodal .modal-body { overflow-y: auto;}   
 #inforword .form-floating textarea {height: 100px;}
/*received docs ends*/

.note-wrap:before{content: "Trivia"!important; cocolor: #019934;}
.sidenav-header{text-align: center; left: 0;}
.sidenav .navbar-brand{padding: 10px; display: unset; box-sizing: border-box; outline: none;}
.navbar-vertical .navbar-brand .navbar-brand-img{padding: 15px; max-width:210px!important; margin:0 auto;}
.canvas-new-design .canvas-container{width: 825px!important; position: relative;}

.view-doc-pages .viewDocImg{width: 100%;}
.view-doc-pages .cvsRecr .cntr-pnl{margin-left: 10px;}

/*text-to-sign styles*/
.perview1{font-family: 'Pwsignaturetwor55O'; font-size:40px; font-style: italic;color: #000; font-weight: bold; text-transform: capitalize;}
    .perview2{ font-family: 'BatfideSignatureL39K3';  font-size:40px; font-style: italic;color: #000; font-weight: bold; text-transform: capitalize;}
    .perview3{font-family: 'AAutoSignature1GD9j'; font-size:40px; font-style: italic;color: #000; font-weight: bold; text-transform: capitalize;}
    .perview4{ font-family: 'AngkanyaSebelasVGPDB';  font-size:40px; font-style: italic;color: #000; font-weight: bold; text-transform: capitalize;}
    .perview5{font-family: 'AAutoSignature1GD9j'; font-size:40px; font-style: italic;color: #000; font-weight: bold; text-transform: capitalize;}
/*text-to-sign styles ends*/

.custom-container-sticky .navbar {margin: 0!important;}
/*.dasBrd .navbar {margin:0 1.5rem !important;}*/

/*larger screen styles*/
@media screen and (min-width:1440px) and (max-width:1469px){
    .container {margin: 0 auto!important; width: 1300px;}
    .cnvsBtm .rtl-pnl .thmbNails{bottom:100px!important;}
    .cnvsBtm .cntr-pnl{height:85vh!important; margin-right: 10px;}
    .rtl-pnl {position: relative;}
    .cnvsBtm .rtl-pnl .thmbNails { position: sticky!important;}
    .canvas-new-design .canvas-container{width:823px!important;}
    .view-doc-pages .viewDocImg{width: 100%; height: 100%!important;}
}

@media screen and (min-width:1470px){
    .container {margin: 0 auto!important; width: 1300px;}
    .header-top{margin-top: 2rem!important;}
    .rtl-pnl {position: relative;}
    .rtl-pnl .thmbNails{position: sticky; margin-left: 20px; margin-top: 20px; margin-bottom: 5px; width: 200px; height: 89vh; border-radius: 15px; border-radius: 15px; overflow-y: auto!important;}
    .canvsPge1 .cutm-lft-pnl {height: 90vh!important;}
    .cntr-pnl{height:90vh!important; width: 800px!important; scrollbar-color: #444 #999; scrollbar-width: thin;}
    .canvas-container{width: 100%!important;}
    .canvas-new-design .canvas-container{width: 100%!important;}
    .canvas-container .canvas-container{ overflow-y: auto; scrollbar-color: #444 #999; scrollbar-width: thin;}


     /*doc ajax css*/
     .canvsPge1 .cutm-lft-pnl { height: 90vh;}
     .viewDocImg{width:100%!important; scrollbar-color: #444 #999; scrollbar-width: thin;}
     .rtl-pnl .thmbNails{height: 90vh!important; width: 200px!important;}
    /*doc ajax css ends*/

    /*landing page*/
    .lngPge .lg-res{margin: 0 auto!important; width: 1300px;}

    .pie-chart-parent{margin-bottom: 410px!important;}
    .pie-chart-one{top: auto; left: 0;  right: 0;}
    .pie-chart-two{top: auto; left: 0;  right: 0;}
    .pie-chart-one .card-body img { width: 210px !important;  height: 210px !important; }
    .pie-chart-two .card-body img { width: 210px !important;  height: 210px !important; }

    .custom-container-sticky .navbar {width: 1300px!important; margin: 0 auto!important;}
    .banner-top{width: 1300px!important; margin: 88px auto 0!important;}
}
@media screen and (min-width:1821px){
    .pie-chart-one.mt-5{margin-top: 0!important}
    .pie-chart-two.mt-5{margin-top: 0!important}
}
/*larger screen styles ends*/

.nav-control{display:none!important}
.nav-control-parent .nav-control{display:block!important;}

/*work-flow-pages theme*/
.theme-workflow-one table#dataTable tr th {background: none!important; padding: 5px;font-size: 14px;text-align: center;
}
.theme-workflow-one table#dataTable tr.fold  th{background: linear-gradient(45deg, #f98a00, transparent);
  background-color: #835017 !important;}
.theme-workflow .bg-primary{background: linear-gradient(45deg, black, transparent);}
.theme-workflow .inboxPge .table>thead, .theme-workflow .dasBrd .navbar.position-fixed{background: linear-gradient(45deg, #282626, transparent)!important; background-color: var(--ps-primary) !important;}

.theme-workflow-one .bg-primary{background: linear-gradient(45deg, #f98a00, transparent);
    background-color: #835017 !important;}
.theme-workflow-one .inboxPge .table>thead, .theme-workflow-one .dasBrd .navbar.position-fixed{background: linear-gradient(45deg, #f98a00, transparent)!important; background-color: #835017 !important;}
.theme-workflow-one .dshbrd-hdr{display: none; opacity:0;}
.theme-workflow-one .upldPge .upload-button { background-color: #f38701;}
.theme-workflow-one .upldPge .drag-file-area h3{color: #f38701;}
.theme-workflow-one .dasBrd .navbar.position-fixed #navbar { justify-content: right!important;}
a.dropdown-toggle.nav-link.workflow-page.active {background: #ffba6a!important;}

.cntr-pnl .attachedFiles { max-width: 800px;}

/*work-flow-pages theme ends*/

.dashboard-reports a { font-size: 12px; text-decoration: underline; color: #3282c0;}
.downloadExcel {border-bottom: none; background: linear-gradient(90deg, #019934, transparent);
    background-color: #30302c !important;color: #fff; padding: 10px 25px;  border-radius: 5px; margin: 10px 0 20px 0!important; display: inline-block; transition: 0.5s;}   
 .downloadExcel:hover { color: #fff; border-bottom: none; background: linear-gradient(45deg, #019934, transparent);
    background-color: #3282c0 !important;}  
    .backAdd {border-bottom: none; background: linear-gradient(90deg, #ccc, transparent);
      background-color: #3282c0 !important;color: #fff; padding: 10px 25px;  border-radius: 5px; margin: 35px 0 5px 0!important; display: inline-block; transition: 0.5s;}   
   .backAdd:hover { color: #fff; border-bottom: none; background: linear-gradient(45deg, #ccc, transparent);
      background-color: #3282c0 !important;}  
.vault-login .modal input::-webkit-outer-spin-button, .vault-login .modal input::-webkit-inner-spin-button {
    appearance: none; -webkit-appearance: none;}    
.vault-login .modal input:focus{outline:none;}
.vault-login .modal .modal-footer{display: inline-block!important;}



/*canvas view merge css from file to assets*/
.cntr-pnl {height: 613px; overflow: hidden; overflow-y: auto; box-sizing: border-box; background: #fff;
    margin-top: 20px!important; padding: 15px 15px 0 15px; position: relative;}

 .navImg .signfields img {max-width: 190px; width: 100%; cursor: move;}  
 .viewDocBtns{padding:0 15px; overflow-y: auto; height:auto;}
 .viewDocBtns .btn{width:100%; border-radius: 10px!important; font-weight: normal;}
 .viewDocBtns1{padding:0 15px;}
 .viewDocBtns1 .btn{width:100%; border-radius: 10px!important; font-weight: normal;}

    .toast:not(.show) { display: none;}
      .toast {z-index: 9; display: block; position: fixed; top: 40px; left: 285px; background: #ffffff;
    border-radius: 8px; box-shadow: 0px 0px 5px #000;}
  .toast label { font-size: 17px; font-weight: normal; margin-left: 0;}
  .toast textarea { width: 100%; padding: 5px 5px 5px 10px; border: 1px solid #ccc;}
  .toast .btn { width: 42%!important; display: inline-block!important; margin: 0 10px;} 
  .mdl-tabs .modal.fade:before {background: rgba(0,0,0,0.6); position: fixed; left: 0; right: 0;
    content: ""; top: 0; bottom: 0;}
.viewDocImg {width: 775px; margin-bottom: 15px;}
.viewDocImg img { border: 2px solid #a9a9a9;}
.viewDocImg hr {margin: 5px 0;}

.cnvsBtm .cutm-lft-pnl {height: 84vh;}
.cnvsBtm .cntr-pnl {height: 547px; border-top: 15px solid #fff; border-bottom: 15px solid #fff;}
.cvsRecr .cntr-pnl {border-top: 15px solid #fff; border-bottom: 15px solid #fff;}
.cnvsBtm .rtl-pnl .thmbNails {height: 84vh; bottom: 86px;}
.cnvsBtm .rtl-pnl .thmbNails .accordion-header .accordion-button {font-size: 10px; color: #000;
    font-weight: 500;}
.cvsRecr .rtl-pnl .thmbNails .accordion-header .accordion-button {font-size: 10px;}
.rtl-pnl .thmbNails .accordion-header .accordion-button {font-size: 10px;}

.accordion-body .thumbnail-Nw, .accordion-body .thumbnail{text-align: center;}
.accordion-body .thumbnail-Nw img,.accordion-body .thumbnail img{max-width: 100px; margin: 0 auto; width: 100%!important;}

/*canvas view merge css from file to assets ends*/

.dropdown .dropdown-toggle:after {content: ''; height: 0; width: 0; border-left: 5px solid transparent;
    border-right: 5px solid transparent; border-top: 7px solid #fff;}
.dropdown .dropdown-toggle.show:after{transform: rotate(180deg);}

.drag-desk{display: block;}
.drag-mob{display: none;}
#dataTable_wrapper .btn.btn-primary.disabled { background: #ccc; opacity: 0.5;}
.dropright .dropdown-menu.show {box-shadow: 0px 0px 5px #000;}
.ntfys button { width: 30%; height: 30px; line-height: 30px; margin: 0 auto; padding: 0; float: none; font-size: 12px;}

/*search bar*/
.srch-parent .srchBar input { width: 100%; height: 45px; border-radius: 26px!important;
    padding: 0 48px 0 20px; border: none!important;}
.srch-parent .srchBar input:focus { outline: none; border: none!important;}    


/*search bar ends*/
.navbar-vertical.navbar-expand-xs .navbar-nav .nav-link{color: #000;}
.navbar-vertical .navbar-nav .nav-link .icon i{color: #000;}
.navbar-vertical .navbar-nav .nav-link:hover .icon i { color: #3d4b9f!important;}
.navbar-vertical .navbar-nav .nav-link:hover .icon svg {fill: #3d4b9f!important;}


/*register vault*/
.vaultQuestions { background: #f6f7f9; border-radius: 5px;}
  .vaultQuestions select {height: 40px; width: 150px; outline: none; border: none; font-size: 14px;}
  .select-question-num { background: #dfe6f3; border-radius: 5px 0 0 5px;}
  .fill-answers { padding: 10px 10px 10px 20px;}
  .fill-answers input {background: none; margin-bottom: 5px; background-color: transparent!important;}
/*register vault ends*/  

.vault-questions-answers-pge .card .card-body input{padding: 0; float: left; border-radius: 10px!important;}
.vault-questions-answers-pge .card-body .btn{float: right; height: 48px;  padding: 0;
    line-height: 48px; width: 110px; background: #1c1b17;}
.vault-questions-answers-pge .card-body .btn.btn-primary { background: #019934;}
.vault-questions-answers-pge .card .card-body input[type="text"] { border-radius: 0!important;
    background: none;}


/*spinner*/
/* #preloader-background { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center;
    justify-content: center; -webkit-box-align: center; align-items: center; display: -webkit- flex;
    display: -ms- flex;  display: flex; -ms-flex-pack: center; justify-content: center;
    -ms-flex-align: center; align-items: center;    transform: rotate(-90deg);}
         */
#centre-logo { position: absolute;opacity: 0.2; width: 30px }

.circle__spinner {width: 100px; height: 100px;}
.circle__spinner .path {stroke: #1961ab; stroke-linecap: round; animation: dash 20s linear infinite;}

@keyframes dash {
  0% {
    stroke-dasharray: 1, 150;
    stroke-dashoffset: 0;
  }
  100% {
    stroke-dasharray: 130, 150;
    stroke-dashoffset: 0;
  }
}
/*spinner ends*/

.bllgPge .card .card-body{padding: 1rem;}
div.dataTables_wrapper div.dataTables_length select{padding-right: 30px;}

/*website visitor count*/

.website-visitor-counter-sec {position: fixed; right: 0; bottom: 70px; background: #ffffff80;
    box-shadow: 0px 0px 5px #000; padding: 20px 0px 20px 10px; z-index: 9999999999;
    width: 70px; border-radius: 10px 0 0 10px; transition: 1s;}

.website-visitor-counter-sec label { line-height: 11px;}

.website-counter{background: #3282c0; height: 50px; width: 50px; display: inline-block;
    text-align: center; border-radius: 50%; line-height: 50px; color: #fff;}
    
.website-visitor-counter-sec.caret-visitor-hide { transition: 1s; right: -58px;}

.website-visitor-counter-sec.caret-visitor-hide i.caret-visitor { transform: rotate(180deg);
    top: 60%; position: absolute; left: 8px;}
.website-visitor-counter-sec i.caret-visitor:before { font-family: 'Font Awesome 5 Free'; font-size: 25px; color: #000; position: absolute; left: 0; top: 42%;}  
.website-visitor-counter-sec.caret-visitor-hide i.caret-visitor:before{left: -4px;}  
/*website visitor count ends*/

.drpDwn .dropdown-menu.show{margin: 0 0 0 35px!important; border-left: 1px solid #81b8f6;
    padding-left: 20px; background: none!important;}
.drpDwn .dropdown-item:hover, .drpDwn .dropdown-item:focus{background-color: #D3E1F1; border-radius: 6px;}    
.upload-files-container #upderror{color: #f5365c !important;}
.canvas-container .pageNumber { font-size: 0; background: none;}
.accordion .collapsed .arrow i { transform: rotate(180deg);}


/*document print view*/
@media print{
    .sidenav,.navbar,.dshbrd-hdr,.history-info,.footer{display:none;} 
    table.table.table.table-striped.table-hover { table-layout: fixed; width: 100%;}
    table.table.table.table-striped.table-hover tr td, table.table.table.table-striped.table-hover tr th { white-space: normal; text-align: center;}
    
    .canvas-pages-head .cutm-lft-pnl{display: none;}
    .canvas-pages-head .rtl-pnl{display: none;}
    .canvas-pages-head .cntr-pnl{height:auto; overflow:unset;}

    table{table-layout: fixed!important;}
    table tbody td{white-space: normal!important;}
}
/*document print view ends*/



/*new font*/
.navbar-vertical.navbar-expand-xs .navbar-nav .nav-link{color: #2c2c2c; font-size: 14px; font-weight: 400; -webkit-appearance: none; margin:0;}
    .navbar-vertical.bg-white .navbar-nav>.nav-item .nav-link.active, .navbar-vertical.bg-white .navbar-nav>.nav-item .nav-link:hover{background-color: #baebcb; box-shadow: none;
    color: #333; border-radius: 5px; font-weight: 500;}

    .theme-workflow-one .navbar-vertical.bg-white .navbar-nav>.nav-item .nav-link.active, 
    .theme-workflow-one .navbar-vertical.bg-white .navbar-nav>.nav-item .nav-link:hover{background-color: #c16f0b50;}


    .navbar-vertical .navbar-nav .nav-link .icon {padding: 10px 15px 10px 10px; margin-right: 0!important;}
    .navbar-vertical .navbar-nav .nav-link.active .icon i, .navbar-vertical.bg-white .navbar-nav>.nav-item .nav-link:hover .icon i{color: #333;}
    .navbar-vertical .navbar-nav .nav-link .icon i {color: #7a7574;}
    .navbar-vertical .navbar-nav .nav-link:hover .icon i { color: #333!important;}
/*new font*/

/*canvas zoom starts*/
.zomm-btn {z-index: 2;border:1px solid #CCC;border-radius: 5px;background:#DDD;box-shadow: 0 0 5px -1px rgba(0,0,0,0.2);cursor:pointer;width: 80px;height: 35px;
  vertical-align:middle;text-align: center;}
.zomm-btn {opacity: 0;position: absolute;top: 4%; left: 50%;}
#zoom-out i.fas.fa-search-minus:hover {color: #019934;}
#zoom-in i.fas.fa-search-plus:hover {color: #e7113c;}
/*canvas zoom ends*/

/********** Template CSS **********/
:root {
  --primary: #355EFC;
  --secondary: #E93C05;
  --tertiary: #555555;
  --light: #fff;
  --dark: #011A41;
}



/*** Button ***/
.btn {transition: .5s;font-weight: 300;}

.btn-primary,
.btn-outline-primary:hover {
  color: var(--light);
}

.btn-square {
  width: 38px;
  height: 38px;
}

.btn-sm-square {
  width: 32px;
  height: 32px;
}

.btn-lg-square {
  width: 48px;
  height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: normal;
}



/*** Header ***/
.carousel-caption {
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: start;
  z-index: 1;
}

.carousel-control-prev,
.carousel-control-next {
  width: 3rem;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  width: 3rem;
  height: 3rem;
  background-color: var(--primary);
  border: 10px solid var(--primary);
}

.carousel-control-prev-icon {
  border-radius: 0 3rem 3rem 0;
}

.carousel-control-next-icon {
  border-radius: 3rem 0 0 3rem;
}





/*** Facts ***/
.facts {
  background: linear-gradient(rgb(20 20 20 / 95%), rgba(53, 94, 252, .95)), url(../../../img/bg.png);
}


/*** Callback ***/
.callback {
  position: relative;
}

.callback::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 50%;
  top: 0;
  left: 0;
  background: linear-gradient(rgba(53, 94, 252, .95), rgba(53, 94, 252, .95)), url(../img/bg.png);
  z-index: -1;
}


/*** Feature ***/
.feature .feature-box,
.feature .feature-box * {
  transition: .5s;
}

.feature .feature-box:hover {
  background: #001152d9;
  border-color: #001152d9 !important;
}

.feature .feature-box:hover * {
  color: #FFFFFF !important;
}


/*** Service ***/
.service .nav .nav-link {
  transition: .5s;
}

.service .nav .nav-link.active {
  border-color: var(--primary) !important;
  background: var(--primary);
}

.service .nav .nav-link.active h5 {
  color: #FFFFFF !important;
}

.service .nav .nav-link.active h5 i {
  color: #FFFFFF !important;
}

.border2 {
  border: 1px solid #00188f !important;
}

/*** Project ***/
.project-item,
.project-item .project-img {
  position: relative;
  display: flex;
  flex-direction: row-reverse;
}

.project-item .project-img a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, .5);
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  opacity: 0;
  transition: .5s;
}

.project-item:hover .project-img a {
  opacity: 1;
}

.project-item .project-title {
  position: absolute;
  top: 2rem;
  width: 79%;
  bottom: 0;
  left: 0rem;
  border: 1px solid var(--light);
  border-radius: 8px;
  display: flex;
  align-items: center;
  padding: 10px;
  z-index: -1;
  transition: .5s;
}

/* .project-item:hover .project-title {
  background: var(--primary);
  border-color: var(--primary);
} */

.project-item .project-title h4 {
  transition: .5s;
}

.project-item:hover .project-title h4 {
  color: #FFFFFF;
}

.project-carousel .owl-nav {
  margin-top: 25px;
  display: flex;
  justify-content: center;
}

.project-carousel .owl-nav .owl-prev,
.project-carousel .owl-nav .owl-next {
  margin: 0 12px;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--primary);
  background: var(--light);
  border-radius: 45px;
  font-size: 22px;
  transition: .5s;
}

.project-carousel .owl-nav .owl-prev:hover,
.project-carousel .owl-nav .owl-next:hover {
  background: var(--primary);
  color: var(--light);
}


/*** Team ***/
.team-item {
  position: relative;
  padding: 4rem 0;
}

.team-item img {
  position: relative;
  z-index: 2;
}

.team-item .team-text {
  position: absolute;
  top: 0;
  right: 3rem;
  bottom: 0;
  left: 3rem;
  padding: 15px;
  border: 1px solid var(--light);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  transition: .5s;
  z-index: 1;
}

.team-item:hover .team-text {
  background: var(--primary);
  border-color: var(--primary);
}

.team-item .team-text h4 {
  transition: .5s;
}

.team-item:hover .team-text h4 {
  color: #FFFFFF;
}

.team-item .team-social .btn {
  background: var(--light);
  color: var(--primary);
}

.team-item:hover .team-social .btn {
  background: #FFFFFF;
}

.team-item .team-social .btn:hover {
  background: var(--primary);
  color: var(--light);
}


/*** Testimonial ***/
.testimonial-item {
  position: relative;
  text-align: center;
  padding-top: 30px;
}

.testimonial-item .testimonial-text {
  position: relative;
  text-align: center;
  height: 14rem;
}

.testimonial-item .testimonial-text .btn-square {
  position: absolute;
  width: 60px;
  height: 60px;
  top: -30px;
  left: 50%;
  transform: translateX(-50%);
}

.testimonial-carousel .owl-item img {
  margin: 0 auto;
  width: 100px;
  height: 100px;
}

.testimonial-carousel .owl-dots {
  margin-top: 25px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

.testimonial-carousel .owl-dot {
  position: relative;
  display: inline-block;
  margin: 0 5px;
  width: 30px;
  height: 30px;
  border: 1px solid #ccc;
  border-radius: 30px;
  transition: .5s;
}

.testimonial-carousel .owl-dot::after {
  position: absolute;
  content: "";
  width: 16px;
  height: 16px;
  top: 6px;
  left: 6px;
  border-radius: 16px;
  background: #ccc;
  transition: .5s;
}

.testimonial-carousel .owl-dot.active {
  border-color: #019934;
}

.testimonial-carousel .owl-dot.active::after {
  background: #019934;
}


/*** Footer ***/
.footer .btn.btn-link {
  display: block;
  margin-bottom: 5px;
  padding: 0;
  text-align: left;
  color: var(--light);
  font-weight: normal;
  text-transform: capitalize;
  transition: .3s;
}

.footer .btn.btn-link::before {
  position: relative;
  content: "\f105";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  margin-right: 10px;
}

.footer .btn.btn-link:hover {
  color: var(--primary);
  letter-spacing: 1px;
  box-shadow: none;
}
div.dataTables_wrapper div.dataTables_length label{color: #000;}
table#dataTable tr td small a {color: #000;}
table#dataTable tr td a small.text-muted { color: #000!important;}

/*all popup modal styles*/
.modal-header{justify-content: center; border-bottom: none;}
.modal-title{color: #000; font-size: 20px; font-weight: 500; padding-top: 10px;}

#logoutModal { top: 50%; left: 50%; right: auto; margin: 0 auto!important; bottom: auto;
    transform: translate(-50%, -50%); height: auto; width: 510px;}
#logoutModal button.close { position: absolute; right: 7px; top: 10px; border: none; color: #f03;}
#logoutModal button.close span {
    font-size: 26px;
}
#logoutModal .modal-footer{justify-content: space-around; border-top: none; position: relative;}
#logoutModal .modal-footer .btn-primary { background: #019934; border: 1px solid #019934!important; font-weight: 400;
    letter-spacing: 0; font-size: 14px; }
.succRtngPnl .hdeRtngSucc {position: absolute; right: 16px; top: -71px; width: 42%!important;}
#logoutModal .modal-footer .btn-outline-secondary{color: #000; font-weight: 500; letter-spacing: 0;}
#logoutModal .modal-header{justify-content: center; border-bottom: none; font-size: 15px;}
#logoutModal .modal-header .modal-title{color: #000; padding-top: 10px; font-weight: 500;}
#logoutModal .modal-body {text-align: center; margin-bottom: 10px;}


#modal2 .modal-header{justify-content: center; border-bottom: none;}
#modal2 .modal-title.fs-5 {color: #000; padding-top: 10px;}
#modal2.modal .btn-close{position: absolute; right: 18px; top: 20px;}
#modal2 .btn-secondary {  font-weight: 400; letter-spacing: 0; font-size: 15px; font-weight: 500;}
#modal2 .btn-primary { background: #019934; border: 1px solid #019934!important; font-weight: 400;
    letter-spacing: 0; font-size: 15px; font-weight: 500;}
#modal2 .modal-body{height: auto!important;}
#modal2 div#show-vault-msg { text-align: center;}
#modal2 div#show-vault-msg a {font-weight: 500; letter-spacing: 0;}

/*#attachfiles .modal-body {height: auto;}*/
#attachfiles .uploadSec{margin-top: 0;}
#attachfiles #upload-btn { background: #019934; font-size: 15px; font-weight: 500;}
#attachfiles .uplDrpbox{display: inline-block;}
#attachfiles.modal{top: 20%;}

/*all popup modal styles ends*/

.logo-new{max-width: 210px;}
.vault-login .btn-primary{background: #019934!important;}
#forgot-vault { background: none; border: 2px solid #1c1b17; color: #1c1b17; font-weight: 400;}
button.dt-button.audit{background: #1c1b17!important;}
.psfontaws{background-color: rgb(1 153 52)!important;}
button.btn.btn-danger.butDiscard { background: #1c1b17;}
.col-page-no{background: #019934!important;}
.emlFldPge .card.shadow { border: 2px solid #019934!important;}
.emlFldPge .card-body .text-left a { color: #019934!important;}
#myTabContent .drawing-container .btn-warning { background: #1c1b17;}
#sdeNav .btn-warning { background: #1c1b17;}
#sdeNav .btn-danger.btn-discard {background: #1c1b17;}
.tawk-min-container .tawk-button-circle.tawk-button-large{background: #019934!important;}
.adttrlPge .btn-sec{background: #019934!important;}
.usrQues .fill-answers input.btn-sec{background: #019934!important;}
.create-vault-page .card-button{background-color: #019934;}
#sdeNav .btn-danger {background: #1c1b17;}
#sdeNav .btn-danger:hover {background: #4c4a42;}
.graph-chart-parent p label{font-weight: 500;}
.lead.btnLead .btn-primary{color: #000!important;}
.feature-icon.text-bg-primary{background-color: #019934 !important;}

/*style moved internally from index/landing page*/

.lngPge .nav-tabs .nav-link {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    padding: 8px 16px;
    margin: 0px 0px -1px 0px;
}
.lngPge .nav-tabs .nav-link.active{
    border: 1px solid #ccc!important;
    border-bottom: none!important;
}


.custom-container{max-width: 1340px; margin: 0 auto;}
.custom-container-sticky{position: fixed; width: 100%; top: 0; left: 0; z-index: 10;
padding: 0 10px; background: #fff; box-shadow: 0px 0px 5px #000;}
.carousel-dark .carousel-caption {color: #fff; width: 50%; position: static;
padding: 20px 30px 20px 70px;  display: inline-block; vertical-align: middle;}
.carousel-dark .carousel-caption h5 {color: #000; font-size: 30px;}
.carousel-dark .carousel-caption p {color: #000; font-size: 16px; margin-bottom: 30px;}
.carousel-dark .carousel-caption .note-wrap p {color: #fff; font-size: 16px; margin-bottom: 0px; font-weight: bold;
    padding: 15px 15px 0 15px; letter-spacing: 2px;}
.btn-theme-solid{background:#019934; border: 2px solid #019934!important; color: #fff; font-weight: 400; letter-spacing: 1px;}
.btn-theme-solid:hover, .btn-theme-solid:active{background:#019934; border: 2px solid #019934!important;}
.btn-theme-outer { border: 2px solid #019934!important; color: #000; font-weight: 400; letter-spacing: 1px;}
.btn-theme-outer:hover{border: 2px solid #019934!important; color: #019934;}
.navbar-expand-lg .navbar-nav .nav-item { border-bottom: 2px solid transparent; transition: 1s;}
.navbar-expand-lg .navbar-nav .nav-item:hover { border-bottom: 2px solid #019934;}
.navbar-expand-lg .navbar-nav .nav-link{margin-left: 0 !important;}
.dasBrd .navbar-expand-lg .navbar-nav .nav-item:hover { border-bottom: none; }
.dasBrd .navbar-expand-lg .navbar-nav .nav-item{border-bottom: none; margin: 0 13px;}


 .parallel-effets {background-image: url("../img/psimg44.jpg");  min-height: 500px; 
  background-attachment: fixed; background-position: center;  background-repeat: no-repeat;  background-size: cover;}
.parallel-effets .home-text17{color: #fff;}
.parallel-effets .feature-card-text{color: #fff;}
.parallel-effets .feature-card-text1{color: #fff;}
.parallel-effets .home-text16{margin-top: 50px;}
.parallel-effets .feature-card-text2{font-weight: 500; color: #fff;}
.subsc-section{background:#002586;  min-height: 500px; 
background-attachment: fixed; background-position: center;  background-repeat: no-repeat;  background-size: cover;}
.services-icons {background: #fff; height: 70px; width: 70px; text-align: center;
padding: 10px; box-sizing: border-box; border-radius: 50%; line-height: normal;
vertical-align: middle; margin-bottom: 10px;}
.services-icons img.feature-card-image {width: 70%; object-fit: contain; height: auto;
margin: 6px 0 0 0; line-height: normal; vertical-align: middle;} 
.carousel-img {width: 49%; display: inline-block; vertical-align: middle; background: none; border-radius: 0px;} 
.carousel-inner{width: 100%;}

.btn-theme-outer:active { color: #3282c0;}
.logo-new{max-width:210px; border-right: 1px solid #ccc;  padding-right: 30px;}
.canvas-pages-head .logo-new{border-right:none;}
.footer-image.logo-new{border-right: none;  padding-right:0px;}
.carousel-dark .carousel-control-prev-icon, .carousel-dark .carousel-control-next-icon { filter: unset;}
.carousel-control-prev-icon, .carousel-control-next-icon { width: 3rem; height: 3rem;
background-color: #019934; border: 10px solid #019934;}
.banner-text-hover{display:none;}
.parallel-effets .feature-card-text1{overflow: hidden; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-line-clamp: 5; white-space: normal;}
#typed,#typedTwo,#typedThree {font-size: 24px;  font-style: italic; font-weight: bold; line-height:30px; font-family: 'BatfideSignatureL39K3';
letter-spacing: 5px;}
.upload-doc-name #typed{font-size: 16px;font-style: normal; font-weight: 500;
    line-height: 30px; letter-spacing: 0px; font-family: var(--ps-font-noto);}

    .note-wrap {width: 400px; min-height: 40px; padding: 15px 0px 0px 0px; margin: 0;  position: absolute;
  font-size: 24px; vertical-align: top; display: inline-block;  font-family: Englebert, Arial;  color: #4b453c;
  background: #F7E999;  line-height: 34px;  text-align: center;  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);  top: 25px;
  z-index: 1; right:20px;}
.note-wrap:before { display: block;  content: "";  background: rgba(227, 200, 114, 1);  width: 130px;  height: 28px;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);  border-radius: 6px/18px 0;  position: absolute;  top: -13px;  left: 130px;
  -webkit-transform: rotate(-2deg);  -moz-transform: rotate(-2deg);  -o-transform: rotate(-2deg);  -ms-transform: rotate(-2deg);
  transform: rotate(-2deg);}
.note-wrap a {  color: #6b824f;  text-decoration: none;  font-size: 20px;  -webkit-transition: all 0.4s ease;  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;  -ms-transition: all 0.4s ease;  transition: all 0.4s ease;}
.note-wrap a:hover {  color: #D83A25;}
.note-yellow{  background: url(../img/wooden-plank-bg.png); background-size: contain;  -webkit-transform: rotate(4deg);  -moz-transform: rotate(4deg);  -o-transform: rotate(4deg);
  -ms-transform: rotate(4deg);  transform: rotate(4deg);}
 .note-wrap p{margin-bottom:0; line-height: 26px; font-size:18px;}
 .note-blue {background: url(../img/wooden-plank-bg.png); background-size: contain; -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg);
  -o-transform: rotate(4deg); -ms-transform: rotate(4deg); transform: rotate(4deg);}
  .note-pink {background: url(../img/wooden-plank-bg.png); background-size: contain; -webkit-transform: rotate(4deg); -moz-transform: rotate(4deg);
  -o-transform: rotate(4deg); -ms-transform: rotate(4deg); transform: rotate(4deg);}
.note-green { background: url(../img/wooden-plank-bg.png); background-size: contain; -webkit-transform: rotate(4deg);-moz-transform: rotate(4deg);
  -o-transform: rotate(4deg);-ms-transform: rotate(4deg); transform: rotate(4deg);}

  /**/
  .dasBrd.canvas-pages-head .navbar {
    box-shadow: 0px 0px 5px #000!important;
    background: #fff!important;
    border-radius: 0;
    margin: 0!important;
    z-index: 9;
}
.canvas-pages-head .navbar-expand-lg .navbar-nav .nav-link{color: #000!important;}
.canvas-pages-head .navbar-nav li.nav-item.dropdown a .fa-bell {
    font-size: 18px;
    color: #019934;
}
.canvas-pages-head .dropdown .btn.dropdown-toggle{color:#000!important;}
.canvas-pages-head .dropdown .dropdown-toggle:after{border-top: 7px solid #000!important;}
.canvas-pages-head .navbar-nav i { color: #019934!important;}

.canvas-pages-head .canvsPge1.canvas-new-design .cutm-lft-pnl {
    height: calc(100vh - 70px);
    margin-top: 0 !important;
    border-radius: 0; margin-top: 0!important; margin-right: 0; box-shadow: 0px 7px 8px #999!important;
}
.navImg .signfields img {  max-width: 245px!important; padding-right: 30px!important;}
.cnvsBtm .rtl-pnl .thmbNails {
    height: calc(100vh - 70px)!important;
    bottom: 0!important;
    border-radius: 0; right:0; top: 0; position: absolute;
}

.canvas-bg{background: #eaeaea;}
.canvsPge1 div#sdeNav{padding-top: 20px;}
.accordion-body .thumbnail-Nw, .accordion-body .thumbnail{width: 43%;
    display: inline-block;}
  /**/

.view-doc-pages .canvsPge1.canvas-new-design .cutm-lft-pnl {width: 240px;}

/*style moved internally from index/landing page ends*/  
.atthImgs.attachedFiles{width:823px;}
.atthImgs{width:823px!important;}
#attached_files img{width:100%!important; max-width:unset!important;}

#error-message button.close{float: none; position: absolute; right: 5px;top: 14px;}
     #success-message button.close{float: none; position: absolute; right: 5px;top: 14px;}

     .zoom-desk{display:block;}
     .zoom-mob{display:none;}   

 .sidenav-header .logo-new{border-right: none;}      

 #recstampModal #updrecstmp-tab-pane .uplDesk input#recstampfile {opacity: 0; height: 100px;
    z-index: 9; position: relative;}

 #stampModal #updstmp-tab-pane .uploadSec input#stampfile {opacity: 0; height: 100px;
    z-index: 9; position: relative;}   

 #recstampModal #updrecstmp-tab-pane .uplDesk i { position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);}

 #stampModal #updstmp-tab-pane .uploadSec i{position: absolute; top: 50%; left: 50%;
    transform: translate(-50%, -50%);}

    #recstampModal #updrecstmp-tab-pane .uplDesk {min-height: 180px;}
    #cstrecstmp-tab-pane .txtStamp .txtStampInpt { margin-top: 20px;}

  #cststmp-tab-pane .txtStamp .txtStampInpt { margin-top: 20px;}  

/*extra large screen*/
@media screen and (min-width:1921px){
    .lg-col.flex-column {flex-direction: unset!important; justify-content: left!important;}
    .bllgPge .container-contactPS{align-items: flex-start!important;}
}
/*extra large screen ends*/

/**/
 /*larger screen styles*/
          @media screen and (min-width:1470px){
            .canvas-pages-head .canvsPge1 .cutm-lft-pnl{height: calc(100vh - 70px)!important;}
            .canvsPge1 .cntr-pnl { height: 83vh !important;}
            .canvsPge1 .rtl-pnl .thmbNails{height: calc(100vh - 70px)!important; margin-top: 0px;}
            .cnvsBtm .rtl-pnl .thmbNails{position: sticky!important;}
            .atthImgs.attachedFiles{width:100%;}
            .atthImgs{width:100%!important;}
          }
/**/

/*tablet styles*/

@media screen and (min-width:768px) and (max-width:1024px){
    .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-collapse{justify-content: flex-start!important;}
    .iso-certi,.aadhaar-certi{display: none;}
    .header-free-trail .btn { margin-left: 0!important;}
    .carousel-dark .carousel-caption .note-wrap p{padding: 4px 10px 0 10px; line-height: 22px; line-height: 22px;}
    .note-yellow{background-size: 100%;}
    .carousel-overlay-txt h2 { line-height: 22px;}
    .carousel-overlay-txt h2 a {font-size: 20px!important;}
 
    .home-section-six{padding: 10px 15px!important;}
    .home-image7{margin-top: 20px;}
    .parallel-effets .home-text16{margin-bottom:0; padding: 0 15px;}
    .testimonial-item .testimonial-text{padding: 10px!important;}
    .carousel-overlay-txt{height: auto!important; width: 90%!important; right: 0; margin: 0 auto; top: auto!important; bottom: 30px;}
    .search-wrapper{margin-top: 20px;}

    .dasBrd .navbar{margin: 0!important;}
    #navbarBlur .container-fluid.py-1.px-3 {padding: 0!important;}
    .dasBrd .navbar-expand-lg .navbar-nav .nav-item{margin: 0 6px;}
    .dasBrd .navbar-expand-lg .navbar-nav .nav-item i { font-size: 17px;}
    .navbar-nav li.nav-item.dropdown a .fa-bell { font-size: 17px;}
    .pie-chart-parent .card img { width: 125px!important; height: 125px!important; top: 25px!important;}
    .col-right-panel .dashboard-tabs-content .card.status-panel .h5{text-align: center;
    width: 100%;}
    .col-right-panel .dashboard-tabs-content .card .card-body.tab-content .tab-pane .card .card-body p{font-size: 13px;
    text-align: center;}
    .pie-chart-parent{margin-bottom: 180px;}
    .graph-chart-parent{width: 210px;}
    :not(.main-content) .navbar .dropdown .dropdown-menu.show{position: absolute; top: 30px;}
    .inboxPge #dataTable_paginate{margin-top: 14px!important;}
    .logo-canvas { max-width: 120px; padding-left: 10px;}
    .logo-canvas .logo-new {width: 100px;}
    .canvas-pages-head.dasBrd .navbar-expand-lg .navbar-nav .nav-item { margin: 8px 6px!important;}
    .cnvsBtm .rtl-pnl .thmbNails{position: static; width: auto;}
    .canvsPge1 .sideimage { box-shadow: 0px 0px 5px #000; overflow-y: hidden; position: fixed; bottom: 67px; width: 100%; overflow-x: hidden; left: 0; z-index: 99999; right: 0;
    margin: auto; white-space: nowrap; background: #fff;}
    .canvsPge1 .sideimage .accordion {display: inline-block; vertical-align: middle;
    margin-left: 10px; width: 100%;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item {width: 100%;
    display: inline-block;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-button { padding: 0 10px 0 0;
    font-size: 14px; margin-bottom: 10px;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body { white-space: nowrap;
    border-right: 2px solid #ccc; overflow-x: scroll; padding: 0px 12px;}
    #thumbnailContainer { padding: 0;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body .thumbnail {
    display: inline-block; width: auto;}
    .canvsPge1 .rtl-pnl .accordion-body .thumbnail-Nw img, .accordion-body .thumbnail img {
    max-width: 40px!important;}
    .cnvsBtm .cntr-pnl{width: 100%; max-width: 800px; height: 700px!important;}
    .canvas-new-design .canvas-container{width: 100%!important;}
    .modalMd{width: 90%!important;}
    .modal{width: 710px;}
    .logo-new{border-right: none; padding-right: 0;}
}
/*tablet styles ends*/


/*mobile styles*/
@media screen and (max-width:767px){
    #thumbnailContainer{padding: 0;}
    .dasBrd .navbar-expand-lg .navbar-nav .nav-item {  margin: 0px;}
    .intro-message img { width: 90%;}
   .navbar .container-fluid{padding-left:0; padding-right:0;}
   .navbar .navbar-brand{margin: 0!important; padding-left: 0!important;}
   .navbar  button.navbar-toggler {border: none; padding: 0;}
   .navbar-collapse {position: relative; border-top: 1px solid #ccc; margin-top: 15px; padding-top: 15px;}

   .lgn .container {padding: 0!important;}
   .lngPge .section-heading {margin-bottom: 10px; font-size: 20px;}
   .lngPge .lead {font-size: 16px;}
   .navbar{margin: 16px!important;}
   .navbar.blur{background-color: rgba(255, 255, 255, 1) !important;}
   .fPwd {margin-top: 50px;}
   .fPwd .container {padding: 0!important;}
   .rc-anchor-normal{width: 280px!important;}
   .rc-anchor-logo-portrait {margin: 10px 0 0 12px!important;}
   .rc-anchor-normal .rc-anchor-pt{margin: 2px 26px 0 0!important; width: auto!important;}
   .bllgPge .container-fluid { padding: 0;}
   .modal{width: 100%;}
   .dasBrd .navbar{margin-top: 0!important;}

   .tpCds .card{background-size: 100%; min-height: unset;}
   .tpCds .icon-shape{margin: 0 auto;}
   .navbar h3 {display: none;}
   .srch {display: none!important;}
   .navbar-collapse{border-top: none; padding-top: 0;}
   .dropdown .btn.dropdown-toggle {font-size: 0;}
   .navbar-collapse .navbar-nav .nav-item.dropdown.ntfy-drp {position: relative;}
   .mb-logo{display:block!important;}
   .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-nav{justify-content: space-between!important;}
   .navbar-main{margin-right: 0px !important; margin-left: 0px !important;}
   .dropdown .btn.dropdown-toggle{margin: 0 5px 0 20px;}
   .navbar-nav .dropdown-menu {position: absolute;right: 10px!important; top: auto!important;left: auto!important;}
   .dropdown .dropdown-menu.show:before {top: -20px; right: 16px; left: auto;}
   .dropdown .dropdown-menu.show:before {font-family: "FontAwesome"; content: "\f0d8"; position: absolute; top: -20px; right: 16px; left: auto;}
   .desk-show{display:none!important;}
   .xs-show{display:block;}
   .navbar-collapse .navbar-nav .nav-item.dropdown.ntfy-drp .fa-bell:before { color: #fff;}
   .fPwd .card.card-plain {margin: 0!important;}
   .min-vh-100.fPwd{min-height: 80vh !important;}
   .lgn .form-check.form-switch label { margin-left: 0;}
   .upldPge .upload-files-container{width: 100%;  padding: 10px 10px; border-radius: 20px;}
   .upldPge .drag-file-area{padding: 30px 20px;}
   .upldPge .file-block{width: 100%;}
   .upldPge .file-name { word-wrap: break-word; width: 46%; padding-right: 10px;}
   .upldPge .file-block{position: relative;}
   .upldPge .file-size {white-space: nowrap; padding-left: 10px;}
   .upldPge .remove-file-icon{position: absolute; right: 10px;}
   .upldPge .drag-file-area h3 { font-size: 18px;}
   .upldPge .drag-file-area p{font-size: 13px;}
   .upldPge .upload-button{padding: 7.5px 15px; display: inline-block; margin: 0 10px 0 0;}
   .cancel-upload{padding: 7.5px 15px; display: inline-block; width:auto;}

   .emlFldPge .card-body label {font-size: 14px;}
   .addRecpt{position: relative;}
   .emlFldPge .addRecpt .btn-secondary.add-btn { position: absolute; right: 20px; bottom: 30px;}
   .accntPge .image_area { margin: -100px auto 30px; width: 102px;}
   .inboxPge .card .card-body{padding: 1rem;}
   .lngPge .intro-message > h1{font-size: 2em;}
   .lngPge .intro-message > h3{font-size: 16px;}
   .lngPge .intro-social-buttons li a.btn{width: 40px; height: 40px; line-height: 32px;}
   .lngPge .btn.btn-lg i, .lngPge .btn-group-lg>.btn i{top: 7px; font-size: 20px;}
   .lngPge .intro-social-buttons li { margin: 0 5px;}
   .lngPge .intro-message {position: absolute; padding-top: 0; padding-bottom: 0; bottom: 30px; left: 0;
    right: 0;}
    .lngPge .intro-header{position: relative;  height: 460px;}
    .lngPge .container-fluid {margin: 0; padding: 0;}
    .navbar img.navbar-brand-img {max-width: 150px;height: auto!important;}
    .navbar.navbar-expand-lg{padding: 14px 15px!important;}
    .dasBrd .navbar.navbar-expand-lg { padding: 8px 0px!important; margin: 0!important;}

    /*new lines for desktop*/
    .canvsPge .sidebar{width: 62px; padding: 6px 2px;}
    .canvsPge .sidebar li button .PS-8{display:none;}
    .canvsPge .sidebar.open li button .PS-8{display:block;}
    .canvsPge .thmbNails {position: fixed;bottom: 40px;left: 0px; right: 0px; margin: auto;width: 94%; height: 145px; overflow-y: hidden; overflow-x: scroll; background: #fff; box-shadow: 0px 0px 5px #000;
        white-space: nowrap;}
   
    .canvsPge .thumbnail {display: inline-block; width: 20%;}
    .canvsPge .thumbnail a>img, .canvsPge .thumbnail>img{display: inline-block;}
    .canvsPge .home-section .scroll img#image6 { margin-bottom:180px;}
    .canvsPge .thumbnail .caption p{margin:0; font-size: 12px;}
    .canvsPge .thumbnail .caption {padding: 4px 0px;}
    .canvsPge .home-section .scroll img{width: 100%;}
    .canvsPge .container-fluid{padding-left: 0px;}
   

    .canvsPge1 .cutm-lft-pnl {border-radius: 10px;}
    .canvas-container1{width: 300px;}
    .canvsPge1 #sdeNav .nav-link.btn-drag{font-size: 0;}
    .canvsPge1 .icon-sm.icon{font-size: 14px; padding: 10px;}
    .canvsPge1{padding: 0 2px;}
    .canvsPge1 #sdeNav .nav-link.btn-drag{padding: 10px; margin: 0;}
    .canvsPge1 .cutm-lft-pnl{margin-right: 10px; width: 120px; border-radius: 5px;}
    .canvsPge1 .rtl-pnl .thmbNails{right: auto; bottom: 13px; width: 80%; height: 70px; left: 60px;}
    .canvsPge1 .dropped .icon-sm.icon{top: -3px;}
    .canvsPge1 .rtl-pnl .thmbNails{position: static; box-shadow: none!important; height: auto; background: none; width: auto;}
    .canvsPge1 .sideimage {position: fixed;bottom: 40px;left: 56px;right: 0; margin: auto; width: 78%; box-shadow: 0px 0px 5px #000; overflow-y: hidden; overflow-x: scroll; white-space: nowrap; background: #fff;}
    .canvsPge1 .sideimage .ul {position: static; max-height: unset; width: 100%; background: #fff; display: inline-block; vertical-align: middle;}
    .canvsPge1 .thumbnail { display: inline-block; width: 20%;}
    .canvsPge1 .thumbnail .caption { padding: 4px 0px;}
    .canvsPge1 .thumbnail .caption p {margin: 0; font-size: 11px;}
    .canvsPge1 .sideimage hr{display:none;}
    .canvsPge1 .sideimage .accordion {display: inline-block; vertical-align: middle; margin-left: 10px; width: 100%;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item {width: 100%; display: inline-block;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-button {padding: 0 10px 0 0; font-size: 14px; margin-bottom: 10px;}

    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body {white-space: nowrap; border-right: 2px solid #ccc; overflow-x: scroll; padding: 0px 12px;}
    .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body .thumbnail-Nw {display: inline-block; width: auto;}
    .canvsPge1 .sdeNavImg img { padding: 4px; max-width: 60px;}
    .finalPge button.btn.btn-primary { width: 100%;}
    .mdl-tabs .modal {width: 100%;}
    .mdl-tabs ul#myTab li button{font-size: 13px;}
    .mdl-tabs.update-stamps ul#myTab li button#home-tab{font-size: 0;}
    .mdl-tabs ul#myTab li{margin-right: 15px;}

    .mdl-tabs .txtSign{align-items: flex-start;}
    .mdl-tabs .txtSign{background: #f6f7f9; margin-bottom: 25px; flex-direction: column;}
    .mdl-tabs .txtSign #placeToPasteValue, .txtSign #placeToPasteValue1, .txtSign #placeToPasteValue2{margin-left: 0; padding: 0;}
    .mdl-tabs .txtSign .txtSignInpt input {background: #f6f7f9;}
    .mdl-tabs #Draw{flex-direction: column;}
    .mdl-tabs #Draw .controls{text-align: center;}
    .mdl-tabs #Draw .controls li { display: inline-block;}
    .mdl-tabs #Draw .controls button {margin: 0;}
    .sntPge .modal .btn{--bs-btn-padding-x: 1.0rem;}
    .sntPge .modal{width: 100%;}
    .canvsPge1 div#sdeNav .drag-drop-nav.navbar-nav i { color: #019934;}
    .cnvs-thubnails .cutm-lft-pnl.cstm-btns-cnvs { padding: 5px; width: 100px;}  
    .cnvs-thubnails .cutm-lft-pnl.cstm-btns-cnvs .btn{font-weight: normal; padding: 5px}  
    .cnvs-thubnails .lft-pnl-btns .scroll{width: 70%; margin-left: 110px;}
    .btm-btm-stky .btn{margin: 5px 0 5px 0; padding: 7px 8px;}
    .canvsPge1 .sideimage{left: 0; width: 96%; z-index: 99999;}
    .dasBrd .modal { width: 350px;}
    .dropdown .dropdown-menu.show li .dropdown-item span.badge {text-transform: capitalize; font-size: 14px; font-weight: 400; color: var(--bs-dropdown-link-color)!important; padding: 0;}
    .navbar-collapse .navbar-nav .nav-item.dropdown.ntfy-drp { margin-right: 0!important;}
    ul.dropdown-menu.dropdown-menu-end.px-2.py-3.me-sm-n4.show:before { font-family: "FontAwesome";
    content: "\f0d8";  position: absolute;}
    .dshbrd-hdr{right: 25px; top: 85px;}
    .row.tpCds .bg1{flex-wrap: wrap;}
    .dropdown .ntfys.dropdown-menu.dropdown-menu-end{right: -55px !important;}
    .drag-desk{display: none;}
    .drag-mob{display: block;}

    /*canvas responsive*/
    .cntr-pnl {height: auto; max-width: 767px; width: 100%;}
    .canvas-container{width: 100%!important;}
    canvas{height: auto!important;}
    .canvsPge1 .cutm-lft-pnl{z-index: 9; width: 50px;}
    .canvsPge1 .sideimage{bottom: 67px; width: 100%; overflow-x: hidden;}
    /*canvas responsive ends*/

    .browse-desk{width: 100%;}
    .lead.btnLead{width: 120px;}
    .cstmHeading{width: 60%;}
    .emlFldPge,.inboxPge  { margin-top: 36px!important;}
    .lead.btnLead .btn-primary{font-size: 12px; padding: 10px 6px;}

    /*left panel*/
    .cvsRecr .cutm-lft-pnl {width: 100%; height: auto; position: fixed; bottom: 0;
    right: 0; overflow: auto; left: 0;  max-width: unset!important; z-index: 999999; margin-bottom: 0!important;
    border-radius: 0;}
    .cvsRecr .cutm-lft-pnl .sdeNavImg { display: none;}
    .cvsRecr .cutm-lft-pnl #sdeNav{padding-bottom: 0px; overflow: hidden;}
    /*left panel ends*/
   .actionItems {position: fixed; bottom: 40%; right: 0; z-index: 99999;}
   .actionItems i { font-size: 40px;}
   .cvsRecr .cutm-lft-pnl #sdeNav .btn { width: auto; padding:10px 15px; line-height: 14px; margin-right: 5px; font-size: 14px;
    white-space: nowrap; margin-bottom: 0!important;}
   .cvsRecr.canvsPge1 .sideimage{bottom: 74px;}
   .mdl-tabs .modal .modal-dialog{width: 96%!important;}
   .uploadSec .uplDesk, .uploadSec .uplDrpbox, .uploadSec .uplDrive{min-height: 132px; width: 46%;}
   .cvsRecr .viewDocBtns { text-align: center; height: auto; overflow: hidden;}
   .cvsRecr .viewDocBtns1{ text-align: center; display: inline-flex;}
   .sdeNavImg .navbar-brand img.drag-mob {width: 100%;}
   .cvsRecr .toast{bottom: 100px; top: auto; left: 10px; z-index: 999999;}
   table.srch-fltr-tble td { width: 100%!important; display: block; margin-bottom: 5px;}
   .accntPge{padding: 0;}
   .sttngpge .card .card-body{padding: 10px 15px;}
   .navbar-collapse .navbar-nav .nav-item.dropdown.srch-parent { margin-right: 16px!important;
    margin-left: 14px;}
    .srchBar{top:66px; right: 0; width: 100%; background: #ccc; padding: 10px; z-index: 9;}
    .srchBar .srchClose{top: 10px;}
    .srchBar:before {content: ''; border-bottom: 10px solid #ccc; border-left: 10px solid transparent;
    border-right: 10px solid transparent; position: absolute; top: -9px; right: 147px;}
    .canvas-pages-head a#iconNavbarSidenav { display: none;}
    .canvas-pages-head .cntr-pnl{margin-top: 0px!important;}
    .canvas-pages-head .canvsPge1 .cutm-lft-pnl{margin-top: 0px!important; height: 70px;}

    .documentInfo div{flex-direction: column; margin-bottom: 5px!important; word-wrap: break-word;}
    .canvas-pages-head .cntr-pnl{margin-bottom: 10px;}
    .canvas-pages-head .navbar-collapse .navbar-nav .nav-item.dropdown.ntfy-drp{position: absolute; right: 94px;}
    .select-question-num{padding: 10px;}
    .vaultQuestions select{width: 100%;}
    .fill-answers {padding: 10px 10px 10px 10px;}
    .select-question-num{border-radius: 5px 5px 0 0;}

    ul.nav.nav-tabs.card-header-tabs { white-space: nowrap; width: 100%; overflow: hidden; overflow-x: auto; display: block; scrollbar-color: #444 #999; margin: 0; padding:5px 4px 0 0;}

    ul.nav.nav-tabs.card-header-tabs::-webkit-scrollbar{ height: 5px;}
    ul.nav.nav-tabs.card-header-tabs::-webkit-scrollbar-thumb{ background: #ccc;  border-radius: 10px;}
    .nav-tabs.card-header-tabs li.nav-item {display: inline-block; padding: 10px 0 10px 15px;}
    .sttngpge .nav.nav-pills .nav-link { padding: 5px 5px; font-size: 14px;}
    footer { margin-bottom: 80px;}
    .drag-file-area label { font-size: 16px; line-height: 17px;}
    /*faq pages*/
    .faqPage .card .card-body {padding: 1rem;}
    .faqPage #faq .container { padding: 0;}
    .faqPage .container { padding: 0;}
    /*faq pages*/
    .dashboard-tabs .card .nav-pills .nav-item a.nav-link.active:before{bottom: 2px;}
    .col-right-panel .dashboard-tabs-content .card{margin-top: -4px;}
    .doc-name-info{top: 76px;}
    .canvas-container .pageNumber{top: 35px!important; left: 90%!important;}
   .drpDwn .dropdown-menu.show{background: #fff!important;}
   .upload-files-container .upload-doc-name label a{width: 300px;  display: inline-block;  overflow: hidden;}

   .pie-chart-parent{margin-bottom: 0;}
   .graph-chart-parent{position: static; margin-bottom: 0; margin-top: 0px;}

   .lngPge .carousel-item .carousel-caption p {color: #3c88c3!important;font-size: 22px;
    text-align: left!important; padding: 15px 0 0 0!important;}
    .carousel-caption{top: auto; bottom: 20px;}
    .carousel-caption .caption-bg-mob {background: rgba(255,255,255,0.8);}
    .lngPge .carousel-item .carousel-caption h1 { font-size: 21px; color: #000;}
    .summary-panel h4 { margin-bottom: 20px!important;}
    .col-right-panel .card.pie-chart-one, .col-right-panel .card.pie-chart-two {
    top: -15px!important;}
    .uploadSec {margin-top: 0px;}
        .g-sidenav-show.g-sidenav-pinned .sidenav{z-index: 9999;}
    .dasBrd .navbar.position-fixed{width: 100%;}
    #inboxforwardmodal{width:90%;}
    .ps-mb .home-text61 { font-size: 24px;}
    .ps-mb .home-text58 { font-size: 24px;}
    .testimonial-item .testimonial-text {height: 16rem; overflow: hidden;}
    .testimonial-carousel .owl-dot{width: 24px; height: 24px;border-radius: 50%;}
    .testimonial-carousel .owl-dot::after{ width: 16px; height: 16px; top: 3px;  left: 3px;}
    .dataTables_wrapper div.dataTables_paginate ul.pagination{white-space: normal!important;}
    .inboxPge #dataTable_paginate{margin: 20px 5px 20px 5px;}
    #carouselExampleDark .carousel-item.active, #carouselExampleDark .carousel-item-next, #carouselExampleDark .carousel-item-prev { display: flex; flex-direction: column-reverse;}
    #carouselExampleDark .carousel-img{margin-bottom: 30px;}
     #carouselExampleDark .carousel-indicators{bottom: 0px;}
     .carousel-dark .carousel-indicators [data-bs-target] { background-color: #019934!important;}
     .upldPge.mt-5 {margin-top: 0!important;}
     .cstmHeading.mt-5 {margin-top: 0!important;}
     .btm-btm-stky{white-space: nowrap;}
     .btm-btm-stky button#btnsave.mx-3 {margin: 0!important;}
     .btm-btm-stky .butDiscard.mx-3 {margin: 0!important;}
     .emlFldPge .card-body .wrapper { padding: 10px!important;}
     #typed, #typedTwo, #typedThree{font-size: 20px!important; line-height: 20px!important;}
     .btn-theme-outer, .btn-theme-solid{padding: 10px 6px;}
     .testimonial-section { padding: 10px 0 30px 0!important; margin: 0!important;}
     .testimonial-item .testimonial-text{padding: 10px!important;}
     .testimonial-item .border2{border: 1px solid #000 !important; box-shadow: 0px 0px 5px #000;}
     .testimonial-carousel .owl-dots{margin-top: 0;}
     footer.footer-footer.section-container.p-5 { padding: 20px 10px!important;}
     .lgn .card.card-plain.mt-7 { margin-top: 80px!important;}
     .btn.w-100.btnLn,a.btn.w-100.btnTwt,a.btn.w-100.btnFb,a.btn.w-100.btnGml {padding: 0;}
     .lead.btnLead .btn-primary i { margin-right: 4px!important;}
     .lead.btnLead .btn-primary {font-size: 11px; padding: 10px 5px;}
     footer.footer.pt-3.mt-9 { margin-top: 50px!important;}
     .screenshot_slider .owl-item .item{margin: 50px 0 0 0;}
     .canvas-pages-head .canvsPge1.canvas-new-design.cvsRecr .cutm-lft-pnl{height: auto;}
     .canvsPge1.cvsRecr div#sdeNav {padding-top: 0;}
     .accordion-body .thumbnail-Nw img, .accordion-body .thumbnail img{max-width: 40px;}
     .canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body .thumbnail-Nw .caption p {
    margin: 0 5px 0 5px;}
    .cnvs-forward .navImg .signfields img { padding-right: 0px!important;}
    .g-sidenav-show .navbar:not(.sidenav).navbar-main .navbar-collapse{margin-top: 0!important;}
    .view-doc-pages .cvsRecr .cntr-pnl {margin-left: 0;}
    .view-doc-pages .viewDocImg {width: 100%;}
    .view-doc-pages .canvsPge1.canvas-new-design .cutm-lft-pnl {width: 100%;}
    .view-doc-pages .canvsPge1.cvsRecr div#sdeNav{padding: 20px 0!important;}
    .atthImgs.attachedFiles{width:100% !important;}
    .atthImgs{width:100%!important;}
    .graph-chart-parent .card.mt-5 { margin-top: 80px!important;}   
    .pie-chart-parent .card.mt-5 { margin-top: 80px!important;}
    .dasBrd .col-right-panel{position: relative;}   
    .col-right-panel .graph-chart-parent .chart-toggle {position: absolute;top: 75px;   
        left: 10px;}
     .lgn .btnGml { padding: 8px 40px!important;}  
     #error-message button.close{float: none; position: absolute; right: 5px;top: 14px;}
     #success-message button.close{float: none; position: absolute; right: 5px;top: 14px;}
     .pymt-free-page .container-fluid .container{padding:0!important;}
     .navbar-expand-lg .navbar-nav .nav-item:hover { border-bottom: none;}
     .zomm-btn {position: fixed;  top: auto; bottom: 104px; left: 65px;  z-index: 99999;}
     .zoom-desk{display:none;}
     .zoom-mob{display:block;}
     .succRtngPnl .hdeRtngSucc{width: 100%!important; position:static;}
     .user-review-details{margin-bottom: 25px;}
     .review-main .rating {width: 83%!important;}
     .rev-rating .review-main .form-row { width: 100%!important;}
     :not(.main-content) .navbar .dropdown .dropdown-menu.show{z-index: 9;}

}

 /*beark point 339px*/
    @media screen and (min-width:300px) and (max-width:339px){
        .navbar.navbar-expand-lg { padding: 10px!important; margin:16px 0!important;}
        .custom-container-sticky .navbar{margin: 0!important;}
        .registr-page{margin: 0!important;}
        .dasBrd .navbar.navbar-expand-lg {  margin: 0 0 10px 0!important;}
        .canvas-pages-head.dasBrd .navbar.navbar-expand-lg {  margin: 0!important;}
        .navbar img.navbar-brand-img{max-width: 140px; border-right: none; padding-right: 0;}
        .dasBrd .navbar img.navbar-brand-img { max-width: 110px; margin-top: 7px;}
        .home-text25{line-height: 32px;}
        .home-text17{font-size: 24px;}
        .dasBrd .container-fluid.py-1.px-3 { padding: 0px 5px!important;}
        a#iconNavbarSidenav {margin-top: 4px;}
        .dshbrd-hdr{top: 62px;}
        .lead.btnLead .btn-primary {font-size: 11px; padding: 10px 5px;}
        .pie-chart-one .card-body img, .pie-chart-two .card-body img {width: 150px!important; height: 150px!important; top: 26px!important;}
        .graph-chart-parent{width: 235px;}
        .dropdown .ntfys.dropdown-menu.dropdown-menu-end{width: 250px;}
        .dropdown .ntfys.dropdown-menu.dropdown-menu-end .notifications h6 span{height: auto;}
        .upload-files-container #file-list li{padding: 19px 39px 19px 10px;}
        .mdl-tabs #Draw .controls li{margin: 10px 5px;}
        .mdl-tabs ul#myTab li button{width: 67px; line-height: 16px; margin-bottom: 10px;
        vertical-align: middle;}
        .dasBrd .modal {width: 300px;}
        .navbar-nav .dropdown-menu{right: 20px!important;}
        .review-main .rating label{font-size: 24px!important;}
        .review-main .rating {width: 88%!important;}

    }
    /*beark point 339px ends*/

/*mobile ends*/

/*Billing Responsive Media Screen Starts*/
@media (min-width: 992px) {
    .bllgPge .pricing .card:hover { margin-top: -.25rem; margin-bottom: .25rem;  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.3); }
    .bllgPge  .pricing .card:hover .btn {  opacity: 1; }
    .faqPage .pricing .card:hover{margin-top: 0;}
}

@media only screen and (max-width: 575px) {
    .bllgPge .support-button p {    font-size: 14px;  }
}
  
.bllgPge .support-button i {  color: #3f43fd; font-size: 1.25rem;}
@media only screen and (max-width: 575px) { .bllgPge .support-button i {  font-size: 1rem;   } }
  
.bllgPge .support-button a { text-transform: capitalize; }
  @media only screen and (max-width: 575px) {.bllgPge .support-button a {      font-size: 13px;  }  }
/* Billing Responsive Media Screen ends*/

@media screen and (max-height: 767px){
    #rc-imageselect, .g-recaptcha {
            transform:scale(0.77);
            -webkit-transform:scale(0.77);
            transform-origin:0 0;
            -webkit-transform-origin:0 0;
        }
    }
    /* new thumbnails style starts*/
    .thumbnails-page-num {    position: absolute; left: 2px; bottom: 2px; color: #ffff; font-size: 10px;}
    .accordion-body .thumbnail-Nw, .accordion-body .thumbnail { text-align: center;  background: #fff;    display: inline-block;  position: relative;  margin: 5px;   padding: 0;   border: 2px solid #a9a9a9;}
    .thumbnail::before {   border-color: transparent transparent transparent #a9a9a9;    position: absolute;  bottom: 0;    left: 0;    border-width: 30px 0 0 30px;    border-style: solid;    content: '';}
    .thumbnail.selected {      border: 2px solid #019934;    }      
    .thumbnail.selected::before {  border-color: transparent transparent transparent #019934;    position: absolute;  bottom: 0;    left: 0;    border-width: 30px 0 0 30px;    border-style: solid;    content: '';} 
    @media screen and (max-width: 767px){
.accordion-body .thumbnail-Nw img, .accordion-body .thumbnail img {
max-width: 100%!important;}
.canvsPge1 .rtl-pnl .accordion-body .thumbnail-Nw img, .accordion-body .thumbnail img {
  max-width: 40px!important;}
    }
    @media screen and (max-width: 767px){
.canvsPge1 .rtl-pnl .thmbNails .accordion .accordion-item .accordion-body .thumbnail{
    display: inline-block;
    width: auto;
}
    }
    /* new thumbnails style ends*/
    
.navImg .signfields img {
  line-height: 50px;
  cursor: url("https://www.google.com/intl/en_ALL/mapfiles/openhand.cur"), all-scroll;
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: -o-grab;
  cursor: -ms-grab;
  cursor: grab;
  -moz-transition: -moz-transform 0.2s, box-shadow 0.2s;
  -o-transition: -o-transform 0.2s, box-shadow 0.2s;
  -webkit-transition: -webkit-transform 0.2s, box-shadow 0.2s;
  transition: transform 0.2s, box-shadow 0.2s;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
.navImg .signfields img:hover {
  -moz-transform: scale(1.03, 1.03);
  -ms-transform: scale(1.03, 1.03);
  -webkit-transform: scale(1.03, 1.03);
  transform: scale(1.03, 1.03);
  -moz-box-shadow: #019934 0 1px 3px;
  -webkit-box-shadow: #019934 0 1px 3px;
  box-shadow: #019934 0 1px 3px;
}
.navImg .signfields img:active {
  cursor: url("https://www.google.com/intl/en_ALL/mapfiles/closedhand.cur"), all-scroll;
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: -o-grabbing;
  cursor: -ms-grabbing;
  cursor: grabbing;
  -moz-transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  -webkit-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
  -moz-box-shadow: #019934 0 2px 8px;
  -webkit-box-shadow: #019934 0 2px 8px;
  box-shadow: #019934 0 2px 8px;
}


@media screen and (max-width:767px){
    .navImg .signfields img {
      line-height: 50px;
      cursor: pointer;
      
      -moz-transition: unset;
      -o-transition: unset;
      -webkit-transition: unset;
      transition: unset;
      -moz-border-radius: 10px;
      -webkit-border-radius: 10px;
      border-radius: 10px;
    }
    .navImg .signfields img:hover {
      -moz-transform: unset;
      -ms-transform: unset;
      -webkit-transform: unset;
      transform: unset;
      -moz-box-shadow: none;
      -webkit-box-shadow: none;
      box-shadow: none;
    }
    .navImg .signfields img:active {
      cursor: pointer;
      -moz-transform: unset;
      -ms-transform: unset;
      -webkit-transform: unset;
      transform: unset;
      -moz-box-shadow: none;
      -webkit-box-shadow: none;
      box-shadow: none;
    }
    #logoutModal{padding-right: 0!important; width: 96%;}
    #logoutModal .modal-content{padding: 15px;}

}

.note-wrap:before {
  content: "";
  display: block;
  background: #865a2b;
  width: 6px;
  height: 80px;
  position: absolute;
  top: -70px;
  left: 50%;
  transform: translateX(-50%);
}

.note-wrap:after {
  content: "";
  display: block;
  background: #4b453c;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  position: absolute;
  top: 5px;
  left: 50%;
  transform: translateX(-50%);
}


@keyframes pendulum-swing {
  0% { transform: rotate(4deg); }
  50% { transform: rotate(-4deg); }
  100% { transform: rotate(4deg); }
}

.note-wrap {
  width: 400px;
  min-height: 40px;
  padding: 15px 0px;
  margin: 0;
  position: absolute;
  font-size: 24px;
  vertical-align: top;
  display: inline-block;
  font-family: Englebert, Arial;
  color: #4b453c;
  line-height: 34px;
  text-align: center;
  box-shadow: 0 4px 5px rgba(0, 0, 0, 0.2);
  top: 25px;
  z-index: 1;
  right: 20px;
    animation: pendulum-swing 2s infinite ease-in-out;
  transform-origin: top center;
}