/* @import url('https://fonts.googleapis.com/css?family=Muli:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); */


@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap');

.spanbluebtn {
    background: #D9ECEE;
    color: #1D4F3A;
    border: 1px solid #1D4F3A;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 600;
    padding: 10px 20px;
}

.spanbluebtn+.spanbluebtn {
    margin-left: 10px;
}

.spanredbtn {
    background: #FDEDED;
    color: #ED5354;
    border: 1px solid #ED5354;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 600;
    padding: 10px 20px;
}

.scoretab {
    margin-bottom: 35px;
    display: flex;
}

.scoretab .btntab {
    background: #F6F6F6;
    color: #101010;
    border: 1px solid #CDCDCC;
    border-radius: 30px;
    font-size: 15px;
    font-weight: 600;
    padding: 11px 21px;
}

.scoretab .btntab.active {
    background: #028090;
    color: #ffffff;
    border: 1px solid #028090;
}

.scoretab .btntab+.btntab {
    margin-left: 15px;
}

.whitecard.scorebox {
    /* padding-top: 40px;
    padding-bottom: 50px; */
}

.whitecard.scorebox .CircularProgressbar .CircularProgressbar-path {
    stroke: #065F46 !important;
}

.whitecard.scorebox {
    padding: 30px 0px 0px 0px;
    border-radius: 15px;
}

.whitecard.scorebox .circleinpercent {
    width: 100px;
}

.whitecard.scorebox h4 {
    font-weight: bold;
    font-size: 15px;
    margin-top: 25px;
    padding-bottom: 20px;
}

.whitecard.scorebox .aricon {
    width: 17px;
    border-radius: unset;
}

.whitecard.metergauge {
    padding-top: 40px;
    padding-bottom: 50px;
}

.whitecard.metergauge h4 {
    font-weight: bold;
    font-size: 20px;
    margin-top: 0px;
    padding-bottom: 20px;
}


.managesurveypage {
    position: relative;
}

.managesurveypage .closebtn {
    text-align: right;
    margin: 30px;
}

.managesurveypage .closebtn a img {
    width: 45px;
}

.managesurveypage .themebox {
    background-color: #027F8F;
    padding: 25px;
    color: #fff;
    min-height: 60px;
}

.managesurveypage .themebox h4 {
    font-weight: bold;
    font-size: 20px;
    margin-top: 0px;
    padding-bottom: 15px;
}

.managesurveypage .themebox p {
    font-size: 17px;
    line-height: 1.5;
}

.managesurveypage .themebox .pausebtn {
    display: flex;
    margin-top: 30px;
}

.managesurveypage .themebox .pausebtn button {
    background: #2892A0;
    color: #fff;
    border: 1px solid #ffffff8a;
    border-radius: 30px;
    font-size: 15px;
    font-weight: 600;
    padding: 10px 20px;
}

.managesurveypage .questionsbox {
    padding: 25px;
    background: #F6F6F6;
    min-height: 260px;
}

.managesurveypage .questionsbox h4 {
    font-weight: bold;
    font-size: 20px;
    margin-top: 0px;
    padding-bottom: 15px;
}

.managesurveypage .questionsbox .highlights .highlightslist+.highlightslist {
    margin-top: 20px;
}

.managesurveypage .questionsbox .highlights .highlightslist img {
    width: 40px;
}

.managesurveypage .questionsbox .highlights .highlightslist span {
    color: #808080;
    font-weight: 600;
    font-size: 16px;
    margin-left: 10px;
}

.scorecardlist {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15px !important;
}

.scorecardlist h4 {
    font-weight: bold;
    font-size: 15px;
}

.scorecardlist .rightbtn .chat img {
    width: 17px;
    border-radius: unset;
}

.scorecardlist .rightbtn .editbtn img {
    width: 45px;
}


/* Support Edit Popup Box */
.editpopupbox {
    width: 650px;
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 0px 5px 0 rgb(0 0 0 / 20%);
    border-top-left-radius: 20px;
    position: relative;
    border-top-right-radius: 20px;
}

.editpopupbox .boxhead {
    background-color: #F6F6F6;
    border-radius: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px;
}

.editpopupbox .boxhead .contentleft h4 {
    font-size: 22px;
    font-weight: 600;
}

.editpopupbox .boxhead .contentleft h5 {
    font-size: 17px;
    color: #808080;
}

.editpopupbox .boxbody {
    padding-top: 10px;
    padding-bottom: 30px;
}

.editpopupbox .boxbody .boxcontent {
    background-color: #fff;
    display: flex;
    align-items: center;
    padding: 15px;
    border-bottom: 1px solid #DBDBDB;
    justify-content: space-between;
}

.editpopupbox .boxbody .boxcontent .bc_left {
    display: flex;
    align-items: center;
}

.editpopupbox .boxbody .boxcontent .number {}

.editpopupbox .boxbody .boxcontent .number p {
    background: #EBEBEB;
    color: #808080;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    text-align: center;
    line-height: 40px;
    font-size: 18px;
    font-weight: 600;
}

.editpopupbox .boxbody .boxcontent .supporttext {
    margin-left: 15px;
    margin-right: 15px;
}

.editpopupbox .boxbody .boxcontent .actionbtn {}

.editpopupbox .boxbody .boxcontent .actionbtn .custom-btngroup {
    display: flex;
}

.editpopupbox .boxbody .boxcontent .actionbtn .custom-btngroup .btn-primary {
    background: #FAFDFF !important;
    padding: 8px 15px;
    border-color: #CDCDCC !important;
}

.AddQuestion {
    position: relative;
    margin-top: 25px;
}

.AddQuestion .form-control {
    position: relative;
    height: 60px;
    padding-left: 50px;
    border-radius: 10px;
}

.AddQuestion img {
    position: absolute;
    top: 15px;
    left: 15px;
}

.AddQuestionbtn {
    margin-top: 25px;
    text-align: right;
}

.AddQuestionbtn .addqeestion {
    border-radius: 10px;
    padding: 12px 20px;
    font-size: 17px;
    color: #fff;
}

.AddQuestionbtn .addqeestion:hover {
    color: #fff;
}

.closewhite {
    position: absolute;
    right: -30px;
    top: -35px;
}

.closewhite img {
    width: 80px;
}

.boxpositions {
    position: fixed;
    right: 40px;
    bottom: 0;
}


/* Survey Popup */
.surveydownpopup {
    box-shadow: 0 0px 5px 0 rgb(0 0 0 / 20%);
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    position: relative;
    width: 500px;
    padding: 10px;
}

.surveydownpopup .surveybody .usericon {
    text-align: center;
}

.surveydownpopup .surveybody .usericon {
    width: 80px;
}

.surveydownpopup h4 {
    font-size: 20px;
    font-weight: 600;
    margin-top: 20px;
    padding: 0 30px;
    line-height: 1.2;
}

.surveydownpopup .surveybody {
    padding: 10px 25px 20px 25px;
    text-align: center;
    background-color: #F6F6F6;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}

.surveydownpopup .surveybody .surveyscale {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 10px;
}

.surveydownpopup .surveybody .surveyscale .scale-no {
    width: 60px;
    height: 42px;
    font-weight: 600;
    border: 1px solid #e3e3e3;
    background-color: #fff;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.surveydownpopup .surveybody .surveyscale .scale-no.active {
    background-color: #028090;
    color: #fff;
}

.surveydownpopup .surveybody .surveyscale .des {
    width: 60px;
    height: 42px;
    font-weight: 600;
    background-color: #E9E9E9;
    border: 1px solid #DCDCDC;
    color: #919191;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.surveydownpopup .surveybody .surveyscale .des_h {
    width: 60px;
    height: 42px;
    font-weight: 600;
    background-color: #f6f6f6;
    border: 1px solid #f6f6f6;
    color: #f6f6f6;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.surveydownpopup .surveybody .surveyscale .scale {
    cursor: pointer;
}

/* .surveydownpopup .surveybody .surveyscale .scale.active{fill: #57AD5C;} */
.surveydownpopup .surveybody .surveyscale .scale.active {
    filter: invert(63%) sepia(30%) saturate(669%) hue-rotate(73deg) brightness(87%) contrast(97%);
}

.surveydownpopup .footerbtn {
    background-color: #fff;
    margin-top: 10px;
    display: flex;
    justify-content: end;
}

.surveydownpopup .footerbtn a {
    background-color: #028090;
    padding: 10px 20px;
    color: #fff;
    border-radius: 30px;
    font-weight: 600;
    font-size: 16px;
}

.surveydownpopup .footerbtn button {
    background-color: #028090;
    padding: 10px 20px;
    color: #fff;
    border-radius: 30px;
    font-weight: 600;
    font-size: 16px;
    border: none;
}

.stronglybtn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

.stronglybtn p {
    background-color: #E9E9E9;
    border: 1px solid #DCDCDC;
    padding: 6px 12px;
    color: #919191;
    border-radius: 4px;
    font-weight: 600;
    font-size: 13px;
}

.stronglybtn a {
    background-color: #E9E9E9;
    border: 1px solid #DCDCDC;
    padding: 6px 12px;
    color: #919191;
    border-radius: 4px;
    font-weight: 600;
    font-size: 13px;
}

.downaerobtn {
    position: absolute;
    right: 30px;
    top: -25px;
    background-color: #fff;
}

/* Survey bottom popup */
.prbottom {
    position: fixed;
    background-color: #fff;
    bottom: 0;
    right: 0;
    transform: translateY(100%) translateX(0);
    z-index: 999;
    transition: all 0.5s ease-in-out;
}

.prbottom.active {
    transform: translateY(0%) translateX(0);
}

.prbottom .prbottom-title:hover {
    background-color: #255085;
}

.prbottom .prbottom-title {
    cursor: pointer;
    text-align: center;
    min-height: 50px;
    padding: 10px;
    background-color: #ed4266;
    color: #fff;
    transition: all 0.3s ease-in-out;
    box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
}

.item-media.cover-image {
    height: 100%;
}

.item-media {
    position: relative;
    overflow: hidden;
}

.cover-image>a:not(.btn) {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
}

.prbottom .photoswipe-link::after {
    width: 40px;
    height: 40px;
}

.post_format-post-format-video .photoswipe-link:after {
    content: '';
    transition: all 0.3s ease-in-out;
    position: absolute;
    width: 60px;
    height: 60px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
    background: url(../images/play_3.png) no-repeat center / contain;
}

/*Not Required*/
.btn {
    margin-bottom: 15px;
}

a body {
    color: #101010;
}

input[type="time"]::-webkit-calendar-picker-indicator {
    background: none;
}


/*Required*/


/*Style Created by KK Soni - 02 Apr 2021 - Start*/


/*Common*/

a {
    transition: 0.3s;
}

.clear {
    clear: both;
}

.logo {
    text-align: center;
    padding: 2px 10px 60px 10px;
    cursor: pointer;
}

.logo a {
    color: #fff;
    font-weight: 600;
    font-size: 14px;
}

.btn {
    transition: 0.3s;
}

textarea {
    border: none;
    overflow: auto;
    outline: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

input:focus,
select:focus,
textarea:focus,
button:focus {
    outline: none;
}

.spaceright {
    margin-right: 50px;
}

.btn-proutline {
    background: #D9ECEE;
    color: #028090;
    border: 1px solid #028090 !important;
}

.taskmodlistviw {
    width: 70%;
    margin: auto;
}

.taskmodlistviwscroll {
    padding-bottom: 60px;
    height: calc(100vh - 130px);
    overflow-x: hidden;
    overflow-y: auto;
    background: #E6E9F0;
}

/* width */
::-webkit-scrollbar {
    width: 0.6em;
}

/* Track */
::-webkit-scrollbar-track {
    background: #f1f1f1;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #555;
}



/*Scroll*/

/* ::-webkit-scrollbar {
    width: 0.6em;
} */

/* ::-webkit-scrollbar-button {
    background: #ddd;
} */

/* ::-webkit-scrollbar-track-piece {
    background:#F2F2F2
}

::-webkit-scrollbar-thumb {
    background: #888;
} */

.teamlist-scroll {
    height: 75vh;
    overflow-x: hidden;
    overflow-y: scroll;
}

.tasklist-scroll {
    height: 100vh;
    overflow-x: hidden;
    overflow-y: scroll;
    background: #FAFBFC;
}

.meetingrow {
    display: flex;
}

.meetingcal {
    padding: 30px 30px 30px 30px;
}

.mettinglist9 {
    width: 100%;
}

.meetingrow .calendar {
    box-shadow: 0 0px 5px 0 rgb(0 0 0 / 20%);
}

.meetingcal .meeting-overview {
    background-color: #fff;
    padding-top: 30px;
}

.teamtaskmemberddl .pr-assign-img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    margin-right: 10px;
}

.teamtaskmemberddl .user-blank {
    width: 30px;
    height: 30px;
    line-height: 30px;
    border-radius: 50%;
    margin-right: 10px;
}

.ttmember {
    display: inline-block;
    padding-top: 5px;
}

.my-dropdown.customtri {
    margin-top: 15px;
    min-width: 200px;
    z-index: 1;
}

.my-dropdown.tirddl {
    margin-top: 12px;
    min-width: 200px;
    z-index: 1;
}


.mnhight {
    height: calc(100vh - 110px);
    overflow-x: hidden;
    overflow-y: auto;
}

/* .my-dropdown {
    overflow-x: hidden!important;
} */

.bgrightside .mnhight {
    overflow-y: unset;
}


/* Side Nav Bar */

.fiexdsidenav {
    height: 100%;
    width: 110px;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: #000000;
    overflow-x: hidden;
}

.fiexdsidenav .logo {
    padding: 5px 5px 0px 5px;
    margin-bottom: 0px;
}

.fiexdsidenav .logo .inner-logo {
    height: 70px;
}

.fiexdsidenav .menu-list {
    padding-top: 0px;
}

.fiexdsidenav .menu-list a {
    padding: 18px;
    text-decoration: none;
    font-family: "Mulish", sans-serif;
    font-size: 15px;
    color: #b2b2b2;
    display: block;
    text-align: center;
    margin-bottom: 18px;
    letter-spacing: 0.7px;
    /* font-weight: 500; */
}

.fiexdsidenav .menu-list a .menu-icon {
    width: 22px;
    display: block;
    margin: 0 auto;
    transition: 0.3s;
    opacity: 0.7;
    padding-bottom: 10px;
}

.fiexdsidenav .menu-list a.active {
    color: #fff;
    /* font-weight: 600; */
    background: #1f1f1f;
}

.fiexdsidenav .menu-list a.active .menu-icon {
    width: 22px;
    opacity: 1;
}

.fiexdsidenav .menu-list a:hover {
    color: #fff;
}

.fiexdsidenav .menu-list a:hover .menu-icon {
    width: 22px;
    opacity: 1;
}

.fiexdsidenav .menu-list a i {
    display: inline-block;
    width: 100%;
    font-size: 30px;
}


/*Header*/

.header {
    background-color: #000000;
    box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, .1);
    position: fixed;
    width: calc(100% - 100px);
    z-index: 3;
    top: 0;
    height: 68px;
    margin-left: 100px;
    display: flex;
    align-items: center;
}

.header .leftside-menu ul {
    margin-bottom: 0;
}

.header .leftside-menu ul li {
    list-style-type: none;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    padding-top: 20px;
}

.header .leftside-menu ul li a {
    font-weight: 600;
    font-size: 14px;
    color: #fff;
    height: 40px;
    display: inline-block;
}

.header .leftside-menu ul li a.active {
    color: #1D4F3A;
    border-bottom: 4px solid #1D4F3A;


}

.header .rightside-menu {
    float: right;
    margin-right: 35px;
    padding: 0px 0px;
    position: relative;
    display: flex;
    align-items: center;
}

.header .rightside-menu ul {
    margin-bottom: 0;
    padding-left: 0;
}

.header .rightside-menu .profile-img {
    height: 40px;
    width: 40px;
    display: inline-block;
    border-radius: 50%;
    border: 1px solid #000000;
    overflow: hidden;
    /* margin-right: 20px; */
    margin-top: 5px;
}

.header .rightside-menu .profile-img img {
    width: 100%;
    /* height: auto !important; */
    height: 100%;
}

.accept-invataion-btn {
    margin-top: 40%;
}

.topbarProfile {
    display: inline-block;
    cursor: pointer;
    margin-top: 3px;
}

.topbarProfile .user-blank-uppr {
    width: 100%;
    height: 100%;
    text-align: center;
    line-height: 38px;
    background: #1D4F3A;
    color: white;
    font-size: 15px;
    font-weight: 600;
    display: block;
}

.topbarProfile .profleddl .userprofile {
    padding: 6px;
}

.topbarProfile .profleddl {
    min-width: 295px;
    right: -15px;
    border-radius: 20px !important;
}

.topbarProfile .profleddl .userprofile .profile-dtl {
    text-align: center;
    padding-left: 0;
    padding: 15px 0px 20px 0px;
    background-color: #FAFAFA;
    border-radius: 15px;

}

.topbarProfile .my-dropdown:before {
    content: '';
    background-color: transparent;
    border-right: 8px solid transparent;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-top: 8px solid transparent;
    top: -15px;
    right: 24px;
}

.topbarProfile .profleddl .userprofile .profile-name {
    padding-top: 5px;
    padding-bottom: 2px;
    font-weight: 600;
    font-size: 17px;
}

.topbarProfile .profleddl .userprofile .profile-mail {
    padding: 0px 5px;
    font-weight: 400;
    font-size: 12px;
    color: #838D88;
}

.topbarProfile .profleddl .userprofile .profilepic {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    /* Use flex for proper alignment */
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border: 1px solid #dbdbdb;
    -webkit-box-shadow: unset;
    box-shadow: unset;
}

.topbarProfile .profleddl .userprofile .profilepic img {
    width: 100%;
    height: 100%;
    /* object-fit: cover; Ensures image scales and fits the circle */
}

.topbarProfile .profleddl .userprofile .profilebox {
    position: relative;
    width: 70px;
    display: inline-block;
}

.topbarProfile .userprofile .profilebox .camera-file {
    position: absolute;
    top: 40px;
    right: -10px;
    z-index: 99;
}

.topbarProfile .userprofile .profilebox .camera-file img {
    width: 35px;
}

.topbarProfile .userprofile .user-blank-uppr {
    font-size: 22px;
    line-height: 66px;
}


.topbarProfile .userprofile .link-sec {
    margin-top: 10px;
    padding: 10px 10px;
}

.topbarProfile .userprofile .link-sec a {
    cursor: pointer;
    color: #808080;
}

.topbarProfile .userprofile .link-sec a:hover {
    cursor: pointer;
    color: #454242;
}

.topbarProfile .userprofile .link-sec a span {
    color: #028090;
    font-size: 12px;
    font-weight: 800;
    padding-left: 20px;
}

.topbarProfile .gift-sec {
    display: flex;
    margin-top: 20px;
}

.topbarProfile .gift-sec .gift-text {
    width: 65%;
}

.topbarProfile .gift-sec .giftpic {
    width: 35%;
    text-align: right;
}

.topbarProfile .gift-sec .giftpic .giftimg {
    max-width: unset !important;
    border-radius: unset !important;
}

.topbarProfile .gift-sec .gift-text p {
    font-size: 13px;
    line-height: 20px;
}

.topbarProfile .gift-sec .gift-text h5 {
    font-weight: 600;
    font-size: 16px;
}

.topbarProfile .link-sec p {
    padding: 8px 0;
    margin-bottom: 0;
    font-size: 14px;
}

.topbarProfile .link-sec p a img {
    margin-right: 10px;
    width: 17px;
}

.topbarProfile .link-sec p.last {
    border-bottom: 0 !important;
}

.notification.modal {
    top: 76px !important;
    bottom: unset !important;
    height: calc(100vh - 76px) !important;
}

.notification.modal.fade .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
}

.notification.modal.right.fade .modal-dialog {
    right: -472px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.notification.modal.right.fade.in .modal-dialog {
    right: 0;
}

.notification .modal-dialog {
    width: 472px !important;
    margin: 0px auto !important;
    position: absolute;
    right: 0;
    top: 0;
}

.notification .modal-content {
    border-radius: 0;
    border: none;
    box-shadow: none;
}

.notification .modal-header {
    border-bottom-color: #eeeeee;
    background-color: #fafafa;
    min-height: unset;
}

.notification .modal-header img {
    padding-top: 0px;
    width: 18px;
}

.notification .modal-header h4 {
    font-size: 16px;
}

.notification .modal-body {
    overflow-y: scroll;
    height: 80vh;
    box-shadow: none;
}

.notification .modal-body .activiti-content {
    margin-left: 60px;
    position: relative;
    font-size: 15px;
}

.notification .notilist .notiuserlist {
    display: flex;
    border-bottom: 1px solid #ddd;
    padding: 15px;
}

.notification .notilist .notiuserlist .notiuser {
    width: 15%;
}

.notification .notilist .notiuserlist .notiuser img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
}

.notification .notilist .notiuserlist .notidtl {
    width: 85%;
}

.notification .notilist .notiuserlist .notidtl p {
    font-size: 13px;
    line-height: 20px;
    font-weight: 500;
}

.notification .notilist .notiuserlist .notidtl .notidate {
    font-size: 12px;
    color: #b3b3b3;
}

.notification .notilist .notiuserlist.notibgcolor {
    background: #EBF5F6;
}

.teamsubmenu ul li {
    list-style-type: none;
    float: none !important;
    margin-right: 0px !important;
    padding: 0px 0 !important;
    margin-left: 0px;
}

.teamsubmenu .serchteam {
    min-width: 252px !important;
    margin-top: -5px;
}

.dropdown-toggle .fa-chevron-down {
    font-size: 12px !important;
}

.teamsubmenu .serchteam li {
    margin-left: 0px !important;
    margin-bottom: 10px;
    margin: 5px;
    padding: 5px 10px !important;
    border-bottom: 0px solid #EBEBEB;
}

.teamsubmenu .serchteam li a {
    height: auto !important;
    border-bottom: 1px solid #EBEBEB;
    padding-top: 0px !important;
}

.teamsubmenu:hover .fa-chevron-down {
    transform: rotate(-180deg);
}

.teamsubmenu .search-icon {
    position: absolute;
    left: 20px;
    z-index: 110;
    top: 20px;
}

/*Top Search Bar*/

.nav-searchbox {
    float: left;
    width: 386px;
    height: 36px;
    margin-top: 3px;
    margin-right: 20px;
    border: 1px solid #CDCDCC;
    border-radius: 5px;
    position: relative;
}

.nav-searchbox .ddlbtn {
    background-color: transparent;
    color: #999;
    font-size: 13px;
}

.nav-searchbox .ddlbtn:hover {
    background-color: transparent;
}

.nav-searchbox .ddlbtn:focus {
    outline: none;
}

.nav-searchbox .search-panel {
    width: 180px;
    border-right: 1px solid #CDCDCC;
    height: 35px;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.nav-searchbox .search-panel .btn-default {
    border: none;
    padding: 0px 0px 0px 15px;
}

.nav-searchbox .search-panel .search_by {
    margin-left: 10px;
    display: inline-block;
    width: 115px;
    text-align: left;
}

.nav-searchbox .search-panel .caret {
    border: 0px;
    background-image: url(../images/icons/down-arrow.png);
    background-repeat: no-repeat;
    width: 11px;
    height: 11px;
    background-position-y: -2px;
}

.nav-searchbox .searchbox {
    border: none;
    padding: 10px;
    height: 34px;
}

.nav-searchbox .searchbox:focus {
    outline: none;
}

#myModal {
    position: absolute;
    right: 65px;
    width: 420px !important;
    top: 65px;
}

#myModal .modal-dialog {
    width: 100% !important;
    margin: 0px !important;
}

#myModal .modal-header {
    padding-top: 20px;
}

#myModal .modal-content {
    box-shadow: none;
    -webkit-box-shadow: none;
    border-radius: 15px !important;
    padding: 10px 8px 10px 5px;
}

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

#myModal .searchtype {
    font-size: 16px;
    font-weight: 700;
    padding-left: 10px;
}

.modal-header .close {
    transition: 0.3s;
}

.container-search::-webkit-scrollbar {
    width: 4px;
}

/* Track */
.container-search::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.searchresults .resultitem {
    padding: 10px 0px;
    transition: 0.3s;
    display: block;
    text-align: left;
    border-bottom: solid 1px #EBEBEB;
}

.searchresults .resultitem:hover {
    background-color: #F6F6F6;
}

.searchresults .resultitem .createdby {
    color: #101010;
    font-size: 14px;
    line-height: 23px;
    margin: 0px;
}

.searchresults .resultitem .title {
    color: #101010;
    font-size: 14px;
    line-height: 23px;
    margin: 0px;
    opacity: 0.6;
}

.searchresults .resultitem .createdon {
    color: #101010;
    opacity: 0.6;
    font-size: 12px;
    line-height: 18px;
    text-align: right;
    margin: 0px;
}

.container-search {
    height: 100%;
    max-height: 500px;
    overflow-x: hidden;
    overflow-y: auto;
    width: 100% !important;
    margin-top: 15px;
}

.icon-bell {
    width: 26px;
    display: inline-block;
    margin-right: 25px;
    vertical-align: top;
    padding-top: 7px;
    margin-left: 10px;
}


/*Button*/

button[disabled],
.btn.disabled {
    opacity: 0.5 !important;
}

.btn-dark {
    color: white;
    background: #028090;
    font-weight: 500 !important;
    font-size: 14px !important;
    padding: 5px 15px !important;
}

.btn-dark:hover {
    color: white !important;
    background: #028090;
    font-weight: 500 !important;
}

.btn-dark:focus {
    color: white !important;
    background: #028090;
    font-weight: 500 !important;
    outline: none;
}

.btn-custom {
    color: #fff;
    background-color: #028090;
    border-color: #038798;
    font-size: 14px !important;
    padding: 5px 15px !important;
    line-height: 22px !important;
}

.btn-custom:hover,
.btn-custom:focus {
    color: #fff !important;
    background-color: #038798;
    border-color: #038798;
}

.cancelbtn {
    width: 20px;
}

.close {
    opacity: 0.8 !important;
    font-weight: 500 !important;
}


/*Modal Popup*/

.setting-popup .modal-dialog {
    width: 600px !important;
    margin: 60px auto !important;
}

.modal-dialog {
    width: 650px !important;
    margin: 60px auto !important;
}

.modal-header {
    border: none !important;
    padding: 0px !important;
    /* min-height: 62px; */
    border-top-left-radius: 10px !important;
    border-top-right-radius: 10px !important;
}

.modal-header.bg-header {
    background: #F6F6F6;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.modal-header img {
    width: 18px;
    padding-top: 10px;
}

.modal-body {
    border-radius: 4px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}

.setting-popup .modal-content {
    min-height: 450px !important;
}

.modal-content {
    /* min-height: 520px !important; */
    border-radius: 10px !important;
}


.member-icon {
    width: 110px;
    height: 110px;
    background-color: #c9e7eb;
    margin: 0 auto;
    border-radius: 50%;
    text-align: center;
}

.member-icon img {
    width: 40px;
}

.inputlabel {
    font-size: 15px;
    font-weight: 600;
    display: block;
    background-repeat: no-repeat;
    padding-left: 25px;
}

.inputfield {
    border: none;
    border-bottom: 1px solid #cbcbcb;
    padding: 15px 25px;
    font-size: 14px;
    display: block;
    width: 100%;
}

.inputfield:focus {
    outline: 0px;
}


/*TeamModal*/

.teammodal {
    max-width: 336px;
    margin: 40px auto;
}

.teammodal .member-icon {
    margin-bottom: 60px;
}

.teammodal .member-icon img {
    width: 55px;
    padding-top: 25px;
}

.inputlabel.teamname {
    background-image: url('../images/edit.svg');
    background-size: 15px;
    background-position: 0 2px;
}


/*TeamMemberModal*/

.teammembermodal {
    max-width: 370px;
    margin: 20px auto;
}

.teammembermodal .member-icon {
    margin-bottom: 10px;
    width: 100px;
    height: 100px;
}

.teammembermodal .member-icon img {
    width: 50px;
    padding-top: 25px;
}

.teammembermodal h3 {
    font-size: 17px;
    margin: 0px;
    padding: 0px;
    min-height: 60px;
}

.teammembermodal .input-group-addon.bgbtn {
    background: #028090;
    color: #fff;
    padding: 10px 20px;
    background-image: url('../images/icons/plus.svg');
    background-size: 22px;
    background-position: 9px 9px;
    background-repeat: no-repeat;
}

.teammembermodal .form-control {
    display: block;
    width: 100%;
    height: 45px;
    padding: 6px 15px;
    font-size: 13px;
    line-height: 18px;
    color: #707070;
    background-color: #fff;
    background-image: none;
    border: 1px solid #028090;
    border-radius: 5px;
}

.addmemberdtl .addmemberdtl-list {
    border-bottom: 1px solid #ddd;
    padding: 15px 0;
    font-weight: 500;
}

.addmemberdtl .addmemberdtl-list i {
    margin-right: 10px;
    background: #028090;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    text-align: center;
    line-height: 25px;
    color: #fff;
}

.fa-check {
    background-image: url('../images/icons/tick.svg') !important;
    background-size: 14px !important;
    background-position: 6px 8px !important;
    background-repeat: no-repeat !important;
    vertical-align: top;
}

.fa-check:before {
    content: ' ' !important;
}

.teammembermodal .addmemberdtl .addmemberdtl-list {
    position: relative;
    padding-left: 30px;
}

.teammembermodal .addmemberdtl .addmemberdtl-list i {
    position: absolute;
    top: 15px;
    left: 0px;
}


/*Form*/

.form-wrapper {
    margin-top: 0px;
}

.uni-popup .form-group {
    position: relative;
}

.uni-popup .form-label {
    font-weight: 500;
    color: #101010;
    z-index: 10;
    font-size: 15px;
    padding: 8px 10px 10px 32px;
    -webkit-transition: font-size 150ms ease-out, -webkit-transform 150ms ease-out;
    transition: font-size 150ms ease-out, -webkit-transform 150ms ease-out;
    transition: transform 150ms ease-out, font-size 150ms ease-out;
    transition: transform 150ms ease-out, font-size 150ms ease-out, -webkit-transform 150ms ease-out;
}

.uni-popup .focused .form-label {
    -webkit-transform: translateY(-125%);
    transform: translateY(-125%);
    font-size: 0.75em;
}

.uni-popup .form-input {
    position: relative;
    padding: 0px 0px 5px 35px;
    width: 100%;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 0 0 #e5e5e5;
    -webkit-transition: box-shadow 150ms ease-out;
    transition: box-shadow 150ms ease-out;
}

.uni-popup .form-input:focus {
    box-shadow: 0 2px 0 0 blue;
}

.uni-popup .form-input.filled {
    box-shadow: 0 2px 0 0 lightgreen;
}

.uni-popup .label-icon {
    position: absolute;
    left: 0;
    top: 7px;
    font-size: 20px;
}

.form .form-group {
    position: relative;
}

.form .form-group br {
    display: none;
}

.form .form-label {
    padding: 8px 10px 10px 32px;
    font-weight: 500;
    color: #707070;
    background-color: #fff;
    z-index: 10;
    -webkit-transition: font-size 150ms ease-out, -webkit-transform 150ms ease-out;
    transition: font-size 150ms ease-out, -webkit-transform 150ms ease-out;
    transition: transform 150ms ease-out, font-size 150ms ease-out;
    transition: transform 150ms ease-out, font-size 150ms ease-out, -webkit-transform 150ms ease-out;
}

.form .focused .form-label {
    -webkit-transform: translateY(-125%);
    transform: translateY(-125%);
    font-size: 0.75em;
}

.form .form-input {
    position: relative;
    padding: 0px 0px 5px 35px;
    width: 100%;
    outline: 0;
    border: 0;
    box-shadow: 0 1px 0 0 #e5e5e5;
    -webkit-transition: box-shadow 150ms ease-out;
    transition: box-shadow 150ms ease-out;
}


.form .form-input.filled {
    box-shadow: 0 2px 0 0 lightgreen;
}

.taskpriority-input {
    min-width: 50px !important;
    max-width: 70px;
    padding-left: 0px !important;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    padding-left: 25px;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    border: 0 !important;
}

.taskpriority-edit-input {
    min-width: 50px !important;
    max-width: 60px;
    padding-left: 0px !important;
    border-top: 0;
    border-left: 0;
    border-right: 0;
    padding-left: 25px;
    background: transparent;
    border-radius: 0;
    box-shadow: none;
    border: 0 !important;
}

.taskpriority .dropdown:hover .fa-chevron-down {
    transform: rotate(-180deg);
}

.fa-dwon-arrow-font {
    font-size: 12px !important;
}

.form .label-icon {
    position: absolute;
    left: 0;
    top: 7px;
    font-size: 20px;
}

.taskleftcol {
    width: 60%;
    float: left;
    padding: 30px 19px 2px 36px;
    background: #fff;
    border-radius: 10px;
}

.add-meeting-rightcol-mt {
    margin-top: 30px;
}

.taskRightcol {
    width: 40%;
    background: #F2F2F2;
    padding: 25px;
    border-radius: 4px;
}

.assign-taskddl .at-input {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    background: none;
    cursor: pointer;
    border-radius: 0;
    box-shadow: none;
    padding: 0px 12px 10px 32px;
    font-size: 13px;
    color: #5F5F5F;
}

.assign-taskddl .dropdown-menu .at-serch {
    background: #f6f7f9;
    border: none;
}


/*Projects */

.project-btn-toggle {
    top: 50%;
    transform: translateY(-50%);
}

.project-btn-toggle {
    margin: 0 7rem;
    padding: 0 !important;
    position: relative;
    border: none !important;
    height: 18px;
    width: 30px;
    border-radius: 1.5rem !important;
    color: #6b7381;
    background: #028090;
    top: 20px;
    right: 6px;
}

.project-btn-toggle:focus,
.project-btn-toggle.focus,
.project-btn-toggle:focus.active,
.project-btn-toggle.focus.active {
    outline: none;
}

.project-btn-toggle:before,
.project-btn-toggle:after {
    line-height: 1.5rem;
    width: 4rem;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    position: absolute;
    bottom: 0;
    transition: opacity 0.25s;
}

.project-btn-toggle:before {
    content: 'Active';
    left: -6rem;
    color: #333333;
    font-weight: 400;
    top: 1px;
}

.project-btn-toggle:after {
    content: 'Archived';
    right: -6rem;
    opacity: 0.5;
    color: #333333;
    font-weight: 400;
    top: 1px;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: none;
    outline-offset: -2px;
}

.project-btn-toggle.active>.inner-handle {
    background-color: #BD4053;
}

.project-btn-toggle.active>.handle:before {
    background-image: radial-gradient(circle at center, #F47280 5px, transparent 5px);
}

.project-btn-toggle>.handle {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 13px;
    height: 14px;
    border-radius: 50%;
    background: #ffffff;
    transition: left 0.25s;
    border: 1px solid #ccc;
}

.project-btn-toggle.active {
    transition: background-color 0.25s;
}

.project-btn-toggle.active>.handle {
    left: 1.4175rem;
    transition: left 0.25s;
}

.project-btn-toggle.active:before {
    opacity: 0.5;
}

.project-btn-toggle.active:after {
    opacity: 1;
    color: #333333;
}

.project-btn-toggle.active {
    background-color: #028090;
    box-shadow: none;
}

.outercontainer {
    height: calc(100vh - 110px);
    overflow-x: hidden;
    overflow-y: auto;
}

.projectcontainer {
    width: 1050px;
    margin: 0 auto;
    padding-top: 10px;
}

.projectcontainer .whitecard {
    background: #fff;
    box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.2);
    padding: 10px 15px;
    border-radius: 4px;
    margin-bottom: 30px;
    transition: 0.3s;
}

.project-cv {
    margin-top: 45px;
}

.pr-progress img {
    width: 70px;
}

.pr-header .pr-right-icon {
    text-align: right;
    margin-bottom: 5px;
    transition: 0.5s;
    opacity: 0;
    position: relative;
}

.pr-header .pr-right-icon a img {
    border-radius: 0;
    height: 16px;
    margin-left: 10px;
}

.pr-header .pr-right-icon a.edit {
    position: absolute;
    top: 0px;
    left: 0;
}

.pr-box:hover>.pr-header .pr-right-icon {
    opacity: 1;
}

.projectcontainer .CircularProgressbar .CircularProgressbar-text {
    fill: #101010;
    font-size: 20px;
    text-anchor: middle;
}

.pr-progress h4 {
    margin-top: 20px;
    font-size: 16px;
    min-height: 30px;
}

.projectcontainer hr {
    border: 0;
    border-top: 1px solid #eee;
    width: 180px;
    margin: 20px auto;
}

.pr-footer {
    width: 140px;
    margin: 0px auto;
}

.pr-footer p {
    font-size: 12px;
    margin-bottom: 15px;
    position: relative;
    padding-left: 40px;
    color: #1D1D1D;
    font-weight: 300;
}

.pr-footer p img {
    position: absolute;
    top: 4px;
    left: 0;
    border-radius: 0;
    height: 16px;
}

.modal-dialog.addupdateproject {
    width: 500px !important;
}

.modal-dialog.addupdateproject .modal-form {
    padding: 0px 30px 50px 30px;
}

.modal-dialog.addupdateproject .form-group {
    position: relative;
    margin-top: 40px;
    width: 300px;
}

.form-group:focus {
    outline: 0px;
}

.modal-dialog.addupdateproject label {
    position: relative;
    font-weight: 500;
    color: #1D1D1D;
    padding-left: 30px;
    margin-bottom: 0px;
}

.modal-dialog.addupdateproject .lebl-icon {
    width: 16px;
    position: absolute;
    top: 2px;
    left: 0;
}

.modal-dialog.addupdateproject .form-control {
    padding: 0px 0px 0px 30px;
    border: 0px;
    border-bottom: 1px solid #e5e5e5;
    box-shadow: none;
    font-weight: 500;
    height: 34px;
    font-size: 13px;
}

.modal-dialog.addupdateproject .form-group .add-inv {
    position: absolute;
    right: 0;
    bottom: 20px;
}

.modal-dialog.addupdateproject .dropdown-menu {
    position: relative;
    top: 0px;
    float: none;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.modal-dialog.addupdateproject .dropdown-menu .form-control {
    padding: 0px 10px 0px 10px;
}

.modal-dialog.actionmodel {
    width: 420px !important;
    background-color: #F8F8F8;
    height: 466px;
}

.modal-dialog.actionmodel .modal-content {
    background-color: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    border-radius: 0px;
}

.modal-dialog.actionmodel .boxcontent {
    text-align: center;
    height: 350px;
    padding: 80px;
}

.modal-dialog.actionmodel .boxcontent img {
    height: 80px;
}

.modal-dialog.actionmodel .boxcontent h5 {
    font-weight: 700;
    font-size: 18px;
    line-height: 26px;
    color: #101010;
    padding-top: 35px;
}

.modal-dialog.actionmodel .modal-footer {
    border: 0px;
    text-align: center;
}

.modal-dialog.actionmodel .modal-footer .btn {
    font-size: 18px;
    font-weight: 600;
    padding: 10px 40px;
    width: 140px;
    box-shadow: 0 0px 5px 0 rgb(0 0 0 / 20%)
}

.modal-dialog.actionmodel .modal-footer .btn:first-child {
    margin-right: 40px;
}

.modal-dialog.actionmodel .modal-footer .btn:last-child {
    margin-left: 40px;
    background-color: #fff;
}

.menu-panel.prjdetails {
    padding: 11px 40px 0px 35px;
}

.modal-dialog.addupdatemilestone {
    width: 450px !important;
}

.modal-dialog.addupdatemilestone .modal-form {
    padding: 0px 30px 50px 30px;
}

.modal-dialog.addupdatemilestone .form-group {
    position: relative;
    margin-top: 35px;
    width: 300px;
}

.modal-dialog.addupdatemilestone label {
    position: relative;
    font-weight: 500;
    color: #1D1D1D;
    padding-left: 30px;
    margin-bottom: 0px;
}

.modal-dialog.addupdatemilestone .lebl-icon {
    width: 16px;
    position: absolute;
    top: 2px;
    left: 0;
}

.modal-dialog.addupdatemilestone .form-control {
    padding: 0px 0px 0px 30px;
    border: 0px;
    border-bottom: 1px solid #e5e5e5;
    box-shadow: none;
    font-weight: 500;
    height: 34px;
    font-size: 13px;
}

.modal-dialog.addupdatemilestone .error {
    padding-top: 5px;
    display: block;
    font-size: 12px;
    height: 26px;
    color: #ff0000;
}

.modal-dialog.addupdatemilestone .form-group.delmilestone {
    margin-top: 60px;
}

.plr0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.milestones-tab.mt-30 {
    margin-top: 45px !important;
}

/* .milestones-tab .milestones-tab-list.active-tab {
    background: #fafbfc;
} */

.milestones-tab-list {
    padding: 40px 25px;
    border-bottom: 1px solid #eee;
}

.milestones-tab h5 {
    display: inline-block;
    margin: 0;
    font-weight: 500;
    font-size: 15px;
    color: #101010;
}

.projectleftsidebar {
    width: 20%;
    border-right: 1px solid #E7E7E7;
}

.projectlrightcontentbox {
    width: 80%;
    background: rgb(250, 251, 252);
    height: calc(100vh - 110px);
    overflow-x: hidden;
    overflow-y: auto;
}

.milestones-tab h6 {
    float: right;
    margin: 0;
    padding-top: 3px;
    font-size: 15px;
    font-weight: 300;
}

/* .milestone-box .mls-left {
    width: 65%;
    display: inline-block;
} */

/* .milestone-box .mls-icon {
    float: left;
    padding-top: 8px;
    opacity: 0.75;
} */

.milestone-box .mls-info {

    display: inline-block;
}

/* .milestone-box .mls-info .mls-name {
    font-weight: 400;
    font-size: 17px;
    line-height: 24px;
    padding-bottom: 8px;
} */

.milestone-box .mls-info .mls-date {
    font-size: 15px;
    font-weight: 400;
}

/* .milestone-box .mls-completed {
    width: 35%;
    display: inline-block;
    text-align: right;
    padding-top: 10px;
} */

.milestone-box .mls-completed p {
    margin: 0;
    display: inline-block;
    margin-right: 20px;
    font-size: 15px;
    font-weight: 400;
}

.milestones-detail {
    padding: 40px;
}

.milestones-detail .accordions {
    margin-top: 10px;
}

.accordion-item-project {
    background-color: #fff;
    margin-bottom: 20px;
    border: 1px solid #efefef;
    box-shadow: 0 2px 5px rgb(0 0 0 / 5%);
    border-radius: 5px;
}

.accordion-item-project .accordion-title-project {
    cursor: pointer;
    padding: 20px 15px;
    transition: all 0.4s;
    border-radius: 5px 5px 0 0;
}

.accordion-item-project .accordion-title-project .milestone-box {
    margin: 0;
    display: flex;
    font-weight: 400;
}

.accordion-item-project .accordion-title-project i.fa-chevron-down {
    transform: rotate(0);
    transition: 0.4s;
    color: #d6d6d6;
}

.accordion-item-project .accordion-title-project i.fa-chevron-down.chevron-top {
    transform: rotate(-180deg);
}

.accordion-item-project .accordion-content-project {
    display: none;
    line-height: 1.7;
    background-color: #fff;
    border-radius: 0 0 5px 5px;
}

.accordion-item-project .accordion-content-project p {
    margin: 0;
}

.accordion-item-project .accordion-title-project.active-title-project {
    display: block;
    background-color: #028090;
    color: #fff;
}

.accordion-item-project .accordion-title-project.active-title-project .mls-icon {
    filter: invert(100%);
}

.accordion-item-project .accordion-title-project .fa.fa-chevron-down {
    width: 20px;
    height: 24px;
    background-image: url('../images/icons/accdown.svg');
    background-repeat: no-repeat;
    background-size: 16px;
    background-position-y: 4px;
}

.accordion-item-project .accordion-title-project .fa.fa-chevron-down::before {
    content: '';
}

.accordion-item-project .accordion-title-project.active-title-project .fa.fa-chevron-down {
    background-image: url('../images/icons/accup.svg');
    background-position-y: 10px;
}

.accordion-item-project .panel-tasklist {
    margin-bottom: 0px !important;
    border-radius: 4px;
}

.accordion-item-project .panel-tasklist .taskBox p a {
    color: #101010;
    font-weight: 500;
    font-size: 14px !important;
}

.accordion-item-project .panel-tasklist h5 {
    color: #101010;
    font-weight: 500;
    font-size: 14px;
    background-color: #ffffff;
    padding: 5px 20px;
}


/*Model*/

.modal-dialog.createteam {
    width: 600px !important;
    height: 500px !important;
    margin: 0px auto !important;
    margin-top: 100px !important;
}

.modal-dialog.createteam .cancelbtn {
    width: 18px;
    margin-right: 0px;
}

.modal-dialog.createteam .member-icon {
    background-color: #c9e7eb;
    margin: 0 auto;
    border-radius: 50%;
    width: 110px;
    height: 110px;
    text-align: center;
    margin-bottom: 60px;
}

.modal-dialog.createteam .member-icon img {
    width: 50px;
    padding-top: 25px;
}

.modal-dialog.createteam .inputfield {
    padding: 7px 25px;
}

.modal-dialog.addteammember {
    width: 600px !important;
    height: 500px !important;
    margin: 0px auto !important;
    margin-top: 100px !important;
}

.modal-dialog.addteammember .cancelbtn {
    width: 18px;
    margin-right: 0px;
}

.modal-dialog.addteammember .teammembermodal .addmemberdtl .addmemberdtl-list i {
    position: absolute;
    top: 13px;
    left: 0px;
}

.modal-dialog.addteammember .teammembermodal .addmemberdtl .addmemberdtl-list {
    position: relative;
    padding-left: 40px;
}

.modal-dialog.addteammember .btn-dark {
    min-width: 100px;
}

.modal-dialog.addteammember .teammembermodal h3 {
    text-align: center;
    min-height: 50px;
}

.modal-dialog.teamsetting {
    width: 650px !important;
    height: 520px !important;
    margin: 0px auto !important;
    margin-top: 100px !important;
}

.modal-dialog.teamsetting .cancelbtn {
    width: 18px;
    margin-right: 0px;
}

.modal-dialog.teamsetting .btn-dark {
    min-width: 100px;
}

.modal-dialog.teamsetting .taskRightcol {
    height: calc(520px - 62px);
}

.modal-dialog.teamsetting .taskRightcol input {
    background-color: transparent;
}

.modal-dialog.viewteammember {
    width: 550px !important;
    height: 520px !important;
    margin: 0px auto !important;
    margin-top: 100px !important;
}

.modal-dialog.viewteammember .cancelbtn {
    width: 18px;
    margin-right: 0px;
}

.modal-dialog.viewteammember .btn-dark {
    min-width: 100px;
}

.modal-dialog.viewteammember .modal-body {
    width: 400px;
    margin: 0 auto;
}

.modal-dialog.viewteammember .edit-member-form .form-control {
    border-top: 0;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    padding-left: 25px;
    box-shadow: unset;
}

.modal-dialog.viewteammember .edit-member-form {
    position: relative;
}

.modal-dialog.viewteammember .edit-member-form .uf-icon {
    position: absolute;
    top: 17px;
}

.modal-dialog.viewteammember h4 {
    font-size: 16px !important;
}

.modal-dialog.viewteammember .edit-member-form {
    margin-top: 60px !important;
}

.modal-dialog.viewteammember .po-reletive .fusericon {
    position: absolute;
    top: 6px;
}

.modal-dialog.viewteammember .profile_photo {
    height: 80px;
}

.modal-dialog.viewteammember .profile_photo .circle {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 1px solid;
    margin: 0 auto;
    overflow: hidden;
}

.modal-dialog.viewteammember .profile_photo .circle img {
    width: 100%;
    max-width: unset;
    max-height: unset;
    border-radius: unset;
    border: none;
    height: unset;
}

.modal-dialog.actionbox {
    width: 400px !important;
    height: 480px !important;
    margin: 0px auto !important;
    margin-top: 100px !important;
}

.modal-dialog.actionbox .cancelbtn {
    width: 18px;
    margin-right: 0px;
}

.modal-dialog.actionbox h5 {
    padding-top: 40px;
    font-size: 18px;
    line-height: 24px;
}

.modal-dialog.actionbox .modal-content {
    min-height: unset !important;
    height: 100%;
}

.modal-dialog.actionbox .btn {
    text-transform: uppercase;
    font-size: 18px;
    padding: 20px 30px;
    min-width: 100px;
}


/*Style Created by KK Soni - 02 Apr 2021 - End*/

@media (max-width: 576px) {
    .modal-dialog.modal-dialog-slideout {
        width: 80%
    }
}

.modal-dialog-slideout {
    min-height: 100%;
    margin: 0 0 0 auto;
    background: #fff;
}

.modal.fade .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(100%, 0);
    transform: translate(100%, 0);
}

.modal.fade.show .modal-dialog.modal-dialog-slideout {
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    flex-flow: column;
}

.modal-dialog-slideout .modal-content {
    border: 0;
}


/*Public Page Style====================================================================================*/

body {
    color: #1D1D1D;
    line-height: 20px;
    word-wrap: break-word;
    font-family: "DM Sans" !important;
}

.publicpage {
    width: 100%;
}

.publicpage h3 {
    font-size: 26px;
    /* line-height: 32px; */
    padding-bottom: 18px;
}

.publicpage p {
    line-height: 24px;
    font-size: 16px;
}

.publicpage a {
    text-decoration: none !important;
    color: #1D1D1D;
}

.publicpage h1,
.publicpage h2,
.publicpage h3,
.publicpage h4,
.publicpage h5,
.publicpage h6 {
    padding: 0;
    margin: 0;
    /* line-height: 1.2; */
    /* font-family: Muli; */
}

html {
    scroll-behavior: smooth;
}

.mt-10 {
    margin-top: 10px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.mt-30 {
    margin-top: 30px;
}

.mt-40 {
    margin-top: 40px !important;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-40 {
    margin-bottom: 40px;
}

.pt-30 {
    padding-top: 30px !important
}

.pt-10 {
    padding-top: 10px;
}

.float-right {
    float: right;
}

.inline-block {
    display: inline-block;
}

.mr-15 {
    margin-right: 15px;
}

.mr10 {
    margin-right: 10px;
}

.mb-0 {
    margin-bottom: 0 !important;
}

.publicpage .innertopcontainer {
    width: 86%;
    margin: 0 auto;
}

.publicpage .innercontainer {
    width: 73.4%;
    ;
    margin: 0 auto;
}


.publicpage .modal-contact {
    padding: right 0px !important;
    ;
}


/* Navbar section */

.publicpage .navbar {
    border-radius: 0px;
    min-height: 76px;
    margin-bottom: 0px;
}

.publicpage .navbar-default {
    background-color: #fff;
    border-color: #D2D2D2;
}

.publicpage .navbar-default .navbar-nav>li>a {
    /* color:  #1B1B1B !important; */
    font-weight: 501;
    font-size: 14px;
    margin-right: 15px;
    cursor: pointer;
    font-family: "DM Sans";

}

.publicpage .navbar-default .navbar-nav>li>a.active {
    color: #227179;
}

.publicpage .ddlmenu {
    background: #227179;
    border: none;
    padding: 0;
}

.publicpage .ddlmenu>li>a {
    padding: 10px 20px;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
}

.publicpage .ddlmenu>li>a:hover {
    background-color: #3cc3a9;
    color: #fff;
}

.publicpage .ddlmenu:before {
    content: "";
    background-color: transparent;
    position: absolute;
    border: 10px solid transparent;
    border-bottom-color: #227179;
    top: -18px;
    left: 20px;
}

.publicpage .navbar-brand>img {
    display: block;
    width: 110px;
}

.publicpage .navbar-brand {
    float: left;
    height: 72px;
    padding: 10px 0px;
    font-size: 18px;
    line-height: 20px;
}

.publicpage .rightnav {
    padding: 10px 0;
    position: unset;
}

.publicpage .navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>.publicpage a:hover {
    color: #555;
    background-color: transparent;
}

.publicpage .mrl {
    margin: 8px 3px
}

.publicpage .btn-right {
    text-align: right;
    margin-right: 5rem;
}

.publicpage .img-right {
    text-align: right;
}

.me-10 {
    margin-right: 10px !important;
}

.px-2 {
    padding-left: 10px !important;
    padding-right: 10px !important;
}


.publicpage .btn-lg {
    padding: 6px 15px;
    font-size: 14px !important;
    font-weight: 500;
    border-radius: 15px !important;
}

.publicpage .top-banner-text {
    margin: unset;
    margin-left: 28%;
}

.publicpage .top-banner-text p {
    line-height: 28px;
    margin-top: 20px;
    font-size: 21px;
    color: #707070;
    padding-right: 30px;
}



.separater {
    width: 154px;
    color: #EBEBEB;
    height: 17px;
}

.publicpage .top-banner-text h1 {
    font-weight: 700;
    font-size: 68px;
    color: #1B1B1B;
}

.publicpage .vedio-img img {
    margin-top: -200px;
    padding: 0px 50px;
}


/* Home section */

.publicpage .home {
    width: 100%;
    /* height: 648px; */
    padding-top: 150px;
    /* background: #EFF1EE; */
}

.publicpage .home .input-email {
    width: 100% !important;
    margin-right: 10px;
    height: 58px !important;
    padding: 6px 12px !important;
    font-size: 14px !important;
    line-height: 1.42857143 !important;
    color: #555 !important;
    background-color: #F5F5F7 !important;
    background-image: none !important;
    border: 1px solid #ccc !important;
    border-radius: 15px !important;
    box-shadow: unset !important;
    transition: unset !important;
}

.publicpage .home .img-right img {
    /* width: 800px; */
    width: 100% !important;
}

.publicpage .cover {
    margin: 0 auto;
    background-image: url("../images/home/video-cover.png");
    background-size: cover;
    background-repeat: no-repeat;
    width: 100%;
    padding-top: 56.25%;
    margin-top: -200px;
    position: relative;
    background-position: center;
}

.publicpage .cover video {
    opacity: 0;
    width: 100%;
    height: 100%;
    transition: 1s;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
}

.publicpage .cover .playbtn {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -32px;
    margin-top: -32px;
    z-index: 994;
}

.publicpage .cover .playbtn img {
    margin: 0px;
    padding: 0px;
}

.publicpage .cover .circle1 {
    border-radius: 50%;
    background-color: deepskyblue;
    width: 100px;
    height: 100px;
    position: absolute;
    opacity: 0;
    animation: scaleIn 4s infinite cubic-bezier(.36, .11, .89, .32);
    top: 50%;
    left: 50%;
    margin-left: -50px;
    margin-top: -50px;
    z-index: 991;
}

.publicpage .cover .circle2 {
    border-radius: 50%;
    background-color: deepskyblue;
    width: 100px;
    height: 100px;
    position: absolute;
    opacity: 0;
    animation: scaleIn2 4s infinite cubic-bezier(.36, .11, .89, .32);
    top: 50%;
    left: 50%;
    margin-left: -50px;
    margin-top: -50px;
    z-index: 992;
}

.publicpage .cover .circlecenter {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -10px;
    margin-top: -10px;
    background-color: #101010;
    width: 20px;
    height: 20px;
    z-index: 993;
}

@keyframes scaleIn {
    from {
        transform: scale(.5, .5);
        opacity: .5;
    }

    to {
        transform: scale(1, 1);
        opacity: 0;
    }
}

@keyframes scaleIn2 {
    from {
        transform: scale(.5, .5);
        opacity: .5;
    }

    to {
        transform: scale(2, 2);
        opacity: 0;
    }
}

.publicpage .card-body {
    margin-bottom: 25px;
    border-radius: 3px;
    box-shadow: 0 0px 5px rgb(0 0 0 / 15%);
}

.publicpage .card-body .card-header {
    background: #EFF1EE;
    padding: 20px;
    min-height: 170px;
}

.publicpage .card-body .card-desc {
    padding: 40px 25px;
}

.publicpage .card-body .card-desc h3 {
    font-weight: 900;
    font-size: 18px;
}

.publicpage .card-body .card-desc h4 {
    font-weight: 900;
    font-size: 18px;
}

.publicpage .card-sec h3 {
    font-weight: 900;
    font-size: 32px;
}

.publicpage .card-sec p {
    line-height: 30px;
    font-size: 20px;
    margin-top: 10px;
}

.publicpage .card-body .card-desc p {
    font-size: 15px;
    line-height: 26px;
    margin-top: 10px;
}

.publicpage .card-sec {
    margin-bottom: 30px;
}

.publicpage .c1 {
    width: 180px;
}

.publicpage .c2 {
    width: 105px;
}

.publicpage .c3 {
    width: 130px;
}

.publicpage .pricing {
    background: #EFF1EE;
    padding: 60px 0px;
    margin-top: 50px;
    height: 720px;
}

.publicpage .pricing-title h1 {
    font-weight: 900;
}

.publicpage .pricing-title h4 {
    font-weight: 900;
    font-size: 36px;
}


.publicpage .pricing-title p {
    font-size: 16px;
    font-weight: 700;
    margin-top: 15px;
}

.publicpage .pricing-card-head {
    text-align: center;
}

.publicpage .pricing-card {
    background: white;
    border: 1px solid #ddd;
    margin-bottom: 25px;
    border-radius: 5px;
    padding: 30px;
}

.publicpage .pricing-card-head .btn-outline {
    color: #028090;
    border: 1px solid #028090;
    border-radius: 3px;
    font-size: 12px;
    transition: all 0.3s ease-in-out !important;
}

.publicpage .pricing-card-head .btn-outline:hover {
    background: #028090 !important;
    color: white;
}

.publicpage .pricing-card-head .btn-primary {
    background: #028090;
    color: white;
    border-radius: 3px;
    font-size: 12px;
    transition: all 0.3s ease-in-out !important;
}

.publicpage .pricing-card-head .btn-primary:hover {
    background: transparent;
    color: #028090;
    border: 1px solid #028090;
}

.publicpage .pricing-card-head h4 {
    font-weight: 800;
    color: #101010;
}

.publicpage .pricing-card-head h6 {
    font-weight: 800;
    color: #101010;
    font-size: 18px;
}

.publicpage .pr-card {
    margin-top: -460px;
}

.publicpage .pr-tag {
    margin-top: 35px;
    margin-bottom: 20px;
}

.publicpage .pr-tag .pr-icon {
    width: 15px;
    margin-top: -45px;
}

.publicpage .pr-tag .pr-amount {
    font-size: 45px;
    font-weight: 800;
    position: relative;
}

.publicpage .pr-tag .pr-amount .currency {
    position: absolute;
    font-size: 24px;
    top: 0;
    left: -16px;
}

.publicpage .for-user {
    font-size: 15px;
    margin-bottom: 20px;
}

.publicpage .pricing-dtl-list {
    margin-top: 35px;
}

.publicpage .pricing-dtl-list p {
    margin: 0 0 15px;
}

.publicpage .pricing-dtl-list p img {
    width: 18px;
    margin-right: 12px;
}

.publicpage .ml70 {
    margin-left: 70px;
}

.publicpage .mr70 {
    margin-right: 70px;
}

.publicpage .trilmsg {
    font-size: 15px;
    margin-top: 20px;
}

.publicpage .navbar-bg {
    background: #F3FAF8;
    padding: 50px 0px;
}

.publicpage .pricing-heading {
    margin-top: 12%;
}

.publicpage .pricing-heading h4 {
    color: #076E7E;
}

.publicpage .pricing-heading h1 {
    margin-top: 0;
}

.publicpage .pricing-heading p {
    margin-top: 0;
    font-size: 15px;
}

.publicpage .pricing-card-header {
    background: #F5F5F5;
    display: flex;
    padding: 20px;
}

.publicpage .pricing-card-header .pricing-card-icon {
    float: left;
    width: 125px;
}

.publicpage .pricing-card-body {
    padding: 30px;
}

.publicpage .pricing-list li {
    color: #818080;
    padding: 8px 0;
    font-size: 15px;
}

.publicpage .pricing-list {
    padding-bottom: 20px;
}

.publicpage .dargbg-header {
    background: #076E7E;
    color: #fff;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.publicpage .dargbg-body {
    background: #0E909A;
    color: #fff;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.publicpage .dargbg-body .pricing-list li {
    color: #fff;
}

.publicpage .pricing-table {
    margin-top: 50px;
}

.publicpage .acknowledgement {
    text-align: left;
    padding: 20px 20px 0px 20px;
    position: relative;
}

.publicpage .acknowledgement h4 {
    font-weight: 700;
    padding-bottom: 15px;
}

.publicpage .acknowledgement h5 {
    font-size: 26px;
}

.publicpage .acknowledgement button.close {
    position: absolute;
    right: -10px;
    top: -10px;
}


/* toggle btn */

.publicpage .btn-toggle {
    top: 50%;
    transform: translateY(-50%);
}

.publicpage .btn-toggle {
    margin: 0 4rem;
    padding: 0;
    position: relative;
    border: none;
    height: 19px;
    width: 4rem;
    border-radius: 1.5rem;
    color: #6b7381;
    background: #028090;
    top: 30px;
    right: 10px;
}

.publicpage .btn-toggle:focus,
.publicpage .btn-toggle.focus,
.publicpage .btn-toggle:focus.active,
.publicpage .btn-toggle.focus.active {
    outline: none;
}

.publicpage .btn-toggle:before,
.publicpage .btn-toggle:after {
    line-height: 1.5rem;
    width: 4rem;
    text-align: center;
    font-weight: 600;
    font-size: 17px;
    position: absolute;
    bottom: 0;
    transition: opacity 0.25s;
}

.publicpage .btn-toggle:before {
    content: 'Yearly';
    left: -7rem;
    color: #333333;
    font-weight: 600;
}

.publicpage .btn-toggle:after {
    content: 'Monthly';
    right: -5rem;
    opacity: 0.5;
    color: #333333;
    font-weight: 600;
}

.publicpage .btn.active.focus,
.publicpage .btn.active:focus,
.publicpage .btn.focus,
.publicpage .btn:active.focus,
.publicpage .btn:active:focus,
.publicpage .btn:focus {
    outline: none;
    outline-offset: -2px;
}

.publicpage .btn-toggle.active>.inner-handle {
    background-color: #BD4053;
}

.publicpage .btn-toggle.active>.handle:before {
    background-image: radial-gradient(circle at center, #F47280 5px, transparent 5px);
}

.publicpage .btn-toggle>.handle {
    position: absolute;
    top: 1px;
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
    transition: left 0.25s;
    border: 1px solid #ccc;
}

.publicpage .btn-toggle.active {
    transition: background-color 0.25s;
}

.publicpage .btn-toggle.active>.handle {
    left: 2.4175rem;
    transition: left 0.25s;
}

.publicpage .btn-toggle.active:before {
    opacity: 0.5;
}

.publicpage .btn-toggle.active:after {
    opacity: 1;
    color: #333333;
}

.publicpage .btn-toggle.active {
    background-color: #028090;
    box-shadow: none;
}


/* ================================ */


/* Features */

.publicpage .Features-row {
    margin-bottom: 100px;
}

.publicpage .Features-row:last-child {
    margin-bottom: 70px;
}

.publicpage .Features-text .Features-icon img {
    width: 40px;
}

.publicpage .Features-text .Features-icon {
    width: 15%;
}

.publicpage .Features-text .Features-title {
    margin-top: -5px;
}

.publicpage .Features-text .Features-title h2 {
    font-size: 26px;
    font-weight: 900;
    padding-top: 10px;
}

.publicpage .Features-text .Features-title h4 {
    font-size: 15px;
}

.publicpage .Features-text p {
    font-size: 16px;
    color: #101010;
    line-height: 30px;
    margin-top: 22px;
}

.publicpage .Features-heading {
    display: flex;
}

.publicpage .Features-text {
    padding: 75px 0;
}

.publicpage .pl {
    padding-left: 40px;
}

.publicpage .pr {
    padding-right: 40px;
}

.publicpage .cta-sec {
    background: #028090;
    padding: 60px 0;
    margin-top: 70px;
    color: white;
}

.publicpage .cta-sec h1 {
    font-weight: bold;
    font-size: 32px;
    color: white;
}

.publicpage .cta-sec h4 {
    font-weight: bold;
    font-size: 32px;
    color: white;
}

.publicpage .cta-sec p {
    font-size: 17px;
    opacity: .7;
}

.publicpage .btn-outline {
    background: transparent;
    box-shadow: none;
    border: 1px solid #1D1D1D;
    border-radius: 5px;
    font-weight: 600;
    text-transform: uppercase;
}

.publicpage .btn-outline.navlink {
    display: inline-block;
    padding: 6px 12px;
    margin-right: 3px !important;
}

.publicpage .btn-outline.navlink:hover {
    background: #028090 !important;
    color: #ffffff !important;
    border: 1px solid #028090;
}

.publicpage .btn-outline.navlink:hover a {
    color: #ffffff;
}

.publicpage .cta-sec .btn-outline {
    background: #fff !important;
    color: #028090;
    border-radius: 3px;
    border: 2px solid #fff;
    font-weight: 700;
    transition: all 0.3s ease-in-out !important;
    padding: 12px 35px;
}

.publicpage .cta-sec .btn-outline:hover {
    color: #fff !important;
    background: rgba(6, 95, 70, 1) !important;
    border-color: #fff !important;
}

.publicpage .btn-primary {
    background: rgba(6, 95, 70, 1);
    border-radius: 5px;
    border-color: rgba(6, 95, 70, 1);
    font-weight: bold;
    transition: all 0.3s ease-in-out !important;
}

.publicpage .btn-primary:hover {
    background: transparent;
    border: 1px solid rgba(6, 95, 70, 1);
}

.publicpage .btn-primary.navlink {
    border-radius: 15px !important;
    display: inline-block;
    padding-top: 12px;
    padding-bottom: 12px;
    /* color: #ffffff!important; */
    font-weight: 500 !important;
    margin-right: 3px !important;
    color: #ffffff !important;

}

.publicpage .btn-primary.navlink:hover {
    color: rgba(6, 95, 70, 1) !important;
}

.publicpage .btn-primary a {
    color: #ffffff;
}

.publicpage .btn-primary:hover a {
    color: rgba(6, 95, 70, 1);
}

.publicpage .wrap-btn .btn-give {
    background: #1D4F3A;
    border-radius: 15px;
    color: #fff;
    border-color: #1D4F3A;
    font-weight: bold;
    transition: all 0.3s ease-in-out !important;
    font-size: 16px !important;
    display: flex;
    align-items: center;
    padding: 0px 20px;
}

.publicpage .wrap-btn .btn-primary:active,
.btn-primary:focus {

    color: #fff !important;
}

.publicpage .wrap-btn .btn-primary:hover {
    background: transparent;
    color: rgba(6, 95, 70, 1);
    border: 1px solid rgba(6, 95, 70, 1);
}

.pq-popup .modal-header {
    padding: 15px;
    border-bottom: none;
    background: #EFF1EE;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

@media (min-width: 768px) {
    .publicpage .pq-popup .modal-dialog {
        width: 720px;
        margin: 30px auto;
    }

}

.publicpage .pq-popup .modal-title {
    font-weight: 800;
}

.publicpage .mdl-left {
    display: inline-block;
    width: 67%;
    padding-left: 5px;
    padding-right: 30px;
}

.publicpage .mdl-icon {
    display: inline;
}

.publicpage .mdl-icon img {
    width: 170px;
    margin-top: -10px;
    vertical-align: top;
}

.publicpage .pq-popup .form-group {
    margin-bottom: 15px;
}

.publicpage .ih40 {
    height: 40px;
}

.publicpage .pq-popup .modal-dialog {
    margin: 30px auto !important;
}

.publicpage .pq-popup .modal-body {
    position: relative;
    padding: 20px 30px;
}

.publicpage .contactpop {
    background-image: url('../images/home/contactpop.png');
    height: 120px;
    background-size: cover;
    background-repeat: no-repeat;
    text-align: center;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.publicpage .contactpop h4 {
    font-weight: 800;
    padding-top: 10px;
    font-size: 19px;
}

.publicpage .contactpop h6 {
    font-weight: 800;
    padding-top: 10px;
    font-size: 19px;
}

.publicpage .contactpop p {
    font-size: 14px;
    margin-top: 5px;
}

.publicpage .contact-popup .modal-dialog {
    margin: 30px auto !important;
}

.publicpage .contact-popup .modal-body {
    position: relative;
    padding: 20px 110px;
}

.publicpage .contact-popup .modal-body.ack {
    position: relative;
    padding: 20px 30px;
}

.publicpage .contact-popup .form-group {
    margin-bottom: 15px;
}

.publicpage .tabbing-sec {
    margin-top: 80px;
}

.margintop-50 {
    margin-top: 50px;
}


/* footer */

.publicpage footer {
    background: #EFF1EE;
    color: #3C3C3C;
}

.publicpage .footer-bottom {
    color: #636363;
    background: white;
    padding: 20px 20px;
    text-align: left;
    font-size: 13px;
}

.publicpage .footer-form {
    background: #f6f6f6;
    padding: 20px;
}

.publicpage .footer-form input.form-control {
    border-radius: 0px;
    height: 43px;
    border: 1px solid #9E9E9E;
}

.publicpage .menu-quick-links ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.publicpage .menu-quick-links ul li a {
    color: #3C3C3C;
    font-size: 13px;
}

.publicpage .menu-quick-links ul li a:hover {
    color: #3C3C3C;
    font-size: 13px;
}

.publicpage .social-icon img {
    width: 45px;
    margin-right: 15px;
}

.publicpage .footer-heading {
    font-size: 58px;
    font-weight: 700;
    margin-bottom: 12px;
    padding: 51px 30px 15px 30px;
}

.navigation {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: flex-start;
    align-content: flex-start;
}

.publicpage .menu-quick-links ul li {
    padding-bottom: 10px;
}

.publicpage .menu-quick-links ul li a i {
    margin-right: 10px;
    font-size: 12px;
}

.publicpage .footer-form .form-control {
    border-radius: 0px;
    border: 1px solid #9E9E9E;
}

.publicpage footer .fachat {
    background-image: url('../images/home/chat.png');
    background-repeat: no-repeat;
    padding-left: 25px;
    background-position-y: 2px;
}

.publicpage footer .fabriefcase {
    background-image: url('../images/home/briefcase.png');
    background-repeat: no-repeat;
    padding-left: 25px;
}

.publicpage footer .menu-quick-links a {
    margin-right: 5px;
}

.publicpage footer .poweredby {
    text-align: left;
}

.publicpage footer .poweredby img {
    width: 149px;
}

.publicpage .ftext-right {
    text-align: right;
}

.publicpage .rights-link {
    text-align: right;
}

.publicpage .rights-link a {
    color: #3C3C3C;
}

.publicpage .rights-link i {
    font-size: 8px;
    padding: 0px 15px;
}

.publicpage .ftext-right p {
    color: #3C3C3C;
}

.publicpage .input-group {
    width: 250px;
}

.publicpage .at-serch {
    border-radius: 0;
    height: 45px;
    background: transparent;
    color: white;
}

.publicpage .btn-flat {
    background: transparent;
    position: absolute !important;
    top: 5px;
    right: 0;
}

.publicpage .btn-flat:focus {
    outline: none !important;
}

.publicpage .btn-flat:hover {
    color: #fff !important;
}

.publicpage .leftform {
    color: #3C3C3C;
}

.publicpage .leftform p {
    font-size: 13px;
}

.publicpage .top-footer {
    padding: 40px 0;
}

.publicpage .btn-social-icon {
    line-height: 34px;
    height: 34px;
    width: 34px;
    padding: 0;
    color: #fff;
    background-color: #0A5D5A;
}

.publicpage .btn-social-icon:hover {
    color: #fff;
    background-color: #0A5D5A;
    border-color: rgba(0, 0, 0, 0.2);
}

.publicpage .notice {
    font-size: 13px;
    text-align: right;
    padding-right: 70px;
}

.publicpage .price-quote {
    padding: 20px 20px;
    border: 1px solid #028090;
    font-weight: bold;
    width: 70%;
    text-align: center;
    margin: 6% auto;
    font-size: 22px;
    border-radius: 5px;
    background-color: rgba(2, 128, 144, 0.04);
}

.publicpage .price-quote a {
    color: #028090;
}

.publicpage .radiobtn {
    display: inline-block;
    margin-right: 50px;
}


/*.publicpage [type="radio"]:checked,
.publicpage [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}*/

.publicpage .checkbox input[type=checkbox],
input[type=radio] {
    margin-left: 0px !important;
    z-index: 999;
}

.publicpage [type="radio"]:checked+label,
.publicpage [type="radio"]:not(:checked)+label {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
}


/*
.publicpage [type="radio"]:checked + label:before,
.publicpage [type="radio"]:not(:checked) + label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 18px;
    height: 18px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
.publicpage [type="radio"]:checked + label:after,
.publicpage [type="radio"]:not(:checked) + label:after {
    content: '';
    width: 10px;
    height: 10px;
    background: #028090;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.publicpage [type="radio"]:not(:checked) + label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.publicpage [type="radio"]:checked + label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}*/

.publicpage .modal-content {
    min-height: 50px !important;
}

.publicpage .faq-sec {
    padding: 70px 0;
}

.publicpage .faq {
    margin-top: 80px;
}

.publicpage .light-pattern p {
    margin-top: 0;
    font-size: 15px;
}

.publicpage .features-top {
    padding: 30px 0px;
}

.publicpage .team-sec {
    padding: 80px 0;
}

.publicpage .accordions {
    margin-top: 30px;
}

.publicpage .accordion-item .accordion-title {
    cursor: pointer;
    padding: 14px 20px;
    transition: all 0.4s;
    border-radius: 0;
}

.publicpage .accordion-item {
    background: #f9f9f9 !important;
    margin-bottom: 15px !important;
    border: none !important;
    box-shadow: unset !important;
    border-radius: 15px;
}

.publicpage .accordion-item .accordion-title.active-title {
    background-color: #F1F9F8;
    border-left: 4px solid #076E7E;
    color: #333;
}

.publicpage .accordion-title.bgset.active {
    background-color: #F1F9F8;
}

.publicpage .accordion-item .accordion-title h2 {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    display: flex;
    justify-content: space-between;
    font-weight: 700;
}

.publicpage .accordion-item .accordion-title h5 {
    margin: 0;
    font-size: 16px;
    line-height: 24px;
    display: flex;
    justify-content: space-between;
    font-weight: 700;
    align-items: center;
}

.publicpage .accordion-item .accordion-title i.fa-chevron-down {
    transform: rotate(0);
    transition: 0.4s;
    color: #d6d6d6;
}

.publicpage .accordion-item .accordion-title i.fa-chevron-down.chevron-top {
    transform: rotate(-180deg);
}

.publicpage .accordion-item .accordion-content.bgset {
    display: none;
    line-height: 1.7;
    padding: 20px;
    background-color: #F1F9F8;
    border-radius: 0 0 5px 5px;
}

.publicpage .accordion-item .accordion-content.active {
    display: block;
}

.publicpage .accordion-item .accordion-content p {
    margin: 0;
}

.publicpage .accordion-title.active {
    background-color: #fff;
}

.publicpage .accordion-item .accordion-content {
    display: none;
    line-height: 1.7;
    padding: 0px 20px 10px 20px;
    background-color: #f1f9f8;
    border-radius: 0;
    border-left: 4px solid #076E7E;
}

.publicpage .phone-right {
    text-align: right;
}

.publicpage .bgbackground {
    background-color: #F1F9F8;
}


/* login2 */

.login2 {
    width: 100%;
    height: 100vh;
}

.login-page .login-left-pnl {
    background: #EFF1EE;
    width: 45%;
    padding: 64px 90px;
    position: relative;
}

.login-page .loginimg {
    width: 370px;
    margin-top: 45px;
}

.login-page .login-left-pnl .logo {
    width: 100px;
}

.login-page .login-left-pnl h4 {
    color: #1D1D1D;
    font-size: 35px;
    margin-top: 10px;
    font-weight: 900;
}

.login-page .login-right-pnl {
    background: #fff;
    width: 55%;
    padding: 70px 120px;
}

.login-page .login-right-pnl .top-title .line1 {
    text-transform: uppercase;
    color: #028090;
    font-size: 11px;
    font-weight: 700;
}

.login-page .login-right-pnl .top-title .line2 {
    font-weight: 900;
    font-size: 26px;
    margin-top: 10px;
}

.login-page .login-right-pnl .top-title .line3 {
    margin-top: 15px;
    font-size: 13px;
}

.login-page .login-right-pnl .top-title .line3 a {
    font-weight: 600;
    color: #028090;
}

.login-page .login-right-pnl .loginform {
    margin-top: 40px;
}

.login-page .login-right-pnl .loginform .form-control {
    height: 42px;
}

.login-page .login-right-pnl .loginform .form-group {
    margin-bottom: 30px;
}

.login-page .login-right-pnl .loginform .form-group label {
    font-size: 12px;
}

.login-page .btn-primary {
    background: #028090;
    border-radius: 4px;
    color: #fff;
    border-color: #028090;
    font-weight: bold;
    transition: all 0.3s ease-in-out !important;
    box-shadow: 0px 3px 22px #0d4d8b30;
}

.login-page .btn-lg {
    padding: 10px 25px;
    font-size: 14px;
}

.login2-body {
    display: flex;
}

.login-footer-link a {
    color: #9e9e9e;
    padding: 0 7px;
}

.login-footer-link {
    text-align: center;
    padding: 15px 0;
}

.serch-fild {
    width: 235px;
}

.login-box,
.register-box {
    width: 480px;
    margin: 11% auto;
}

.login-box .login-box-body h4 {
    font-size: 22px;
    font-weight: 600;
    color: black;
}

.login-box-body {
    color: black;
}

.login-box-body form {
    padding: 20px 0;
}

.btn-green,
.btn-green:hover {
    background: #35c786;
    color: white;
    padding: 9px 25px;
}

.forgot-link {
    padding: 10px 0;
    text-align: right;
}

.forgot-link a {
    color: #737373;
    text-decoration: underline;
}

.login-msg {
    color: #737373;
    padding-bottom: 20px;
}

.publicpage .modal-header .close img {
    width: 40px;
    padding-top: 0px;
    top: 5px;
    right: 5px;
    position: absolute;
}


/*Mobile Landing*/

.mobilelanding {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #1D4F3A;
}

.mobilelanding .mcontainer {
    max-width: 350px;
    margin: 0 auto;
    text-align: center;
    color: #ffffff;
}

.mobilelanding .closebtn {
    position: absolute;
    top: 20px;
    right: 20px;
    background: none;
    border: none;
}

.mobilelanding .smlogo {
    display: block;
    text-align: center;
    margin-top: 80px;
    margin-bottom: 30px;
}

.mobilelanding .smlogo img {
    width: 150px;
}

.mobilelanding .utlogo {
    display: block;
    text-align: center;
    margin-bottom: 70px;
}

.mobilelanding p {
    font-size: 16px;
    line-height: 22px;
}

.mobilelanding p.border {
    padding-top: 20px;
    padding-bottom: 7px;
    border-bottom: 1px solid #ffffff;
    display: inline-block;
}

.mobilelanding h3 {
    font-size: 18px;
    line-height: 24px;
    font-weight: 700;
}

.publiconboardheader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: 20px;
    background-color: #fafbfc !important;
    z-index: 99;
}

.publiconboardheader .closebtn {
    position: absolute;
    top: 20px;
    right: 20px;
    background: none;
    border: none;
}

.publiconboardheader .closebtn img {
    filter: invert(29%) sepia(81%) saturate(1880%) hue-rotate(163deg) brightness(88%) contrast(98%);
}

.publiconboardheader .utlogo img {
    width: 110px;
}


/*login*/

.login-box .form-control-feedback {
    z-index: 1 !important;
}


/*Start - New Onboarding Styles - Added by 29 Apr 2020 by KK*/

.onboarding {
    width: 100%;
    height: 100%;
    position: relative;
    font-family: 'Mulish', sans-serif !important;
}

.onboarding .logo {
    width: 100px;
    text-align: left;
    padding: 0px;
}

.onboarding .logo-box {
    padding: 20px 40px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9;
}

.onboarding .login-left-pnl {
    background: #EFF1EE;
    width: 40%;
    position: relative;
    min-height: 100vh;
}

.onboarding .login-left-pnl .left-content {
    padding: 111px 40px 50px 40px;
}

.onboarding .login-left-pnl .left-content.wcline {
    padding: 111px 100px 50px 40px;
}

.onboarding .login-left-pnl .left-img .loginimg {
    width: 370px;
}

.onboarding .login-left-pnl .left-img {
    padding: 10px 40px;
}

.onboarding .login-left-pnl h4 {
    color: #1D1D1D;
    font-size: 35px;
    margin-top: 10px;
    font-weight: 900;
    max-width: 450px;
    line-height: 46px;
}

.onboarding .login-right-pnl {
    background: #fff;
    /* width: 60%; */
    padding: 0px 35.6%;
}

.onboarding .login-right-pnl .top-title {
    position: relative;
}

.onboarding .login-right-pnl .top-title.team {
    margin-top: 80px;
}

.onboarding .login-right-pnl .top-title.project {
    margin-top: 80px;
}

.onboarding .login-right-pnl .top-title .line1 {
    text-transform: uppercase;
    color: #028090;
    font-size: 11px;
    font-weight: 700;
}

.onboarding .login-right-pnl .top-title .line2 {
    font-weight: bold;
    font-size: 30.4px;
    margin-top: 10px;

}

.onboarding .login-right-pnl .top-title .line3 {
    margin-top: 10px;
    font-weight: 600;
}

.onboarding .login-right-pnl .top-title .line3 a {
    font-weight: 600;
    color: #1D4F3A;
}

.onboarding .login-right-pnl .loginform {
    margin-top: 30px;
}

.onboarding .login-right-pnl .loginform .form-control {
    height: 52px !important;
    border: 1px solid #E4E4E4;
    border-radius: 15px;
}

.onboarding .login-right-pnl .loginform .form-group {
    margin-bottom: 22px;
    position: relative;
}

.onboarding .login-right-pnl .loginform .form-group label {
    font-size: 12.8px;
    font-weight: bold;
    margin-bottom: 12px;
}

.onboarding .text-danger {
    position: absolute;
    left: 0;
    font-size: 12px;
    color: #DE5353;
}

.onboarding .sowhide-eye {
    position: absolute;
    right: 18px;
    top: 46px;
}

.onboarding .btn-primary {
    background: #1D4F3A;
    border: 1px solid #1D4F3A;
    border-radius: 40px;
    width: 100%;
    color: #fff;
    border-color: #1D4F3A;
    font-weight: 530;
}

.onboarding .btn-primary:hover {
    background: transparent;
    border: 1px solid #1D4F3A;
    color: #1D4F3A;
}

.onboarding .btn-primary:focus {
    background-color: #1D4F3A;
}

.onboarding .btn-lg {
    padding: 15px 25px;
    font-size: 18px;
}

.onboarding .login2-body {
    display: flex;
}

.onboarding .login-footer-link a {
    color: #9e9e9e;
    padding: 0 7px;
}

.onboarding .login-footer-link {
    text-align: center;
    padding: 15px 0;
}

.onboarding .serch-fild {
    width: 235px;
}

.onboarding .login-box,
.onboarding .register-box {
    width: 480px;
    margin: 11% auto;
}

.onboarding .login-box .login-box-body h4 {
    font-size: 22px;
    font-weight: 600;
    color: black;
}

.onboarding .login-box-body {
    color: black;
}

.onboarding .login-box-body form {
    padding: 20px 0;
}

.onboarding .btn-green,
.onboarding .btn-green:hover {
    background: #35c786;
    color: white;
    padding: 9px 25px;
}

.onboarding .forgot-link {
    padding: 10px 0;
    text-align: right;
}

.onboarding .forgot-link a {
    color: #737373;
    text-decoration: underline;
}

.onboarding .login-msg {
    color: #737373;
    padding-bottom: 20px;
}

.onboarding .loginform .checkbox label {
    font-size: 14px !important;
}

.onboarding .reset-top {
    margin-top: 80px;
}

.onboarding .sign-top {
    padding-top: 20px;
}

.onboarding .login-right-pnl .loginform .otp-input .form-control {
    width: 90px;
    display: inline-block;
    padding: 0px !important;
    text-align: center;
    height: 52px;
    border: none;
    /* Remove all borders */
    border-bottom: 1px solid #1D4F3A;
    /* Apply border only at the bottom */
    border-radius: 0;
    outline: none;
    /* Remove the outline */
    box-shadow: none;
    /* Remove any shadow */
}

.onboarding .pwdchange {
    position: absolute;
    min-width: 30%;
}

.onboarding .logintop {
    margin-top: 80px;
}

.onboarding .msg-card {
    background: #E5F2F4;
    color: #028090;
    padding: 15px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 13px;
    margin-bottom: 30px;
}

.onboarding .form-checkbox {
    display: block;
    /* margin-top: 20px; */
}

.onboarding .form-checkbox input {
    padding: 0;
    height: initial;
    width: initial;
    margin-bottom: 0;
    display: none;
    cursor: pointer;
}

.onboarding .form-checkbox label {
    position: relative;
    cursor: pointer;
}

.onboarding .form-checkbox label:before {
    content: "";
    -webkit-appearance: none;
    background-color: transparent;
    border: 1px solid #ccc;
    padding: 8px;
    display: inline-block;
    position: relative;
    vertical-align: sub;
    cursor: pointer;
    margin-right: 7px;
    border-radius: 5px;
}

.forp {
    color: #808080;
    font-size: 13px;
    font-weight: 540;
    margin-top: 2px;
    cursor: pointer;
}

.onboarding .form-checkbox input:checked+label:after {
    content: "";
    display: block;
    position: absolute;
    top: 3px;
    left: 7px;
    width: 5px;
    height: 10px;
    border: solid #1D4F3A;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.onboarding .closebtn {
    position: relative;
    top: 5px;
}

.onboarding .closebtn img {
    width: 22px;
}

.onboarding .login-right-pnl .photo {
    display: inline-block;
    width: 70px;
    height: 70px;
    border-radius: 50%;
    border: 1px solid #F0F0F0;
    overflow: hidden;
}

.onboarding .login-right-pnl .photo img {
    width: 100%;
    background: content-box;
    /* background-size: contain; */
    height: 100%;
}

.onboarding .login-right-pnl .Browsephoto {
    display: inline-block;
    position: relative;
    margin-left: 20px;
}

.onboarding .browsephoto-text {
    font-size: 13px;
    padding-top: 5px;
    display: block;
    color: #1D4F3A;
    font-weight: 600;
}


.onboarding .login-right-pnl .addphoto {
    font-size: 18px;
    font-weight: 700;
    position: relative;
    top: 14px;
}

.onboarding .login-right-pnl .browswbtn a {
    color: #028090;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

.onboarding .login-right-pnl .browswbtn a:hover {
    text-decoration: none;
}

.onboarding .login-right-pnl .browswbtn a img {
    width: 16px;
    margin-top: -3px;
}

.onboarding .resetlink {
    color: #808080;
    font-size: 15px;
    font-weight: 500;
}

.onboarding .resetlink a {
    color: #1D4F3A;
    cursor: pointer;
    font-weight: 600;
}

.onboarding .select-teams {
    /* padding: 20px 0px; */
}

.onboarding .select-teams .btn {
    position: relative;
}

.onboarding .select-teams span {
    padding-top: 5px;
}

.onboarding .select-teams .btn-active {
    display: flex;
    background-color: transparent;
    /* border: 1px solid #A9A9A9; */
    /* border-radius: 30px; */
    text-align: left;
    /* height: 40px; */
    color: #707070;
    font-weight: 500;
    justify-content: space-between;
    align-items: center;
}

.onboarding .select-teams .btn-outline {
    background-color: transparent;
    text-align: left;
    display: flex;
    color: #707070;
    font-weight: 500;
    border: none !important;
}

.form-control:after {
    position: absolute;
    content: "";
    top: 14px;
    right: 20px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
}

.onboarding .select-teams .btn.active,
.btn:active {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

.onboarding .select-teams .btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    -webkit-box-shadow: none !important;
    outline-offset: 0 !important;
}

.onboarding .select-teams .btn-pl {
    padding-left: 15px;
    padding-right: 15px;
}

.onboarding .select-teams .btn-pr {
    padding-left: 15px;
    padding-right: 15px;
}

.btn-pl :hover {
    background-color: #f6f6f6 !important;
    color: #1D4F3A !important;
}

.onboarding .select-teams .col-6 {
    border-bottom: 1px solid #EFEFEF;
    padding: 5px;
}

.onboarding .select-teams .row {
    border: 1px solid #E4E4E4;
    border-radius: 15px;
    padding: 0px;
}

.onboarding .select-teams .btn-active i {
    /* background: #028090;
    border-radius: 50%;
    width: 25px;
    color: #fff;
    height: 25px;
    text-align: center;
    line-height: 25px;
    font-size: 10px;
    position: absolute;
    top: 7px;
    right: 10px; */
}

.onboarding .select-teams .btn:focus,
.onboarding .select-teams .btn:hover {
    outline: none;
    color: #707070 !important;
}

.onboarding .login-left-pnl .left-img .teamsimg {
    width: 370px;
}

.onboarding .add-project .add-project-list {
    background: #E5F2F4;
    padding: 15px;
    border-radius: 4px;
    font-weight: 500;
    color: #1D4F3A;
    margin-bottom: 15px;
}

.onboarding .addprbtn img {
    position: absolute;
    top: 15px;
    right: 15px;
    width: 13px;
}

.onboarding .add-project .add-project-list .cir-close {
    float: right;
    cursor: pointer;
}

.onboarding .add-project .add-project-list .cir-close img {
    width: 20px;
}

.onboarding .projectinput {
    position: relative;
    margin-bottom: 15px;
}

.onboarding .projectinput .addprbtn {
    cursor: pointer;
}

.onboarding .add-project-box {
    padding: 0px 90px 30px 0px;
}

.onboarding .add-project {
    height: 200px;
    overflow-y: auto;
}

.onboarding .file-upload {
    display: none;
}

.onboarding .react-tel-input .form-control {
    width: 100%;
}

.onboarding .react-tel-input .flag-dropdown {
    background-color: #ffffff !important;
    border-right: none !important;
}

.onboarding .react-tel-input .selected-flag .flag {
    z-index: 9 !important;
}

.onboarding .otperror {
    height: 30px;
}


/*Start - New Onboarding Styles - Added by 29 Apr 2020 by KK*/


/*CSS Added by KK on 03 May 2021*/


/*Tasks*/

.menu-panel {
    margin-top: 68px;
    text-align: right;
    background-color: #FFFFFF;
    border-bottom: 1px solid #EBEBEB;
    height: 65px;

    padding-right: 20px;
    padding-left: 31px;
}

/* .ticon {
    width: 20px;
    height: 20px;
} */

.panel-icon {
    margin-right: 29px !important;
}

.addlinks {
    font-size: 15px;
    font-weight: 600;
    color: #028090;
    position: relative;
    display: block;
    text-align: left;
    /* padding-left: 30px; */
}

.addlinks img {
    position: relative;
    left: 0;
    width: 38px;
}

.panel-links {
    font-size: 15px;
    font-weight: 600;
    color: #808080;
    position: relative;
    display: block;
    text-align: left;

}

/* .panel-links.tasklistview {
    width: 140px;
} */

/* .panel-links.taskcalview {
    width: 140px;
} */

/* .panel-links img {
    position: absolute;
    top: 0;
    left: 0;
} */

.filter-links {
    font-size: 13px;
    color: #1D4F3A !important;
    position: relative;
    display: block;
    text-align: left;
    padding: 4px 15px;
}

.filter-links img {
    position: relative;
    left: 0px;
    width: 80%;

}

.filter-links .spanmsg {
    margin-left: 5px;
}

.notaskbox {
    text-align: center;
    max-width: 400px;
    margin: 15vh auto;
}

.setting-links {
    font-size: 13px;
    color: #1D4F3A !important;
    position: relative;
    display: block;
    text-align: left;
    padding: 4px 15px;
    border-radius: 30px;
    border: solid 1px #0a5e47;
}

.setting-links img {
    position: relative;
    left: 0px;
    width: 80%;

}

.setting-link .spanmsg {
    margin-left: 5px;
}

.notaskbox {
    text-align: center;
    max-width: 400px;
    margin: 5vh auto;
}

.notaskbox img {
    width: 80px;
}

.notaskbox p {
    font-size: 15px;
    padding-top: 15px;
    padding-bottom: 10px;
    color: #101010;
    font-weight: 500;
}

.notaskbox .button {
    border: 1px solid #1D4F3A;
    color: #1D4F3A;
    /* width: 162px; */
    height: 40px;
    cursor: pointer;
    display: inline-block;
    border-radius: 40px;
    font-size: 16px;
    /* text-transform: uppercase; */
    padding: 18px 40px 10px 40px;
    font-weight: 500;
    padding-top: 8px;

}

.add-assignee-text {
    display: block;
    margin-top: -10px;
    font-weight: 500;
}

.update-assignee-text {
    display: block;
    margin-top: 0px;
    font-weight: 500;
}


.tskcalviewCalendar {
    border-radius: 5px;
    margin: 5px 0px 15px 0px;
    background-color: #E6E9F0;
    /* padding: 15px; */
    position: relative;
}

.tskcalviewSummary {
    padding: 40px 10px 0px 20px;
}

.tskcalviewSummary .task-overview>li {
    border-bottom: 1px solid #dbdbdb;
    margin: 0;
    padding: 15px 0;
    font-weight: bold;
}

.tskcalviewSummary h4 {
    font-size: 14px !important;
}

.tskcalviewSummary li span {
    font-weight: 400;
}

.tskcalviewSummary li:last-child {
    border-bottom: none;
}

.tskcalviewTasks {
    width: 100%;
    /* margin: 30px 0px 30px 0px; */
    /* overflow-x: hidden;
    overflow-y: auto; */
    /* height: 70vh; */
    height: calc(100vh - 110px);
}

.tskcalviewNoTasks {
    background-color: #ffffff;
    border: 1px solid #dbdbdb;
    border-radius: 5px;
    padding: 15px;
    min-height: 610px;
}

.tskcalviewNoTasks .notaskbox {
    margin-top: 17vh;
}

.tskcalviewTasks .title-heading h4 {
    margin-top: 0px;
}


/*Team Tasks*/

.teamtaskswitch {
    display: inline-block;
    vertical-align: top;
    margin-top: -7px;
}

.teamtaskmemberddl {
    display: inline-block;
    vertical-align: top;
    margin-top: -5px;
}

.teamtaskmemberddl .caret {
    margin-left: 5px;
}

.cal-view-img {
    position: relative;
    left: 0px;
    width: 80%;
}


/*Tasks Popups*/
.modal {
    position: fixed;
    top: 50px !important;

}

/* .taskpopup input[type="text"],
textarea {
    outline: none;
    box-shadow: none !important;
    border: none !important;
} */

.taskpopup .modal-dialog {
    border-radius: 5px;
    /* width: 495px !important; */
    position: relative;
}

.taskpopup .modal-header {
    /* background-color: #028090; */
    /* height: 70px; */
    padding: 0px !important;
}

.taskpopup .modal-header .button {
    border: 2px solid #ffffff;
    background-color: transparent;
    color: #ffffff;
    border-radius: 3px;
    width: 110px;
    text-align: center;
    padding: 3px 5px;
}

.taskpopup .modal-header .close {
    position: absolute;
    right: -30px;
    top: -35px;
    opacity: 1;
}

.taskpopup .modal-header .close img {
    width: 32px;
}

.taskpopup .modal-header .ut-icon {
    cursor: pointer;
    display: inline-block;
    padding: 0px 10px;
}

.taskpopup .modal-header .ut-icon img {
    width: 3px;
}

.taskpopup .modal-header .dropdown-menu-right {
    top: 26px;
    right: -12px;
    left: unset;
    float: none;
}

.taskpopup .modal-header .dropdown-menu-right li {
    position: relative;
    /* padding: 10px 30px 10px 45px; */
}

.taskpopup .modal-header .dropdown-menu-right a {
    padding: 0px !important;
}

.taskpopup .modal-header .dropdown-menu-right .icon {
    position: absolute;
    top: 12px;
    left: 16px;
    width: 20px;
    padding-top: 0px;
}

.taskpopup .modal-header .dropdown-menu-right .icon.complete {
    width: 18px;
}

.taskpopup .modal-header .dropdown-menu-right .icon.delete {
    width: 14px;
    top: 8px;
}

.taskpopup .modal-header .dropdown-menu-right .icon.taskinfo {
    width: 20px;
    top: 10px;
}

.taskpopup .modal-content {
    min-height: unset !important;
    border: none !important;
    border-radius: 10px !important;
}

.taskpopup .modal-body {
    padding: 0px;
}

.taskpopup .modal-body .taskrow {
    align-items: stretch;
}

.taskpopup .taskleftcol {
    float: none;
    width: 68%;
    margin: 0 auto;
    /* padding-top: 0; */
    border-top-left-radius: 15px !important;
    border-bottom-left-radius: 15px !important;
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-right: solid 1px #E4E4E4;
}

.taskpopup .taskRightcol {
    min-height: 500px;
    /* width: 55%; */
    background: #FAFAFA;
    border-radius: 0px;
    float: none;
    margin-top: 0px;
    border-bottom-right-radius: 15px;
    border-top-right-radius: 15px;
    padding: 25px 16px 2px 19px;

}

.taskpopup .meeting-rightcol {
    min-height: 500px !important;


}

.taskpopup .form-group {
    position: relative;
    min-height: 60px;
    padding-left: 55px;
    border-bottom: 1px solid #EBEBEB;
}

.taskpopup .label-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
    height: 40px;
}

.taskpopup .form-label {
    color: #707070 !important;
    padding: 2px 0px;
    font-size: 13px;
    font-weight: 500;
    font-family: "Mulish", sans-serif !important;
}

.taskpopup .form-input {
    padding: 0px;
    box-shadow: none;
    border: none;
    outline: none;
    color: #101010;
    font-family: "DM Sans" !important;
    font-weight: 500;
    font-size: 14px;
    background-color: #ffffff !important;
}

.taskpopup .form-input:focus {
    border: none;
    outline: none;
}

.taskpopup textarea {
    border: none;
    outline: none;
    height: unset;
    overflow: visible;
}

.taskpopup textarea:focus {
    border: none;
    outline: none;
    height: unset;
    overflow: visible;
}

.taskpopup .attachments {
    padding-left: 65px;
    position: relative;
    top: -45px;
    height: 120px;
    overflow: auto;
    overflow-x: hidden;
}

.taskpopup .taskRightcol .attachments {
    padding-left: 65px;
    position: relative;
    top: -45px;
    height: 240px;
    overflow: auto;
    overflow-x: hidden;
}

.taskpopup .min-h-662px {
    min-height: 500px !important;
}


.taskpopup .taskRightcol .form-group {
    min-height: 50px;
    padding-left: 50px;
    border-bottom: 1px solid #EBEBEB;
}

/* .taskpopup .taskRightcol .label-icon {
    width: 16px;
    top: 3px
} */

.taskpopup .taskRightcol .label-icon.addassignee {
    width: 25px;
    top: 0;
    left: unset;
    right: 0;
    cursor: pointer;
}

.taskpopup .taskRightcol .form-label {
    padding-top: 0px;
    padding-bottom: 10px;
}

.taskpopup .taskRightcol .form-label .label-icon {
    position: relative;
    top: unset;
    left: unset;
    width: 8px;
    margin-left: 5px;
}

.taskpopup .form-control {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #101010;
    box-shadow: none;
    font-size: 14px;
    font-family: "DM Sans" !important;
    font-weight: 500;
}

.taskpopup .form-control:focus {
    box-shadow: none;
}

.taskpopup .form-control[disabled],
.taskpopup .form-control[readonly],
.taskpopup fieldset[disabled] .form-control {
    background-color: transparent;
}

.taskpopup .form-control.dropdown-toggle {
    cursor: pointer;
}

.taskpopup .taskRightcol input[type="date"] {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: "DM Sans" !important;
}

.taskpopup .taskRightcol .datedownarrow {
    position: relative;
    /* top: 28px; */
    left: -87px;
    width: 10px;
    /* z-index: 111; */
    cursor: pointer;
}

.taskpopup .taskleftcol .datedownarrow {
    position: relative;
    /* top: 28px; */
    left: -87px;
    width: 10px;
    /* z-index: 111; */
    cursor: pointer;
    margin-left: 5px;
}

.taskpopup .taskRightcol .dropdown select {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: "DM Sans" !important;
}

.taskpopup .taskRightcol .dropdown option {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: "DM Sans" !important;
}

.taskpopup .form-group.noborder {
    border-bottom: 0px;
}

.taskpopup .my-dropdown {
    right: -15px;
    top: 27px;
    padding: 0 !important;
    border-radius: 20px !important;
    border: solid 1px #E4E4E4 !important;
}

.taskpopup .my-dropdown>li {
    cursor: pointer;
    border-bottom: 1px solid #EBEBEB;
    display: block;
    padding: 10px 15px;
    clear: both;
    font-weight: 500;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    margin-right: 0px;
    transition: 0.3s;
}

.taskpopup .my-dropdown>li:hover {
    color: #010101 !important;
}

.taskpopup .my-dropdown::before {
    content: ' ' !important;
    background-color: transparent;
    border-right: 8px solid transparent;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-top: 8px solid transparent;
    top: -15px;
    right: 22px;
}

.taskpopup .my-dropdown .fa-circle {
    font-size: 10px;
    padding-right: 15px;
    padding-left: 10px;
}

.taskpriority .dropdown {
    display: flex;
    align-items: center;

}

.taskpriority .dropdown .fa-circle:before {
    content: "\f111";
    font-size: 8px;
}

.taskpopup .fa-circle.high {
    color: #F17568;
    padding-right: 5px;
}

.taskpopup .fa-circle.medium {
    color: #E1AE49;
    padding-right: 5px;
    margin-top: -2px;
}

.taskpopup .my-dropdown .fa-circle.high {
    color: #F17568;
}

.taskpopup .my-dropdown .fa-circle.medium {
    color: #E1AE49;
}

.taskpopup .my-dropdown .fa-circle.low {
    color: #26C56A;
}

.taskpopup .my-dropdown .fa-circle.nopriority {
    color: #CDCDCD;
}

.taskpopup .my-dropdown.priority {
    left: 40px;
    width: 147px;
    top: 19px;
}

.taskpopup .my-dropdown.priority::before {
    right: unset;
    left: 21px
}

.taskpopup .my-dropdown.status {
    right: -135px;
    width: 169px;
}

.taskpopup .my-dropdown.status::before {
    right: unset;
    left: 21px
}

.taskpopup .attch-task-file {
    border: 1px solid #EEEEEE;
    width: 233px;
    height: 65px;
    margin: 10px 10px 0px 0px;
    border-radius: 10px;
    background: #FAFAFA;
    display: inline-flex;
    align-items: center;
}

.attch-task-file .flestext {
    display: flex;
    flex-direction: row;
    padding: 4px 10px;
    align-items: center;

}

.flestext .atName {
    padding: 10px;
    color: #000;
    font-size: 13px;
    font-weight: 600;
}

.flestext .atName small {
    color: #808080;
    font-size: 12px;
    font-weight: 500;
}

.flestext .atSize {
    padding: 10px;

}

.flestext .icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    padding: 2px;
}

.taskpopup .preview-attach {
    position: absolute;
    width: 30px;
    top: 10px;
    left: 10px;
}

.taskpopup .taskassignto .serchteam {
    position: absolute;
    top: 40px;
    width: 250px;
    left: 10px;
    padding: 2px !important;
}

.taskpopup .taskassignto .teamat-serch {
    padding-left: 10px;
}

.taskpopup .taskassignto .fa.fa-search {
    color: #bdbdbd;
}

.taskpopup .taskassignto .my-dropdown>li {
    padding: 0px;
}

.taskpopup .taskassignto .user-icon {
    border: 1px solid #ddd;
    width: 30px;
    border-radius: 50%;
    margin-right: 5px;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.taskpopup .taskassignto .user-icon img {
    width: 100%;
}

.taskpopup .taskassignto .user-blank {
    border: 1px solid #ddd;
    width: 30px;
    border-radius: 50%;
    margin-right: 5px;
    line-height: 30px;
    height: 30px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.taskpopup .taskassignto .calledby .user-icon {
    margin-right: 0px;
    margin-left: -5px;
}

.taskpopup .taskassignto .assign-user {
    border-bottom: none;
}

.taskpopup .dropdown span.High {
    /* border-left: 3px solid #F17568; */
    position: absolute;
    top: 10px;
    left: 35px;
    width: 10px;
    height: 15px;
}

.taskpopup .dropdown span.Medium {
    border-left: 3px solid #E1AE49;
    position: absolute;
    top: 10px;
    left: 50px;
    width: 10px;
    height: 15px;
}

.taskpopup .dropdown span.Low {
    border-left: 3px solid #26C56A;
    position: absolute;
    top: 10px;
    left: 35px;
    width: 10px;
    height: 15px;
}

.taskpopup .dropdown span.Nopriority {
    border-left: 3px solid #CDCDCD;
    position: absolute;
    top: 10px;
    left: 35px;
    width: 10px;
    height: 15px;
}

.taskpopup .slidecontainer {
    margin: 0px;
    top: -4px;
    position: relative;
    padding-bottom: 20px;
    width: 100%;

}

.taskpopup .slidecontainer p {
    /* font-weight: 500; */
    font-size: 12px;
    color: #707070;
    margin-bottom: 5px;
    padding-bottom: 0px;

}

.taskpopup .slidecontainer .slider {
    -webkit-appearance: none;
    width: 70%;
    height: 3px;
    /* background: #d3d3d3; */
    outline: none;
    opacity: 1;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

.taskpopup .slidecontainer .slider:hover {
    opacity: 1;
}

.taskpopup .slidecontainer .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    background: #1D4F3A !important;
    cursor: pointer;
}

.taskpopup .slidecontainer .slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: #028090;
    cursor: pointer;
}

.taskpopup .slidecontainer .slidecontainer p {
    font-weight: 500;
    font-size: 15px;
}

.taskpopup .slidecontainer .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #028090;
    cursor: pointer;
}

.taskpopup .slidecontainer .slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #028090;
    cursor: pointer;
}

.taskpopup .taskRightcol .form-group.taskinfo {
    padding-left: 0px;
    border-bottom: none;
    margin-top: 30px;
}

.taskpopup .section {
    padding-top: 15px;
}

.taskpopup .taskinfo h3 {
    font-size: 16px;
    margin: 0px;
    font-weight: 700;
    padding-bottom: 5px;
}

.taskpopup .taskinfo h5 {
    margin: 0px;
    font-weight: 700;
    font-size: 14px;
    padding-bottom: 8px;
}

.taskpopup .taskinfo p {
    font-size: 13px;
    font-weight: 600;
}

.taskpopup .taskinfo .user-icon {
    border: 1px solid #ddd;
    width: 35px;
    border-radius: 50%;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.taskpopup .taskinfo .user-icon img {
    width: 100%;
}

.taskpopup .taskinfo .user-blank {
    border: 1px solid #ddd;
    width: 35px;
    border-radius: 50%;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.taskpopup .commentinput {
    position: relative;
    /* width: 90%; */
}

.taskpopup .commentinput .commbox {
    border: 1px solid #E4E4E4 !important;
    border-radius: 15px;
    font-family: "DM Sans" !important;
    padding-left: 10px;
    padding-right: 53px;
    height: 53px;
    background: #FFFFFF;
    padding-top: 10px;
    padding-bottom: 10px;
}

.taskpopup .commentinput .commbtn {
    height: 30px;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0px;
}

.taskpopup .commentinput .commbtn img {
    height: 20px;
    position: absolute;
    bottom: -6px;
    /* left: -46px; */
    right: 10px;
}

.taskpopup .nav-tabs li {
    font-size: 16px;
    padding: 5px 0px;
    margin-bottom: 20px;
    margin-right: 20px;
}

.taskpopup .nav-tabs li.active {
    font-size: 800;
}

.taskpopup .nav-tabs li a {
    padding: 0px;
}


/*Analytics*/

.noanalytics {
    text-align: center;
    max-width: 400px;
    margin: 15vh auto;
}

.noanalytics p {
    color: #028090;
    font-size: 26px;
    padding-top: 10%;
}

.zsiq_floatmain {
    display: none;
}


/*React Component CSS Overriding--###########################################################################3
/** Used to define container behavior: width, position: fixed etc... **/

/* .Toastify__toast-container {
    padding: 0px !important;
    width: auto !important;
} */


/** Used to define the position of the ToastContainer **/


/*.Toastify__toast-container--top-left {}*/

/* .Toastify__toast-container--top-center {
    top: 0px !important;
} */


/* .Toastify__toast-container--top-right {}
.Toastify__toast-container--bottom-left {}
.Toastify__toast-container--bottom-center {}
.Toastify__toast-container--bottom-right {} */


/** Classes for the displayed toast **/

/* .Toastify__toast {
    border-bottom-left-radius: 5px !important;
    border-bottom-right-radius: 5px !important;
    min-height: 50px !important;
}

.Toastify__toast--rtl {
    background-color: #a9b2c0 !important;
    color: #ffffff;
}

.Toastify__toast--dark {
    background-color: #101010 !important;
    color: #ffffff;
}

.Toastify__toast--default {
    background-color: #a9b2c0 !important;
    color: #ffffff;
}

.Toastify__toast--info {
    background-color: #028090 !important;
    color: #ffffff;
}

.Toastify__toast--success {
    background-color: #028090 !important;
    color: #ffffff;
}

.Toastify__toast--warning {
    background-color: #fbc11e !important;
    color: #ffffff;
}

.Toastify__toast--error {
    background-color: #f56b62 !important;
    color: #ffffff;
}

.Toastify__toast-body {
    padding: 0 30px;
} */


/** Classes for the close button. Better use your own closeButton **/


/* .Toastify__close-button {}
.Toastify__close-button--default {}
.Toastify__close-button > svg {}
.Toastify__close-button:hover, .Toastify__close-button:focus {} */


/** Classes for the progress bar **/


/* .Toastify__progress-bar {}
.Toastify__progress-bar--animated {}
.Toastify__progress-bar--controlled {}
.Toastify__progress-bar--rtl {}
.Toastify__progress-bar--default {}
.Toastify__progress-bar--dark {} */


/*Calendar*/

.react-calendar__navigation__arrow.react-calendar__navigation__prev2-button {
    display: none;
}

.react-calendar__navigation__arrow.react-calendar__navigation__next2-button {
    display: none;
}

.react-calendar__navigation button {
    font-size: 28px;
    line-height: 30px;
    font-weight: 500 !important;
    height: 40px;
    color: #808080;
    font-family: "DM Sans" !important;
}



.react-calendar__navigation__label__labelText {
    color: #101010;
    font-size: 15px !important;
    font-weight: 700 !important;
}

.react-calendar__month-view__weekdays {
    border-bottom: 1px solid #dbdbdb;
    margin-bottom: 10px;
}

.react-calendar__month-view__weekdays__weekday {
    color: #101010;
    text-transform: capitalize;
    font-size: 14px !important;
    font-weight: 700 !important;
    font-family: "DM Sans" !important;
}

.react-calendar {
    width: 400px;
    max-width: 100%;
    background: white;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.125em;
    position: absolute;
    z-index: 11;
    border: #E4E4E4 !important;
    border-radius: 40px;
    padding: 10px;
    margin-top: 40px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
    /* right: 217px !important; */
}

.react-calendar__tile {
    padding: 5px !important;
}

.react-calendar__tile--active {
    background: none !important;
    color: #028090;
}

.react-calendar__tile.react-calendar__month-view__days__day {
    color: #222B45;
    font-family: "DM Sans" !important;
    font-size: 14px !important;
    background: transparent;
}

.react-calendar__tile--now:enabled:hover,
.react-calendar__tile--now:enabled:focus {
    background: none !important;
}

.react-calendar__month-view__days__day--weekend {
    color: #222B45 !important;
}

.react-calendar__tile:enabled:hover,
.react-calendar__tile:enabled:focus {
    background: none !important;
}

.react-calendar__tile--active:enabled:hover,
.react-calendar__tile--active:enabled:focus {
    background: none !important;
}

.react-calendar__tile abbr {
    display: inline-block;
    font-size: 12px;
    position: relative;
    margin-top: 2px;
    margin-bottom: 2px;
    padding: 4px 8px 4px 8px !important;
}

.react-calendar__tile.react-calendar__month-view__days__day.highlight abbr {
    /* border-bottom: 3px solid #C9E7EA !important; */
    /* width: 22px; */
}

.react-calendar__tile--active.react-calendar__month-view__days__day.highlight abbr {
    /* border-bottom: 3px solid #028090 !important; */
    /* width: 22px; */
}

.react-calendar__tile--now.react-calendar__month-view__days__day.highlight abbr {
    /* border-bottom: none !important;
    width: 28px;
    height: 28px;
    line-height: 18px; */
}

.react-calendar__tile--now abbr {
    text-decoration: none !important;
    margin-top: 11px;
    margin-bottom: 10px;
    padding: 4px 8px 4px 8px !important;
    background-color: #1D4F3A;
    color: #ffffff;
    border-radius: 7px !important;
    text-align: center;
    border-bottom: none !important;
    font-size: 12px;
}

.popupdate .react-date-picker__clear-button {
    display: none;
}

.popupdate .react-date-picker__wrapper {
    border: none;
}

.popupdate .react-date-picker__inputGroup__divider {
    padding: 0px;
    display: none;
}

.popupdate select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.popupdate select::-ms-expand {
    display: none;
}

.popupdate .react-date-picker__calendar {
    margin-left: -10px;
}

.popupdate.nobotomborder {
    border: none;
}

.popupdate .react-calendar {
    width: 250px;
    border-radius: 5px;
    border-color: #dfdfdf;
}

.popupdate .react-calendar::before {
    content: ' ' !important;
    background-color: transparent;
    border-right: 8px solid transparent;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-top: 8px solid transparent;
    top: -15px;
    left: 222px;
}

.popupdate .react-calendar__month-view__weekdays__weekday {
    font-size: 11px !important;
    font-weight: 500 !important;
    font-family: "DM Sans" !important;
}

.popupdate .react-calendar__tile.react-calendar__month-view__days__day {
    color: #101010;
    font-family: "DM Sans" !important;
    font-size: 12px !important;
}

.popupdate .react-calendar__tile abbr {
    height: 20px;
    width: 20px;
    padding-top: 2px;
    display: inline-block;
}

.popupdate .react-calendar__tile--now abbr {
    background-color: #C9E7EA;
    color: #333;
}

.cal-dropdown .fa-chevron-down,
.fa-chevron-up {
    font-size: 12px !important;
}

/*  -------******** big device ********---------- */

@media screen and (min-width:1350px) and (max-width:1920px) {}

@media screen and (min-width:1025px) and (max-width:1300px) {}


/*  ----------******** End of laptop device ********-------------- */

@media screen and (min-width: 900px) and (max-width: 1024px) {
    .login-page .login-left-pnl {
        background: #EFF1EE;
        width: 45%;
        padding: 30px 50px;
        position: relative;
    }

    .login-page .login-right-pnl {
        background: #fff;
        width: 55%;
        padding: 35px 120px;
    }

    /* .publicpage .innercontainer {
        margin-left: 20px;
        margin-right: 20px;
    } */

    .publicpage .vedio-img {
        padding: 0px;
    }
}

@media screen and (min-width: 650px) and (max-width: 900px) {
    .publicpage .top-banner-text {
        margin-top: 0%;
    }

    .publicpage .top-banner-text h1 {
        font-weight: 900;
        font-size: 46px !important;
    }

    .publicpage .top-banner-text p {
        line-height: 26px;
        margin-top: 10px;
        font-size: 17px;
        padding-right: 0px;
    }

    /* .publicpage .home .img-right img {
        width: 300px;
    } */

    .publicpage .home {
        padding-top: 120px;
    }

    .publicpage .pr {
        padding-right: 0px;
    }

    .publicpage .pl {
        padding-left: 0px;
    }

    .publicpage .Features-text {
        padding: 0 0;
    }

    .publicpage .Features-text p {
        font-size: 14px;
        color: #4B4B4B;
        line-height: 22px;
        margin-top: 20px;
    }

    .publicpage .Features-text .Features-title h2 {
        font-size: 20px;
        font-weight: 900;
    }

    .publicpage .Features-text .Features-icon {
        width: 70px;
    }

    .publicpage .Features-text .Features-title {
        margin-top: 0px;
    }

    .publicpage .pr-card {
        margin-top: -140px;
    }

    .publicpage .ml70 {
        margin-left: 0px;
    }

    .publicpage .mr70 {
        margin-right: 0px;
    }

    .login-page .login-left-pnl {
        background: #EFF1EE;
        width: 45%;
        padding: 30px 20px;
        position: relative;
    }

    .login-page .loginimg {
        width: 100%;
        margin-top: 45px;
    }

    .login-page .login-right-pnl {
        background: #fff;
        width: 55%;
        padding: 35px 40px;
    }

    /* .publicpage .innercontainer {
        margin-left: 20px;
        margin-right: 20px;
    } */

    .publicpage .vedio-img {
        padding: 0px;
    }

    .publicpage .pricing {
        height: auto;
        padding-bottom: 200px;
    }

    .publicpage .pq-popup .modal-dialog {
        margin: 0 auto !important;
    }

    /*Start - New Onboarding Styles - Added by 29 Apr 2020 by KK*/
    .onboarding .login-left-pnl {
        display: none;
    }

    .onboarding .login-right-pnl {
        width: 100%;
        padding: 40px;
    }

    .onboarding .login-right-pnl .loginform {
        max-width: 400px;
    }

    .onboarding .add-project-box {
        padding: 0px 0px 30px 0px;
        max-width: 400px;
    }

    .onboarding .login-right-pnl .top-title.profile {
        margin-top: 80px;
    }

    /*End - New Onboarding Styles - Added by 29 Apr 2020 by KK*/
}


/*  ----------***** Mobile device *****--------- */

@media screen and (max-width: 650px) {
    .nav div.media_button {
        display: block;
    }

    .btntop-nav {
        position: relative;
        left: 15px;
        width: 100%;
        text-align: left;
    }

    .wrap-btn .btn-outline {
        background: transparent;
        box-shadow: none;
        border: 1px solid #fff;
        border-radius: 0;
        margin: 0px 5px;
        font-weight: 600;
        color: white;
    }

    .home .img-right img {
        width: 100%;
    }

    .top-banner-text h1 {
        /* font-weight: bold !important; */
        font-size: 45px !important;
    }

    .publicpage .home .img-right img {
        width: 505px !important;
    }

    .vedio-img img {
        margin-top: 15px;
        padding: 0px 0px;
    }

    .Features-row {
        margin-bottom: 30px;
    }

    .card-sec h3 {
        font-weight: 900;
        font-size: 25px;
    }

    .pricing-title h1 {
        font-weight: 900;
        font-size: 27px;
    }

    .img-right {
        text-align: right;
        margin-top: 50px;
    }

    .ml70 {
        margin-left: 0;
    }

    .mr70 {
        margin-right: 0;
    }

    .pr {
        padding-right: 0px;
    }

    .pl {
        padding-left: 0px;
    }

    .Features-text {
        padding: 30px 0;
    }

    .pr-card {
        margin-top: -300px;
    }

    .notice {
        font-size: 13px;
        text-align: center;
        padding-right: 0px;
    }

    .price-quote {
        padding: 20px 20px;
        border: 1px solid #028090;
        font-weight: bold;
        width: 100%;
        text-align: center;
        margin: 6% auto;
        border-radius: 5px;
        line-height: 35px;
    }

    .mrl {
        margin: 8px 15px;
    }

    .navbar-toggle {
        margin-top: 18px;
    }

    .cta-sec img {
        width: 100%;
    }

    .tabContent img {
        width: 100%;
    }

    ul.tabs li {
        float: left;
        width: 100%;
    }

    .nav div.logo {
        padding-left: 0rem;
    }

    .home {
        width: 100%;
        height: unset;
        padding-top: 18vh;
        padding-bottom: 0px;
    }

    ul.tabs li a {
        text-align: left;
    }

    .mobv img {
        width: 100%;
    }

    .light-pattern img {
        margin-top: 25px;
    }

    .Features-text .Features-icon {
        width: 20%;
    }

    .login2-body {
        display: block;
    }

    .login-page .login-left-pnl {
        background: #EFF1EE;
        width: 100%;
        padding: 40px 30px;
        position: relative;
    }

    .login-page .loginimg {
        width: 100%;
        margin-top: 45px;
    }

    .login-page .login-right-pnl {
        background: #fff;
        width: 100%;
        padding: 50px 20px;
    }

    .publicpage .home {
        height: auto;
        padding-top: 100px;
    }

    .navbar-toggle {
        margin-right: 0px !important;
        margin-top: 20px !important;
    }

    .publicpage .btn-outline.navlink {
        margin-left: 15px;
        width: 120px;
    }

    .publicpage .btn-primary.navlink {
        margin-left: 15px;
        width: 120px;
        font-size: 13px !important;
        padding: 6px 20px !important;
        border-radius: 10px !important;
    }

    .nav>li {
        display: inline !important;
    }

    .publicpage .mdl-left {
        display: block;
        width: 100%;
        padding-right: 30px;
    }

    .publicpage .pq-popup .modal-dialog {
        margin: 0px !important;
        border: none;
        border-radius: none;
        width: 100%;
        height: 100%;
    }

    .publicpage .contact-popup .modal-dialog {
        margin: 0px !important;
        border: none;
        border-radius: none;
        width: 100%;
        height: 100%;
    }

    .publiconboardheader .utlogo img {
        width: 100px;
    }

    .publiconboardheader .closebtn {
        right: 10px;
    }

    .publiconboardheader .closebtn img {
        width: 16px;
    }

    .login-box {
        margin-top: 65px !important;
    }

    .publicpage footer .poweredby {
        text-align: left;
        padding-top: 15px;
    }

    /*Start - New Onboarding Styles - Added by 29 Apr 2020 by KK*/
    .onboarding .login-left-pnl {
        display: none;
    }

    .onboarding .login-right-pnl {
        width: 100%;
        padding: 40px;
    }

    .onboarding .login-right-pnl .loginform {
        max-width: 400px;
    }

    .onboarding .add-project-box {
        padding: 0px 0px 30px 0px;
        max-width: 400px;
    }

    .onboarding .login-right-pnl .top-title.profile {
        margin-top: 80px;
    }

    /*End - New Onboarding Styles - Added by 29 Apr 2020 by KK*/
}


/*  ---------***** End of Mobile device *****--------*/

@media screen and (min-width: 451px) and (max-width: 650px) {
    .publicpage .home {
        height: auto;
    }

    .publicpage .vedio-img {
        padding: 0px;
    }

    .publicpage .cover {
        width: 100%;
        height: 56.65vw;
        margin: 0 auto;
        margin-top: 50px;
        padding: 0px;
        margin-bottom: 40px;
    }

    .publicpage .team-sec {
        padding: 00px 0;
    }

    .publicpage .pr {
        padding: 40px 0px;
    }

    .publicpage .pl {
        padding: 40px 0px;
    }

    .publicpage .Features-row {
        margin-bottom: 30px;
    }

    .publicpage .card-sec {
        margin-bottom: 30px;
        margin-top: 50px;
    }

    .publicpage .ml70 {
        margin-left: 0px;
    }

    .publicpage .mr70 {
        margin-right: 0px;
    }

    .publicpage .notice {
        text-align: center;
        padding-right: 0px;
    }

    /* 
    .publicpage .innercontainer {
        margin-left: 20px;
        margin-right: 20px;
    } */

    .menu-quick-links {
        margin-bottom: 20px;
    }

    .publicpage .price-quote {
        width: auto;
    }

    .publicpage .mdl-icon {
        display: none;
    }

    .publicpage .home .img-right img {
        width: 100%;
        max-width: 420px;
    }

    .publicpage .modal-dialog {
        width: auto !important;
    }

    .publicpage .contactpop {
        height: 140px;
    }

    .publicpage .contact-popup .modal-body {
        padding: 20px;
    }
}

@media screen and (max-width: 450px) {
    .tab-sec .btn-save {
        padding: 6px 20px !important;
        border-radius: 15px !important;
        font-size: 12px !important;
        font-weight: 400 !important;
    }

    .publicpage .tab-sec .btn-team-header {
        padding: 6px 20px !important;
        border-radius: 15px !important;
        font-size: 12px !important;
        font-weight: 400 !important;
    }

    .publicpage .tab-sec .btn-team-header-active {
        padding: 6px 20px !important;
        border-radius: 15px !important;
        font-size: 12px !important;
        font-weight: 400 !important;
    }

    .productivity-partner-box .h4 {
        font-size: 24px !important;
        line-height: 24px !important;
    }

    .productivity-partner-box p {
        font-size: 16px !important;
        line-height: 24px !important;
        margin-top: 10px !important;
    }

    .productivity-partner-box .h4 {
        font-size: 24px !important;
        line-height: 10px !important;
        margin-bottom: 20px !important;
    }

    .publicpage .home {
        height: auto;
    }

    .publicpage .vedio-img {
        padding: 0px;
    }

    .publicpage .cover {
        width: 100%;
        height: 56.65vw;
        margin: 0 auto;
        margin-top: 50px;
        padding: 0px;
        margin-bottom: 40px;
    }

    .publicpage .team-sec {
        padding: 00px 0;
    }

    .publicpage .pr {
        padding: 40px 0px;
    }

    .publicpage .pl {
        padding: 40px 0px;
    }

    .publicpage .Features-row {
        margin-bottom: 30px;
    }

    .publicpage .card-sec {
        margin-bottom: 30px;
        margin-top: 50px;
    }

    .publicpage .ml70 {
        margin-left: 0px;
    }

    .publicpage .mr70 {
        margin-right: 0px;
    }

    .publicpage .notice {
        text-align: center;
        padding-right: 0px;
    }

    /* .publicpage .innercontainer {
        margin-left: 20px;
        margin-right: 20px;
    } */

    .menu-quick-links {
        margin-bottom: 20px;
    }

    .publicpage .price-quote {
        width: auto;
    }

    .publicpage .mdl-icon {
        display: none;
    }

    .publicpage .home .img-right img {
        width: 100% !important;
        max-width: 420px !important;
    }

    .publicpage .modal-dialog {
        width: auto !important;
    }

    .publicpage .contactpop {
        height: 180px;
    }

    .publicpage .contact-popup .modal-body {
        padding: 20px;
    }
}

.membersscroll {
    max-height: 400px;
    overflow-x: hidden;
    overflow-y: scroll;
}


/* Meeting */

.rightside-panel {
    padding: 20px 70px;
}

.meeting-header {
    display: flex;
    border-bottom: 1px solid #707070;
    padding-top: 15px;
    padding-bottom: 12px;
    margin-bottom: 40px;
}

.meeting-header .meeting-title {
    width: 50%;
}

.meeting-header .meeting-detail {
    width: 50%;
    padding-top: 8px;
    text-align: right;
}

.meeting-header .meeting-detail .meeting-time {
    margin-right: 20px;
}

.meeting-header .meeting-detail .mttag {
    border: 1px solid black;
    margin: 0px 10px;
}

.mtsubTitle {
    margin-bottom: 40px;
}

.mtsubTitle h5 img {
    width: 40px;
    margin-right: 15px;
}

.mtsubTitle h5 {
    font-size: 16px;
}



.user-blank.red {
    background: #F17568;
}

/* .InviteesList {
    width: 60%;
    height: 255px;
    overflow-x: hidden;
    overflow-y: scroll;
    padding-left: 55px;
    padding-right: 15px;
} */
.objinvtiname {
    display: inline-block;
    padding-top: 5px;
    font-weight: 500;
}

.Invit-flex {
    display: flex;
    border-bottom: 1px solid #A6A7A7;
    padding: 15px 0;
}

.right-b {
    padding-top: 7px;
    width: 20%;
    text-align: right;
    color: #9C9C9C;
}

.Invit-info {
    width: 80%;
}

.mtsubTitle .mtb0 {
    margin: 0px;
}

.taslist {
    margin-top: -20px;
    padding-left: 55px;
}

.mtsubTitle .btn-primery {
    background: #028090;
    color: white;
    font-weight: 600;
}

.att-list {
    padding-left: 55px;
    padding-top: 20px;
}

.att-list img {
    margin-right: 12px;
}

.mttag-fill {
    background: #028090;
    color: white;
    margin: 0px 10px;
}

.mttag-fill:hover {
    background: #028090;
    color: white;
    margin: 0px 10px;
}

.JoinBtn,
.JoinBtn:hover {
    background: #028090;
    color: white;
    margin-left: 35px;
}

.meetingid {
    padding-left: 55px;
    margin-top: 20px;
}

.meetingid .meetingpwd {
    padding-left: 50px;
}

.meeting-overview ul {
    list-style-type: none;
    padding: 0px 10px;
}

.meeting-overview ul li {
    padding: 12px 10px;
    border-top: 1px solid #BEBEBE;
}

.meeting-overview ul li span {
    padding-left: 15px;
}

/*Meeting Popups*/
.meetingpopup input[type="text"],
textarea {
    outline: none;
    box-shadow: none !important;
    border: none !important;
}

.meetingpopup .modal-dialog {
    border-radius: 5px;
    width: 750px !important;
    position: relative;
    margin: 60px auto !important;
}

.meetingpopup .modal-header {
    background-color: #028090;
    height: 70px;
    padding: 18px 30px 0px 30px !important;
}

.meetingpopup .modal-header .button {
    border: 2px solid #ffffff;
    background-color: transparent;
    color: #ffffff;
    border-radius: 3px;
    width: 130px;
    text-align: center;
    padding: 3px 5px;
}

.meetingpopup .modal-header .close {
    position: absolute;
    right: -30px;
    top: -35px;
    opacity: 1;
}

.meetingpopup .modal-header .close img {
    width: 32px;
}

.meetingpopup .modal-header .ut-icon {
    cursor: pointer;
    display: inline-block;
    padding: 0px 10px;
}

.meetingpopup .modal-header .ut-icon img {
    width: 3px;
}

.meetingpopup .modal-header .dropdown-menu-right {
    top: 40px;
    right: -12px;
    left: unset;
    float: none;
}

.meetingpopup .modal-header .dropdown-menu-right li {
    position: relative;
    padding: 10px 30px 10px 45px;
}

.meetingpopup .modal-header .dropdown-menu-right a {
    padding: 0px !important;
}

.meetingpopup .modal-header .dropdown-menu-right .icon {
    position: absolute;
    top: 12px;
    left: 16px;
    width: 20px;
    padding-top: 0px;
}

.meetingpopup .modal-header .dropdown-menu-right .icon.complete {
    width: 18px;
}

.meetingpopup .modal-header .dropdown-menu-right .icon.delete {
    width: 24px;
    left: 13px;
    top: 8px;
}

.meetingpopup .modal-content {
    min-height: unset !important;
    border: none !important;
}

.meetingpopup .modal-body {
    padding: 0px;
}

.meetingpopup .modal-body .taskrow {
    align-items: stretch;
}

.meetingpopup .taskleftcol {
    float: none;
    width: 60%;
    padding: 25px;
}

.meetingpopup .taskRightcol {
    width: 40%;
    background: #F2F2F2;
    padding: 25px;
    border-radius: 0px;
    float: none;
}

.meetingpopup .form-group {
    position: relative;
    min-height: 50px;
    padding-left: 55px;
    border-bottom: 1px solid #dbdbdb;
}

.meetingpopup .label-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
}

.meetingpopup .form-label {
    padding: 5px 0px;
    font-size: 14px;
    font-weight: 700;
    font-family: "DM Sans" !important;
}

.meetingpopup .form-input {
    padding: 0px;
    box-shadow: none;
    border: none;
    outline: none;
    color: #808080;
    font-family: "DM Sans" !important;
    font-weight: 500;
}

.meetingpopup .form-input:focus {
    border: none;
    outline: none;
}

.meetingpopup textarea {
    border: none;
    outline: none;
    height: 30px;
}

.meetingpopup textarea:focus {
    border: none;
    outline: none;
    height: 30px;
}

.meetingpopup .attachments {
    min-height: 100px;
}

.meetingpopup .taskRightcol .form-group {
    min-height: 50px;
    padding-left: 25px;
    border-bottom: 1px solid #dbdbdb;
}

.meetingpopup .taskRightcol .label-icon {
    width: 16px;
    top: 3px
}

.meetingpopup .taskRightcol .label-icon.addassignee {
    width: 25px;
    top: 0;
    left: unset;
    right: 0;
    cursor: pointer;
}

.meetingpopup .taskRightcol .form-label {
    padding-top: 0px;
    padding-bottom: 10px;
}

.meetingpopup .taskRightcol .form-label .label-icon {
    position: relative;
    top: unset;
    left: unset;
    width: 8px;
    margin-left: 5px;
}

.meetingpopup .form-control {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 13px;
    font-family: "DM Sans" !important;
    font-weight: 500;
}

.meetingpopup .form-control:focus {
    box-shadow: none;
}

.meetingpopup .form-control[disabled],
.meetingpopup .form-control[readonly],
.meetingpopup fieldset[disabled] .form-control {
    background-color: transparent;
}

.meetingpopup .form-control.dropdown-toggle {
    cursor: pointer;
}

.meetingpopup .taskRightcol input[type="date"] {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: "DM Sans" !important;
}

.meetingpopup .taskRightcol .datedownarrow {
    position: absolute;
    top: 49px;
    right: 0;
    width: 10px;
    cursor: pointer;
}

.meetingpopup .taskRightcol .dropdown select {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: "DM Sans" !important;
}

.meetingpopup .taskRightcol .dropdown option {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: "DM Sans" !important;
}

.meetingpopup .form-group.noborder {
    border-bottom: 0px;
}

.meetingpopup .my-dropdown {
    border: none !important;
    padding: 0 !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .175) !important;
    overflow-x: visible !important;
}

.meetingpopup .my-dropdown>li {
    cursor: pointer;
    border-bottom: 1px solid #eee;
    display: block;
    padding: 10px 15px;
    clear: both;
    font-weight: 500;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    margin-right: 0px;
    transition: 0.3s;
}

.meetingpopup .my-dropdown>li:hover {
    background-color: #f5f5f5;
}

.meetingpopup .my-dropdown::before {
    content: ' ' !important;
    background-color: transparent;
    border-right: 8px solid transparent;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-top: 8px solid transparent;
    top: -15px;
    right: 15px;
}

.meetingpopup .my-dropdown .fa-circle {
    font-size: 10px;
    padding-right: 15px;
    padding-left: 10px;
}

.meetingpopup .my-dropdown .fa-circle.high {
    color: #F17568;
}

.meetingpopup .my-dropdown .fa-circle.medium {
    color: #E1AE49;
}

.meetingpopup .my-dropdown .fa-circle.low {
    color: #26C56A;
}

.meetingpopup .my-dropdown .fa-circle.nopriority {
    color: #CDCDCD;
}

.meetingpopup .my-dropdown.priority {
    right: -135px;
    width: 169px;
}

.meetingpopup .my-dropdown.priority::before {
    right: unset;
    left: 21px
}

.meetingpopup .my-dropdown.status {
    right: -135px;
    width: 169px;
}

.meetingpopup .my-dropdown.status::before {
    right: unset;
    left: 21px
}

.meetingpopup .attch-file {
    border: 1px solid #707070;
    width: 90px;
    height: 91px;
    margin: 10px 20px 0px 0px;
}

.meetingpopup .preview-attach {
    position: absolute;
    width: 30px;
    top: 10px;
    left: 10px;
}

.meetingpopup .taskassignto .serchteam {
    position: absolute;
    top: 40px;
    width: 250px;
    left: 10px;
    padding: 2px !important;
}

.meetingpopup .taskassignto .teamat-serch {
    padding-left: 10px;
}

.meetingpopup .taskassignto .fa.fa-search {
    color: #bdbdbd;
}

.meetingpopup .taskassignto .my-dropdown>li {
    padding: 0px;
}

.meetingpopup .taskassignto .user-icon {
    border: 1px solid #ddd;
    width: 35px;
    border-radius: 50%;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.meetingpopup .taskassignto .user-icon img {
    width: 100%;
}

.meetingpopup .taskassignto .user-blank {
    border: 1px solid #ddd;
    width: 35px;
    border-radius: 50%;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.meetingpopup .taskassignto .calledby .user-icon {
    margin-right: 0px;
    margin-left: -5px;
}

.meetingpopup .taskassignto .assign-user {
    border-bottom: none;
}

.meetingpopup .dropdown span.High {
    border-left: 3px solid #F17568;
    position: absolute;
    top: 10px;
    left: 35px;
    width: 10px;
    height: 15px;
}

.meetingpopup .dropdown span.Medium {
    border-left: 3px solid #E1AE49;
    position: absolute;
    top: 10px;
    left: 50px;
    width: 10px;
    height: 15px;
}

.meetingpopup .dropdown span.Low {
    border-left: 3px solid #26C56A;
    position: absolute;
    top: 10px;
    left: 35px;
    width: 10px;
    height: 15px;
}

.meetingpopup .dropdown span.Nopriority {
    border-left: 3px solid #CDCDCD;
    position: absolute;
    top: 10px;
    left: 35px;
    width: 10px;
    height: 15px;
}

.meetingpopup .slidecontainer {
    margin: 0px;
    padding-bottom: 20px;
    width: 100%;
}

.meetingpopup .slidecontainer p {
    font-weight: 700;
    font-size: 14px;
    color: #101010;
    padding-bottom: 10px;
}

.meetingpopup .slidecontainer .slider {
    -webkit-appearance: none;
    width: 100%;
    height: 5px;
    background: #d3d3d3;
    outline: none;
    opacity: 1;
    -webkit-transition: .2s;
    transition: opacity .2s;
}

.meetingpopup .slidecontainer .slider:hover {
    opacity: 1;
}

.meetingpopup .slidecontainer .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    background: #028090;
    cursor: pointer;
}

.meetingpopup .slidecontainer .slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    background: #028090;
    cursor: pointer;
}

.meetingpopup .slidecontainer .slidecontainer p {
    font-weight: 500;
    font-size: 15px;
}

.meetingpopup .slidecontainer .slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 50%;
    background: #028090;
    cursor: pointer;
}

.meetingpopup .slidecontainer .slider::-moz-range-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: #028090;
    cursor: pointer;
}

.meetingpopup .taskRightcol .form-group.taskinfo {
    padding-left: 0px;
    border-bottom: none;
}

.meetingpopup .section {
    padding-top: 10px;
}

.meetingpopup .taskinfo h3 {
    font-size: 18px;
    font-weight: 800;
    margin: 0px;
    font-weight: 700;
    padding-bottom: 5px;
}

.meetingpopup .taskinfo h5 {
    margin: 0px;
    font-weight: 700;
    font-size: 14px;
    padding-bottom: 5px;
}

.meetingpopup .taskinfo p {
    font-size: 13px;
    font-weight: 600;
}

.meetingpopup .taskinfo .user-icon {
    border: 1px solid #ddd;
    width: 35px;
    border-radius: 50%;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.meetingpopup .taskinfo .user-icon img {
    width: 100%;
}

.meetingpopup .taskinfo .user-blank {
    border: 1px solid #ddd;
    width: 35px;
    border-radius: 50%;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    display: inline-block;
    vertical-align: middle;
}

.meetingpopup .commentinput {
    position: relative;
    width: 90%;
}

.meetingpopup .commentinput .commbox {
    border: 1px solid #dbdbdb !important;
    border-radius: 5px;
    font-family: 'Mulish', sans-serif !important;
    padding-left: 20px;
    height: 40px;
}

.meetingpopup .commentinput .commbtn {
    height: 40px;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0px;
}

.meetingpopup .commentinput .commbtn img {
    height: 40px;
}

.meetingpopup .nav-tabs li {
    font-size: 16px;
    padding: 5px 10px;
    margin-bottom: 20px;
}

.meetingpopup .nav-tabs li.active {
    font-size: 800;
}

.meetingpopup .nav-tabs li a {
    padding: 0px;
}

.newpopup .uni-popup .taskleftcol .form-label {
    top: 10px !important;
    background-color: transparent !important;
}

.newpopup .uni-popup .taskleftcol .form-label {
    left: 60px;
    font-weight: 600;
}

.newpopup .uni-popup .taskleftcol .form-input {
    padding: 12px 0px 15px 60px;
    color: #808080;
}

.newpopup .uni-popup .form-group+.form-group {
    margin-top: 30px;
}

.dropdown-menu.asstolist {
    min-width: 255px;
}

.roundcheckbox {
    position: relative;
    width: 10%;
}

.assto-detais {
    display: flex;
}

.roundcheckbox label {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 50%;
    cursor: pointer;
    height: 24px;
    left: 0;
    position: absolute;
    top: 0;
    width: 24px;
}

.lblcheck {
    float: right;
    padding-top: 5px;
}

.roundcheckbox label:after {
    border: 2px solid #fff;
    border-top: none;
    border-right: none;
    content: "";
    height: 6px;
    left: 5px;
    opacity: 0;
    position: absolute;
    top: 6px;
    transform: rotate(-45deg);
    width: 12px;
}

.roundcheckbox input[type="checkbox"] {
    visibility: hidden;
}

.roundcheckbox input[type="checkbox"]:checked+label {
    background-color: #028090;
    border-color: #028090;
}

.roundcheckbox input[type="checkbox"]:checked+label:after {
    opacity: 1;
}

.assto-info {
    width: 85%;
    float: left;
}


/* Invitees component */

.Inviteesddl {
    position: relative;
    /* height: 145px; */
}

.Inviteesddl .Invitees-serch {
    width: 100%;
    padding: 10px 10px !important;
    border-radius: 12px;
    background: #fff !important;
    margin-bottom: 6px;
    border: solid 1px #E4E4E4 !important;
}

.Inviteesddl .inputBtn {
    position: absolute;
    right: 15px;
    top: 14px !important;
    display: block !important;
}

.Create-Team .Inviteesddl .inputBtn {
    position: absolute;
    right: 15px;
    top: 14px !important;
    display: block !important;
    padding-top: 5px;
}

.meetInvitees {
    background: #FFFFFF;
    padding: 0px;
    /* position: fixed; */
    margin-top: 3px;
    max-height: 140px;
    overflow-y: scroll;
    overflow-x: hidden;
    border-radius: 10px;
    border: solid 1px #E4E4E4;
}

.meetInvitees::-webkit-scrollbar {
    width: 4px;
}



.MuiInputBase-input {
    font: inherit;
    letter-spacing: inherit;
    color: currentColor;
    padding: 4px 0 5px;
    border: 0;
    box-sizing: content-box;
    background: none;
    height: 1.4375em;
    margin: 0;
    -webkit-tap-highlight-color: transparent;
    display: block;
    min-width: 0;
    width: 100%;
    -webkit-animation-name: mui-auto-fill-cancel;
    animation-name: mui-auto-fill-cancel;
    -webkit-animation-duration: 10ms;
    animation-duration: 10ms;
    padding: 0px !important;
    padding-right: 0;
    font-size: 14px !important;
}

.css-1ll44ll-MuiOutlinedInput-notchedOutline {
    text-align: left;
    position: absolute;
    bottom: 0;
    right: 0;
    top: -5px;
    left: 0;
    margin: 0;
    padding: 0 8px;
    pointer-events: none;
    border-radius: inherit;
    border-style: solid;
    border-width: 0px !important;
    overflow: hidden;
    min-width: 0%;
    border-color: rgba(0, 0, 0, 0.23);
}

.MuiInputBase-input {
    font-family: 'DM Sans' !important;
    padding: 5px !important;
    border: 0px !important;
    outline: 0px !important;
}

.MuiOutlinedInput-notchedOutline {
    border: 0px !important;
    outline: 0px !important;
    border-width: 0px !important;
}

.css-qwdxx6 {
    font: inherit;
    letter-spacing: inherit;
    color: currentcolor;
    border: 0px;
    box-sizing: content-box;
    background: none;
    height: 1.4375em;
    margin: 0px;
    -webkit-tap-highlight-color: transparent;
    display: block;
    min-width: 0px;
    width: 100%;
    animation-name: mui-auto-fill-cancel;
    animation-duration: 10ms;
    /* padding: 16.5px 0px 16.5px 14px; */
    font-size: 14px;
    padding: 0px;
}

.MuiOutlinedInput-root {

    width: 95px;
    margin-top: -4px;
    margin-left: -8px;
    margin-right: -20px;
    padding: 0px;
    align-content: flex-start;
}

.css-5v2ak0 {
    text-align: left;
    position: absolute;
    inset: -5px 0px 0px;
    margin: 0px;
    padding: 0px 8px;
    pointer-events: none;
    border-radius: inherit;
    border-style: solid;
    border-width: 0px;
    overflow: hidden;
    min-width: 0%;
    border-color: rgba(0, 0, 0, 0.23);
}

/* Track */
.meetInvitees::-webkit-scrollbar-track {
    background: #EBE8E8;
    border-radius: 2px;
}

.meetInvitees .assto-detais {
    display: flex;
    padding: 8px 6px;
    border-bottom: 1px solid #EBEBEB;
    align-items: center;
    cursor: pointer;
}

.meetInvitees .assto-info {
    width: 90%;
    float: left;
    font-size: 14px;
    color: #101010;
    font-weight: 500;
}

.meetInvitees .roundcheckbox label {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 50%;
    cursor: pointer;
    height: 24px;
    left: 0;
    position: absolute;
    top: 0;
    width: 24px;
}

.meetInvitees .roundcheckbox label:after {
    border: 2px solid #fff;
    border-top: none;
    border-right: none;
    content: "";
    height: 6px;
    left: 5px;
    opacity: 0;
    position: absolute;
    top: 6px;
    transform: rotate(-45deg);
    width: 12px;
}

.meetInvitees .roundcheckbox input[type="checkbox"] {
    visibility: hidden;
}

.meetInvitees .roundcheckbox input[type="checkbox"]:checked+label {
    background-color: #1D4F3A;
    border-color: #1D4F3A;
}

.meetInvitees .roundcheckbox input[type="checkbox"]:checked+label:after {
    opacity: 1;
}

.nohight {
    min-height: 0px !important;
}

.serchmeetInvitees {
    width: 100%;
    max-height: 159px;
    overflow-x: hidden;
    overflow-y: auto;
    margin-bottom: 15px;
    background: #FFFFFF;
    border: 1px solid #EBEBEB;
    border-radius: 10px;
}

.serchmeetInvitees:empty {
    display: none;
}

.serchmeetInvitees .serchmember-flex {
    display: flex;
    border-bottom: 1px solid #EBEBEB;
    padding: 10px;
}

.serchmeetInvitees .serchmember-flex:last-child {
    border-bottom: none !important;
}

.serchmeetInvitees .serchmember-flex .right-b {
    padding-top: 7px;
    width: 20%;
    text-align: right;
    color: #9C9C9C;
}

.serchmeetInvitees .serchmember-flex .right-b img {
    width: 12px;
}

.serchmeetInvitees .serchmember-info {
    width: 80%;
    font-size: 12px;
}

.add-recc {
    position: absolute;
    right: 0;
    top: 0;
}

.add-recc .btn-rec.btn-xs {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
    color: #101010;
}

.nomeetingbtn .btn-outline {
    color: #028090 !important;
    border: 2px solid #028090 !important;
    text-transform: uppercase;
    background: transparent;
    border-radius: 2px;
    min-width: 150px;
    font-weight: 700;
}

.btn-rec,
.btn-rec:focus {
    box-shadow: 0 1px 2px rgb(0 0 0 / 20%);
    background: white;
    border: 1px solid #F2F2F2;
    padding: 3px 7px;
    border-radius: 5px;
}

.add-recc .reccpopup {
    width: 325px !important;
    margin-top: 0;
    background: #FAFAFA;
}

.pop-header {
    padding: 20px;
}

.modal-reccbody {
    padding: 20px;
}

.modal-reccbody .form-group {
    padding-left: 0px !important;
}

.daysCteg .dayscheckbox {
    display: inline-block;
    width: 67px;
}

.daysCteg {
    padding: 15px 0px;
}

.resiText {
    resize: none;
    width: 100%;
}

/* Meeting */
.rightside-panel {
    padding: 20px 70px;
}

.meeting-header {
    display: flex;
    border-bottom: 1px solid #d4d4d4;
    padding-top: 15px;
    padding-bottom: 12px;
    margin-bottom: 40px;
}

.meeting-header .meeting-title {
    width: 50%;
    color: #101010;
    font-weight: 700;
}

.mtsubTitle .titlename {
    color: #101010;
    font-weight: 700;
}

.meeting-header .meeting-detail {
    width: 50%;
    padding-top: 9px;
    text-align: right;
}

.meeting-header .meeting-detail .meeting-time {
    margin-right: 20px;
}

.meeting-header .meeting-detail .mttag {
    border: 1px solid black;
    margin: 0px 10px;
}

.mtsubTitle {
    margin-bottom: 40px;
}

.mtsubTitle h5 img {
    width: 40px;
    margin-right: 15px;
}

.mtsubTitle h5 {
    font-size: 16px;
}

.mtsubTitle .note-text {
    padding-left: 55px;
    font-size: 16px;
    line-height: 26px;
}

.user-blank.red {
    background: #F17568;
}

.InviteesList {
    width: 60%;
    max-height: 255px;
    min-height: 50px;
    overflow-x: hidden;
    overflow-y: auto;
    padding-left: 55px;
    padding-right: 15px;
}

.Invit-flex {
    display: flex;
    border-bottom: 1px solid #A6A7A7;
    padding: 15px 0;
}

.right-b {
    padding-top: 7px;
    width: 20%;
    text-align: right;
    color: #9C9C9C;
}

.Invit-info {
    width: 80%;
}

.mtsubTitle .mtb0 {
    margin: 0px;
}

.taslist {
    margin-top: -20px;
    padding-left: 55px;
}

.mtsubTitle .btn-primery,
.mtsubTitle .btn-primery:hover {
    background: #028090;
    color: white;
    font-weight: 600;
}

.att-list {
    padding-left: 55px;
    padding-top: 20px;
}

.att-list img {
    margin-right: 12px;
}

.mttag-fill {
    background: #028090;
    color: white !important;
    margin: 0px 10px;
}

.mttag-fill:hover {
    background: #028090;
    color: white;
    margin: 0px 10px;
}

.JoinBtn,
.JoinBtn:hover {
    background: #028090;
    color: white !important;
    margin-left: 35px;
}

.meetingid {
    padding-left: 55px;
    margin-top: 20px;
}

.meetingid .meetingpwd {
    padding-left: 50px;
}

.meeting-overview ul {
    list-style-type: none;
    padding: 0px 10px;
}

.meeting-overview ul li {
    padding: 15px 10px;
    border-top: 1px solid #e2e2e2;
}

.meeting-overview ul li span {
    padding-left: 15px;
}

.topsearch li a img {
    margin-right: 15px;
}

.my-dropdown.dropdown-menu>li>a:focus,
.my-dropdown.dropdown-menu>li>a:hover {
    color: #1D4F3A !important;
    text-decoration: none;
    background: #ffffff !important;
}

.nav-searchbox .headersearch {
    background-color: #F6F6F6;
    color: #999;
    font-size: 13px;
}

.nav-searchbox .headersearch:hover {
    background-color: #F6F6F6 !important;
    color: #999 !important;

}

.customtri.my-dropdown:before {
    right: unset !important;
    left: 15px !important;
}

.meetmoreinvitees {
    position: absolute;
    left: -40px;
    top: 7px;
}




.nav-searchbox-header {
    float: left;
    width: 447px;
}

.modal-content .modal-header .close {
    margin-top: -2px;
    padding-right: 5px;
}

.nav-searchbox-header .ddlbtn {
    background-color: transparent;
    color: #999;
    font-size: 13px;
}

.nav-searchbox-header .ddlbtn:hover {
    background-color: transparent;
}

.nav-searchbox-header .ddlbtn:focus {
    outline: none;
}

.searchbox-header {
    height: 32px;
    border: 1px solid #ccc;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    margin-left: -1px;
}

.searchbox-header:focus {
    outline: none;
}

/* .search_by{    margin-left: 7px;} */
.nav-searchbox-header .ddlbtn:hover {
    background-color: #F6F6F6;
}

.nav-searchbox-header .ddlbtn {
    background-color: #F6F6F6;
    color: #999;
    font-size: 13px;
}

.input-group-btn {
    border-right: hidden !important;
}

.search-seprator {
    margin-left: 13px;
    color: #ffffff26 !important;
}

.searchbox-header {
    border-left: hidden !important;
    height: 43px;
    color: #fff;
    border: 1px solid #ffffff26;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    margin-left: 0px;
    width: 295px;
    padding-left: 2px;
    padding-right: 30px;
    font-size: 12px;
    background-color: #1c1c1c;
    border-radius: 0px 10px 10px 0px;
}

.glysearch {
    position: absolute;
    right: 44px;
    font-size: 16px;
    color: #808080;
}

.search-panel-header {
    background: #1c1c1c;
    border: 1px solid #ffffff26;
    color: #fff;
    border-radius: 10px 0px 0px 10px;
}

.search-panel-header a:hover {
    color: unset !important;
}

/* .search-panel-header.btn:active {
    box-shadow: none;
} */

.newpopup .btn-outline {
    background: transparent !important;
    color: #fff !important;
    border: 2px solid #fff !important;
    border-radius: 2px !important;
    min-width: 125px;
    font-weight: 600;
}

.newpopup .verticaldot {
    text-align: right;
}

.newpopup .activiti-author {
    font-weight: 600;
    color: #101010;
}

.newpopup .activiti-content p {
    font-weight: normal;
    font-size: 15px;
}

.newpopup .activiti-list {
    padding: 10px;
    border: 1px dashed #e3e8ee;
    margin-bottom: 15px;
    background: #FCFCFC;
}

.newpopup .activiti-list:last-child {
    border-bottom: 1px dashed #e3e8ee !important;
}

.newpopup .modal-header .close {
    margin-top: -2px;
    position: absolute;
    right: -30px;
    top: -20px;
    opacity: 1;
}

.newpopup .modal-header .close {
    margin-top: -2px;
    position: absolute;
    right: -30px;
    top: -20px;
    opacity: 1;
}

.resetbtn,
.resetbtn:hover {
    color: #fff;
    font-weight: 600;
    margin-left: 20px;
    font-size: 17px;
}

.newpopup .modal-header .close img {
    width: 32px;
}

.newpopup .modal-header .close {
    position: absolute;
    right: -30px;
    top: -35px;
}

/* Filter */
.newpopup .tabs-left>li {
    margin-right: 0px;
    border-bottom: 1px solid #e5e5e5;
}

.newpopup .filter-tab .taskrow .filte-left {
    width: 40%;
    min-height: 425px;
    border-right: 1px solid #e5e5e5;
    background: transparent;
}

.filter-tab .filte-left .nav-tabs>li.active>a,
.filter-tab .nav-tabs>li.active>a:focus,
.filter-tab .nav-tabs>li.active>a:hover {
    color: #1D4F3A;
    cursor: default;
    background-color: #fff;
    border: transparent;
    border-left: 3px solid #028090;
    border-radius: 0;
}

.filter-tab .filte-left .nav-tabs>li>a {
    border-left: 3px solid transparent;
}

.chooseDate {
    display: flex;
    border: 1px solid #f6f7f9;
    border-radius: 3px;
    color: #101010;
}

.chooseDate h5 {
    margin: 0;
}

.chooseDate .dateLable {
    color: #808080;
    padding-bottom: 10px;
    font-size: 12px;
}

.chooseDate .startDate {
    padding: 10px;
    width: 50%;
    position: relative;
}

.chooseDate .endDate {
    padding: 10px;
    width: 50%;
    position: relative;
}

.chooseDate .active {
    background: #f6f7f9;
}

.chooseDate .active .dateLable {
    padding-bottom: 10px;
    font-size: 12px;
}

.chooseDate .tri.active:before {
    content: '';
    background-color: transparent;
    border-right: 10px solid transparent;
    position: absolute;
    border-left: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-top: 10px solid #028090;
    bottom: -20px;
    left: 45%;
}

.taskflag {
    position: relative;
    /* right: 15px; */
    top: 1px;
}

.filte-left .tabs-left>li,
.tabs-right>li {
    float: none !important;
    margin-bottom: 0;
}

.user-blank {
    width: 35px;
    height: 35px;
    line-height: 35px;
    /* margin-right: 5px; */
    background: #028090;
    vertical-align: top;
}

.react-date-picker__inputGroup__input:invalid {
    background: white !important;
}

.inviteesearchtxtbox {
    background: #F9F9F9;
    border: 1px solid #CECECE;
    padding: 12px;

}

.newpopup .tabs-left>li>a {
    margin-right: 0;
    display: block;
    border: none;
    font-weight: 600;
    color: #555;
    padding: 15px 20px;
}

.chooseDate label {
    margin-bottom: 0;
}

.react-calendar__tile--now abbr:hover {
    background: #1D4F3A;
}









/* ///Nitin */
.comment-wrapper .comment-list .comment-toper {
    margin-bottom: 20px;
}

.comment-wrapper .comment-list .comment-header .comtDetails .comtInfo .comtDate {
    color: #808080;
    font-size: 10px;
}

.comment-wrapper .comment-list .comment-header .top-comticon {
    width: 20%;
    text-align: right;
    padding-top: 5px;
}

.comment-wrapper .comment-list .comment-header .top-comticon a img {
    margin-left: 10px;
}

.comment-wrapper .comment-list .comment-header {
    display: flex;
}



.comment-wrapper .comment-list .comment-header .comtDetails .comtPic {
    float: left;
    width: 34px;
    border-radius: 50%;
    border: 2px solid #ffffff;
    height: 33px;
    margin-right: 8px;
}

.comment-wrapper .comment-list .comment-header .comtDetails .comtInfo {
    margin-left: 35px;
    position: relative;
}

.comment-wrapper .comment-list .comtText {
    padding-bottom: 15px;
    font-size: 14px;
    border-bottom: 1px solid #EBEBEB;
    color: #101010;
}

.newcomment .comment-wrapper .comment-list {
    margin-bottom: 15px;
}

.linki {
    visibility: hidden;
}

.comment-list:hover .linki {
    visibility: visible;
}

.comment-wrapper .comment-list .comment-header .comtDetails .comtInfo .comtName {
    font-weight: 600;
    color: #1D4F3A;
    font-size: 12px;
}

.comment-wrapper .comment-list .comment-header .comtDetails {
    width: 67%;
}

.comment-sec {
    max-height: 265px;
    overflow-x: hidden;
    overflow-y: auto;
    margin-bottom: 36px;
}

.comment-header .dropdown-menu.comntDdl {
    border: none;
    margin-top: -47px;
    margin-left: 20px;
}

.comment-header .dropdown-menu.comntDdl {
    min-width: 90px;
    min-height: 35px;
    text-align: center;
}

.comment-header .dropdown-menu.comntDdl:before {
    content: '';
    background-color: transparent;
    border-right: 8px solid #fff;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    top: 8px;
    left: -16px;
}

.modal-content.heightunset {
    min-height: unset !important;
    width: 350px !important;
    border-radius: 10px;
    margin: 0 auto;
}

.fiback .btn-outline {
    color: #028090 !important;
    border: 2px solid #028090 !important;
    text-transform: uppercase;
    background: transparent;
    border-radius: 2px;
    font-weight: 700;
}

.fiback {
    display: flex;
}

.fiback .filtrlist {
    width: 80%;
}

.fiback .filtrlistbtn {
    width: 20%;
}

.comment-main-level .comment-avatar img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    float: left;
}

.comment-flex {
    display: flex;
}

.comment-box .comment-head {
    background: #F7FAFA;
    padding: 10px;
    border-radius: 3px;
    border: 1px dashed #e3e8ee;
    margin-left: 50px;
}

.comment-box .comment-head .posted-detail {
    width: 70%;
}

.comment-box .comment-head .posted-link {
    width: 30%;
    text-align: right;
}

.comment-box .comment-head .posted-link .linki img {
    margin-left: 10px;
}

.comment-box .comment-head .posted-detail .comment-name {
    font-weight: 700;
    color: #101010;
    font-size: 17px;
}

.comment-box .comment-head .posted-detail .posted-time {
    color: #808080;
    font-size: 13px;
}

.comment-box .comment-head .comentText {
    font-size: 13px;
    line-height: 20px;
    padding-top: 5px;
    color: #808080;
}

.comentLink {
    color: #028090;
    margin-left: 5px;
}

.commentBtn {
    border: none;
    position: absolute;
    right: 0px;
    top: 0px;
    font-size: 20px;
    width: 50px;
    border-radius: 0 4px 4px 0;
    background: #028090;
}

.commentBox {
    height: 40px;
    padding: 5px 80px 5px 5px;
}

.attachBtn {
    position: absolute;
    right: 60px;
    top: 10px;
}

.comment-wrapper .activiti-date {
    color: #808080;
    font-size: 12px;
    font-weight: 500;
}

.comment-head {
    position: relative;
}

.comment-main-level .comment-head:before {
    content: "";
    border-color: transparent #e3e8ee transparent transparent;
    border-style: dashed;
    border-width: 15px;
    width: 0;
    height: 0;
    position: absolute;
    bottom: 50%;
    margin-bottom: -10px;
    left: -30px;
}

.comment-main-level .comment-head:after {
    content: "";
    border-color: transparent #F7FAFA transparent transparent;
    border-style: dashed;
    border-width: 15px;
    width: 0;
    height: 0;
    position: absolute;
    bottom: 50%;
    margin-bottom: -10px;
    left: -29px;
}


.comntDdl-line {
    padding: 0px 10px;
}


.tabbable-panel {
    width: 100%;
}

/* width */
.customScroll::-webkit-scrollbar {
    width: 7px;
}

/* Track */
.customScroll::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 5px;
}

/* Handle */
.customScroll::-webkit-scrollbar-thumb {
    background: #ddd;
    border-radius: 5px;
}

/* Handle on hover */
.customScroll::-webkit-scrollbar-thumb:hover {
    background: #d5d5d5;
}

.whitecard {
    background: #fff;
    box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.2);
    padding: 10px 15px;
    border-radius: 4px;
    margin-bottom: 30px;
}

/* Team card view */
.team-hovr-icon {
    visibility: hidden;
    color: #999;
}

.whitecard:hover>.team-hovr-icon i {
    visibility: visible;
    transition: 0.3s;
}

.whitecard .imgBox {
    width: 83px;
    height: 83px;
    border-radius: 50%;
    background-color: #fffdf7;
    border: 1px solid #e5e5e5;
    margin: auto;
}

.whitecard .listview-aimg img {
    max-width: 100%;
    border-radius: 50%;
}

.whitecard h3 {
    margin: 20px 0px;
    margin-bottom: 5px;
    padding: 0;
    font-size: 17px;
}

.whitecard .team-header p {
    font-size: 13px;
    border-bottom: 1px solid #ddd;
    padding-bottom: 10px;
}

.team-header {
    text-align: center;
}

.whitecard h3 img {
    filter: invert(70%);
    vertical-align: top;
    margin-right: 5px;
}

.team-footer p {
    font-size: 13px;
}

.btn-dark:hover,
.btn-dark:focus {
    color: white !important;
    background: #028090;
    font-weight: 500 !important;
}

.btn-dark {
    color: white;
    background: #028090;
    font-weight: 500 !important;
}

.teamsearch-list img {
    margin-right: 10px;
}

.teamsearch-list .pushpin {
    padding-top: 10px;
}

.teamadd {
    color: #028090;
    font-weight: 600;
}

.margin6 {
    margin: 6px;
}

.serchteam .assigneSearch .form-control {
    height: 40px;
    box-shadow: none;
    color: #808080;
}

.serchteam .at-serch {
    background: #f6f7f9;
    border: none;
}

.serchteam .assigneSearch .inputBtn {
    position: absolute;
    right: 15px;
    top: 10px;
    color: #808080;
}

.teamListing {
    display: flex;
}

.teamListing .tm-info {
    width: 70%;
}

.teamListing .tm-name {
    width: 30%;
    text-align: right;
    padding: 7px 0;
}

.teamListing .tm-name .tm-nameBtn {
    display: inline-block;
    margin-right: 15px;
}

.teamListing .tm-name .team-hovr-icon {
    visibility: hidden;
    color: #999;
    display: inline-block;
}

.teamListing .tm-name .team-hovr-icon i {
    color: #B8B8B8;
}

.whitecard:hover>.tm-name .team-hovr-icon i {
    visibility: visible;
    transition: 0.3s;
}

.teamListing .tm-name .tm-nameBtn .btn-redius {
    background: #D9ECEE;
    color: #028090;
    border-radius: 30px;
}

.tm-info .lin-hight a {
    font-weight: 700;
    color: #101010;
}

.teamListing .tm-name .tm-nameBtn .btn-redius img {
    margin-right: 5px;
    vertical-align: initial;
}

.teamSorting {
    background: #F6F6F6;
    border: 1px solid #CDCDCC;
    border-radius: 3px;
    padding: 5px 5px;
}

.teamSorting .caret {
    margin-left: 15px;
}



/* toggle btn */
.pos-relative {
    position: relative;
}

.TMbtn-toggle {
    top: 50%;
    transform: translateY(-50%);
}

.TMbtn-toggle {
    margin: 0 10rem;
    padding: 0;
    position: relative;
    border: none;
    height: 19px;
    width: 3rem;
    border-radius: 1.5rem;
    color: #6b7381;
    background: #028090;
    top: 20px;
    right: 10px;
}

.TMbtn-toggle:focus,
.TMbtn-toggle.focus,
.TMbtn-toggle:focus.active,
.TMbtn-toggle.focus.active {
    outline: none;
}

.TMbtn-toggle:before,
.TMbtn-toggle:after {
    line-height: 1.5rem;
    width: 4rem;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    position: absolute;
    bottom: 0;
    transition: opacity 0.25s;
}

.TMbtn-toggle:before {
    content: 'Teams';
    left: -9rem;
    color: #333333;
    font-weight: 700;
}

.TMbtn-toggle:after {
    content: 'Members';
    right: -5rem;
    opacity: 0.5;
    color: #333333;
    font-weight: 700;
}

.beforeNo {
    position: absolute;
    left: 52px;
    top: 10px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    line-height: 25px;
    color: #028090;
    font-weight: 700;
    font-size: 12px;
    background: #D9ECEE;
}

.afterNo {
    position: absolute;
    right: 0px;
    top: 10px;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    line-height: 25px;
    color: #028090;
    font-weight: 700;
    font-size: 12px;
    background: #D9ECEE;
}

.TMbtn {
    position: absolute;
    right: 140px;
    top: -7px;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: none;
    outline-offset: -2px;
}

.TMbtn-toggle.active>.inner-handle {
    background-color: #BD4053;
}

.TMbtn-toggle.active>.handle:before {
    background-image: radial-gradient(circle at center, #F47280 5px, transparent 5px);
}

.TMbtn-toggle>.handle {
    position: absolute;
    top: 1px;
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
    transition: left 0.25s;
    border: 1px solid #ccc;
}

.TMbtn-toggle.active {
    transition: background-color 0.25s;
}

.TMbtn-toggle.active>.handle {
    left: 1.4175rem;
    transition: left 0.25s;
}

.TMbtn-toggle.active:before {
    opacity: 0.5;
}

.TMbtn-toggle.active:after {
    opacity: 1;
    color: #333333;
}

.TMbtn-toggle.active {
    background-color: #028090;
    box-shadow: none;
}

/* ================================ */


.teamcardview {
    background: #fff;
    box-shadow: 0 0px 5px 0 rgb(0 0 0 / 20%);
    border-radius: 4px;
    margin-bottom: 30px;
}

.padd0 {
    padding: 0 !important;
}

.tmcard-info {
    background: #F8F8F8;
    padding: 10px;
    position: relative;
}

.tmcard-body {
    padding: 10px 0;
}

.tmcard-body .bodylist {
    padding: 10px;
}

.tmcard-body .bodylist .icon {
    float: left;
    text-align: center;
}

.tmcard-body .bodylist .name {
    padding-left: 55px;
    color: #808080;
    font-size: 14px;
    padding-top: 7px;
}

.tmcard-footer {
    border-top: 1px solid #e8e8e8;
    padding: 15px 4px;
}

.tmcard-footer .btn-redius {
    background: #D9ECEE;
    color: #028090;
    border-radius: 30px;
    font-size: 12px;
    font-weight: 600;
    margin-right: 3px;
    text-transform: capitalize;
}

.tmcard-footer .btn-redius img {
    margin-right: 2px;
    vertical-align: initial;
}

.cardview-aimg {
    float: left;
    height: 50px;
    width: 50px;
    border-radius: 50%;
    overflow: hidden;
}

.cardview-dtl {
    padding-left: 65px;
    padding-top: 5px;
}

.cardview-dtl h3 {
    margin-top: 0px;
    font-weight: 700;
}

.cardview-dtl p {
    margin-bottom: 0;
    line-height: 20px;
    font-size: 13px;
}

.whitecard .cardview-aimg img {
    width: 100%;
    border-radius: 0px;
}

/* .removeBtn{position: absolute;  right: 15px; top: 10px;} */
.removeBtn a {
    color: #FF7B7B;
    font-weight: 600;
    font-size: 12px;
    border: 1px solid #FFB8B8;
    background: #FFF3F3;
    margin-top: 5px;
}

.removeBtn a:hover {
    color: #FF7B7B;
    font-weight: 600;
    font-size: 12px;
    border: 1px solid #FFB8B8;
    background: #FFF3F3;
}

.head-pack {
    padding-left: 0px;
}

.crownbg img {
    position: absolute;
    width: 25px !important;
    height: 26px !important;
    left: 54px;
    top: 1px;
}

.novisible {
    visibility: hidden;
}

.teamSorting ul li a img {
    padding-right: 10px;
}

.more-inviteeCount {
    background-color: #1D4F3A;
    position: relative;
    right: 15px;
    padding: 3px;
    border-radius: 100%;
    height: 30px;
    width: 30px;
    text-align: center;
    color: #fff;

}

.profile-invitee-count {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
}

.userlistno {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    text-align: center;
    line-height: 28px;
    color: #028090;
    font-weight: 700;
    font-size: 12px;
    float: left;
    background: #D9ECEE;
}

.userddl select {
    background: transparent;
    border-top: 0;
    border-left: 0;
    border-bottom: 1px solid #CDCDCC;
    border-right: 0;
}

.userddl {
    padding-left: 40px;
    padding-top: 5px;
}

.tm-userList .tmcard-info .edit-hovr-icon {
    text-align: right;
    visibility: hidden;
}

.tm-userList:hover .edit-hovr-icon {
    visibility: visible;
}

.tm-userList .edit-hovr-icon a i {
    background: #EAEAEA;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    line-height: 25px;
    color: #808080;
}

.userddl .selectuserddl.option {
    display: block !important;
    padding: 10px 15px !important;
    clear: both !important;
    font-weight: 500 !important;
    line-height: 1.42857143 !important;
    border-bottom: 1px solid #eee;
    color: #333 !important;
    white-space: nowrap !important;
    margin-right: 0 !important;
    height: 20px;
}

.teammnhight {
    height: calc(100vh - 110px);
    overflow-x: hidden;
    overflow-y: auto;
}

/* Pending list */
.Pending-list .Pending-list-dtl {
    padding: 30px;
}

.Pending-list .Pending-list-dtl .pl-Icon {
    float: left;
}

.Pending-list .Pending-list-dtl .pl-Icon img {
    max-width: 100%;
    height: 55px;
    width: 55px;
    border-radius: 50%;
}

.Pending-list .Pending-list-dtl .pl-Info {
    padding-left: 70px;
    padding-top: 5px;
}

.Pending-list .Pending-list-dtl .pl-Info h3 {
    margin-top: 0px;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 0;
}

.Pending-list .Pending-list-dtl .pl-Info p {
    color: #808080;
}

.Pending-list .Pending-list-footer {
    background: #F8F8F8;
    padding: 25px 25px;
}

.Pending-list .Pending-list-footer .remove {
    color: #FF7B7B;
    font-weight: 600;
}

.Pending-list .Pending-list-footer .reminder {
    float: right;
    color: #028090;
    font-weight: 600;
}

/* teams popup */
.teamspopup .modal-content {
    min-height: unset !important;
    border: none !important;
}

.teamspopup .modal-header {
    background-color: #1D4F3A;
    height: 70px;
    padding: 18px 30px 0px 30px !important;
}

.teamspopup .modal-header .close {
    position: absolute;
    right: -30px;
    top: -35px;
    opacity: 1;
}

.teamspopup .btn-outline {
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 2px;
    min-width: 80px;
    font-weight: 600;
}

.teamspopup .modal-header .close img {
    width: 32px;
}

.teamspopup .modal-dialog {
    border-radius: 5px;
    width: 550px !important;
    position: relative;
    margin: 60px auto !important;
}

.teamspopup .linkbtn {
    color: white;
    opacity: 0.7;
    margin-left: 15px;
}

.teamspopup .tsddl {
    margin-top: 28px;
}

.teamspopup.newpopup .modal-body.pad-top {
    padding-top: 0px;
}

/* Update Profile */
.tmprofilebg {
    /* background-color: #F2F2F2; */
    min-height: 100px;
}

.tmprofileimg {
    height: 110px;
    width: 110px;
    box-shadow: 0 2px 2px #ddd;
    border: 3px solid #FFFFFF;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto;
}

.tmprofileimg .pr-pic {
    width: 100% !important;
    height: auto !important;
    box-shadow: none;
    border-radius: none !important;
}

/* .pr-choose{position: absolute !important; bottom: 20px !important; right: 43% !important;} */
/* .tmprofileimg{ text-align:center;    margin-top: -70px;    position: relative;} */
.pad-top {
    padding-top: 0 !important;
}

.profilename {
    font-weight: 700;
    text-align: center;
    font-size: 18px;
    margin-top: 20px;
}

.updateprofileform {
    margin: 30px 40px;
}

.updateprofileform .form-group {
    margin-bottom: 25px;
}

.updateprofileform .form-control {
    height: 40px;
}

/* .choose-dropdown{right: 19%;  top: -30px;} */
.choose-dropdown:before {
    content: '';
    background-color: transparent;
    border-right: 8px solid #fff;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-top: 8px solid transparent;
    top: 8px;
    left: -16px;
}

.choose-dropdown {
    border: none !important;
    padding: 0 !important;
    border-radius: 4px !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .175) !important;
}

.choose-dropdown>li>a {
    display: block !important;
    padding: 10px 15px !important;
    clear: both !important;
    font-weight: 500 !important;
    line-height: 1.42857143 !important;
    color: #333 !important;
    white-space: nowrap !important;
    margin-right: 0 !important;
}

.choose-dropdown>li {
    border-bottom: 1px solid #eee;
}

.choose-dropdown.dropdown-menu>li>a:focus,
.choose-dropdown.dropdown-menu>li>a:hover {
    color: #028090 !important;
    text-decoration: none;
    background-color: #fff !important;
}

.teampr-choose {
    position: absolute;
    top: -30px;
    right: 44%;
    width: 35px;
}

.teamchooseddl.choose-dropdown {
    right: 20% !important;
}


/* Remove-member */
.Remove-member .memberDetl {
    background: #F8F8F8;
    text-align: center;
    padding-bottom: 20px;
    padding-top: 25px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.Remove-member .memberDetl .modal-header {
    position: absolute;
    right: 20px;
    top: 15px;
    border-bottom: none;
    padding: 0;
}

.Remove-member .memberDetl img {
    max-width: 100%;
    height: 40px;
    width: 40px;
    border-radius: 50%;
}

.Remove-member .memberDetl h5 {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 5px;
    margin-top: 15px;
}

.Remove-member .memberDetl p {
    color: #808080;
    font-size: 14px;
}

.Remove-member .removemsg {
    padding: 21px 17px;
}

.Remove-member .removemsg h1 {
    font-size: 20px;
    font-weight: bold;
    /* color: #028090; */
    margin: 0;
}

.Remove-member .removemsg p {
    margin-bottom: 0;
    font-size: 14px;
    margin-top: 5px;
}

.Remove-member .removemsg .actbtn {
    margin-top: 20px;
}

.removemsg .btn-primery {
    background: transparent;
    border: 1px solid #808080;
    border-radius: 50px;
    color: #808080;
    padding: 8px 35px;
    margin-right: 15px;
}

.removemsg .btn-red {
    background: #FFF3F3;
    color: #FF7B7B;
    padding: 8px 35px;
    border: 1px solid #FFF3F3;
    border-radius: 50px;
}

/* add-new-member */
.add-new-member {
    text-align: center;
    padding: 30px 0;
}

.add-new-member .iconimg {
    height: 20px;
    width: 20px;
    border-radius: 50%;
}

.add-new-member h4 {
    margin-bottom: 30px;
    font-weight: 500;
    font-size: 20px;
    margin-top: 20px;
}

.add-new-member .InviteBox {
    border-radius: 5px;
    padding: 10px;
}

.add-new-member .InviteBox .InviteBox-List {
    background: #F2F2F2;
    border: 1px solid #CDCDCC;
    display: inline-table;
    padding: 3px 3px;
    border-radius: 3px;
    float: left;
    margin-bottom: 10px;
    margin-right: 10px;
    color: #808080;
}

.add-new-member .InviteBox .InviteBox-List span {
    margin-left: 4px;
    margin-right: 5px;
}


/* Create Team */
.Create-Team .form .form-group {
    margin-bottom: 20px;
}

.Create-Team .form-group {
    position: relative;
    min-height: 50px;
    padding-left: 55px;
    border-bottom: 1px solid #dbdbdb;
}

.Create-Team .form-label {
    padding: 5px 0px;
    font-size: 14px;
    font-weight: 700;
    font-family: 'Muli', sans-serif !important;
}

.Create-Team .label-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
}

.Create-Team .form-input {
    padding: 0px;
    box-shadow: none;
    border: none;
    outline: none;
    color: #808080;
    font-family: 'Muli', sans-serif !important;
    font-weight: 500;
}

.Create-Team {
    padding: 25px 50px;
}

.Create-Team .AddMembers {
    min-height: 120px;
    border: 1px solid #CDCDCC;
    border-radius: 5px;
    padding: 10px;
}

.Create-Team .AddMembers .AddMembers-List {
    background: #F2F2F2;
    border: 1px solid #CDCDCC;
    display: inline-block;
    padding: 5px 10px;
    border-radius: 3px;
    margin-bottom: 10px;
    margin-right: 10px;
    color: #808080;
}

.Create-Team .AddMembers .AddMembers-List span {
    margin-left: 4px;
    margin-right: 10px;
}

.Create-Team .AddMembers .iconimg {
    height: 25px;
    width: 25px;
    border-radius: 50%;
}

.no-group {
    position: relative;
    /* padding-left: 55px; */
    min-height: 50px;
}

.MembersTitle {
    background: #F7F7F7;
    padding: 15px 35px;
}

.MembersTitle img {
    margin-right: 7px;
}


.noteamsimg p {
    margin-bottom: 25px;
}


.teamsetting .form .form-group {
    margin-bottom: 20px;
}

.teamsetting .form-group {
    position: relative;
    min-height: 50px;
    padding-left: 55px;
    border-bottom: 1px solid #dbdbdb;
}

.teamsetting .form-label {
    /* padding: 5px 0px;
    font-size: 14px;
    font-weight: 700;
    font-family: 'Muli', sans-serif !important; */
}

.teamsetting .label-icon {
    position: absolute;
    top: 0;
    left: 0;
    width: 40px;
}

.teamsetting .form-input {
    padding: 0px;
    box-shadow: none;
    border: none;
    outline: none;
    color: #101010;
    font-weight: 500;
}

.teamsetting .modal-body {
    padding: 0px;
}


.setting-noti h4 {
    font-size: 16px;
    font-weight: 700;
}

.setting-noti p {
    color: #808080;
}

.btn-red,
.btn-red:hover {
    color: #FF7B7B !important;
    background: #FFF3F3 !important;
    border: 1px solid #FFB8B8 !important;
    font-weight: 500 !important;
}

.setting-noti .Change-time {
    border-bottom: 1px solid #A6A7A7;
    padding: 25px 0px;
}

.setting-noti .Change-time .time {
    padding: 6px 8px;
    border: 1px solid #CDCDCC;
    border-radius: 3px;
}



.taskradio [type="radio"]:checked,
.taskradio [type="radio"]:not(:checked) {
    position: absolute;
    left: -9999px;
}

.taskradio [type="radio"]:checked+label,
.taskradio [type="radio"]:not(:checked)+label {
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
    font-weight: 500;
}

.taskradio [type="radio"]:checked+label:before,
.taskradio [type="radio"]:not(:checked)+label:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 19px;
    height: 19px;
    border: 1px solid #838D88;
    border-radius: 100%;
    background: #fff;
}

.taskradio [type="radio"]:checked+label:after,
.taskradio [type="radio"]:not(:checked)+label:after {
    content: '';
    width: 11px;
    height: 11px;
    background: #065F46;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
}

.taskradio [type="radio"]:not(:checked)+label:after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}

.taskradio [type="radio"]:checked+label:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}


.user-blank-team {
    border-radius: 50%;
    background: #065F46;
    color: white;
    font-size: 24px;
    font-weight: 600;
    display: flex;
    width: 81px;
    height: 81px;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    align-content: center;
    justify-content: center;

}

.cardview-dtl-team {
    padding-left: 65px;
}

.cardview-dtl-team H3 a {
    color: #000;
    font-weight: 600;
}

/* Project Module 19/07/21 */
.activelabal {
    color: #028090;
    background: #E0EEF1;
    width: 30px;
    height: 30px;
    text-align: center;
    border-radius: 50%;
    line-height: 30px;
    font-size: 15px;
    font-weight: 700;
    position: absolute;
    left: -30px;
    top: 2px;
}

/* toggle btn project card view*/
.pr_card-btn-toggle {
    top: 50%;
    transform: translateY(-50%);
}

.pr_card-btn-toggle {
    margin: 0 7rem;
    padding: 0;
    position: relative;
    border: none;
    height: 19px;
    width: 3rem;
    border-radius: 1.5rem !important;
    color: #6b7381;
    background: #028090;
    top: 15px;
    right: 6px;
}

.pr_card-btn-toggle:focus,
.pr_card-btn-toggle.focus,
.pr_card-btn-toggle:focus.active,
.pr_card-btn-toggle.focus.active {
    outline: none;
}

.pr_card-btn-toggle:before,
.pr_card-btn-toggle:after {
    line-height: 1.5rem;
    width: 4rem;
    text-align: center;
    font-weight: 600;
    font-size: 14px;
    position: absolute;
    bottom: 0;
    transition: opacity 0.25s;
}

.pr_card-btn-toggle:before {
    content: 'Active';
    left: -5rem;
    color: #333333;
    font-weight: 600;
}

.pr_card-btn-toggle:after {
    content: 'Archived';
    right: -5rem;
    opacity: 0.5;
    color: #333333;
    font-weight: 600;
}

.btn.active.focus,
.btn.active:focus,
.btn.focus,
.btn:active.focus,
.btn:active:focus,
.btn:focus {
    outline: none;
    outline-offset: -2px;
}

.pr_card-btn-toggle.active>.inner-handle {
    background-color: #BD4053;
}

.pr_card-btn-toggle.active>.handle:before {
    background-image: radial-gradient(circle at center, #F47280 5px, transparent 5px);
}

.pr_card-btn-toggle>.handle {
    position: absolute;
    top: 1px;
    left: 0;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #ffffff;
    transition: left 0.25s;
    border: 1px solid #ccc;
}

.pr_card-btn-toggle.active {
    transition: background-color 0.25s;
}

.pr_card-btn-toggle.active>.handle {
    left: 13px;
    transition: left 0.25s;
}

.pr_card-btn-toggle.active:before {
    opacity: 0.5;
}

.pr_card-btn-toggle.active:after {
    opacity: 1;
    color: #333333;
}

.pr_card-btn-toggle.active {
    background-color: #028090;
    box-shadow: none;
}

/* ================================ */




/* //Nitin 20-07-2020 */
/* .react-multi-email div  {
    height: 20px !important;
    font-size: 12px !important;
} */


.teamspopup .btn-outline:hover {
    /* background: transparent; */
    color: #fff !important;
    border: 2px solid #fff !important;
    border-radius: 2px;
    min-width: 80px;
    font-weight: 600;
}

.teamspopup .btn-outline {
    /* background: transparent; */
    color: #fff !important;
    border: 2px solid #fff !important;
    border-radius: 2px;
    min-width: 80px;
    font-weight: 600;
}

/* newpopup */
/* .newpopup .uni-popup .modal-header {
    background: #1D4F3A;
} */

.newpopup .btn-outline {
    background: transparent;
    color: #fff;
    border: 2px solid #fff;
    border-radius: 2px;
    min-width: 125px;
    font-weight: 600;
}

.newpopup .verticaldot {
    text-align: right;
}

.newpopup .activiti-author {
    font-weight: 600;
    color: #101010;
}

.newpopup .activiti-content p {
    font-weight: normal;
    font-size: 15px;
}

.newpopup .activiti-list {
    padding: 10px;
    border: 1px dashed #e3e8ee;
    margin-bottom: 15px;
    background: #FCFCFC;
}

.newpopup .activiti-list:last-child {
    border-bottom: 1px dashed #e3e8ee !important;
}

.newpopup .modal-header .close {
    margin-top: -2px;
    position: absolute;
    right: -30px;
    top: -35px;
    opacity: 1;
}

/* .choose-dropdown {right: 140px !important; top: -15px !important;} */
.customButton {
    border: 2px solid #028090;
    color: #028090;
    width: 160px;
    height: 40px;
    cursor: pointer;
    display: inline-block;
    border-radius: 3px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    background: transparent;
}

/* //Nitin // 27-07-2021 */

.meetingpopup .taskRightcol input[type="time"] {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: 'Mulish', sans-serif !important;
}

.meetingpopup .taskRightcol input[type="time"]::-webkit-calendar-picker-indicator {
    color: black;
    right: 0px;
    opacity: 1;
    display: block;
    background: url(../images/tasks/down-arrow-gray.svg) no-repeat;
    width: 20px;
    height: 20px;
}

.meetingpopup .taskRightcol .datedownarrow {
    position: absolute;
    top: 49px;
    right: 16px;
    width: 10px;
    cursor: pointer;
}

.meetingpopup .taskRightcol .dropdown select {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: 'Mulish', sans-serif !important;
}



.meetingpopup .taskRightcol .dropdown option {
    border: 0px;
    background-color: transparent;
    padding: 0px;
    color: #808080;
    box-shadow: none;
    font-size: 12px;
    font-family: 'Mulish', sans-serif !important;
}

.meetingbtnactive {
    background-color: #1D4F3A !important;
    color: #fff !important;
    border: 1px solid #1D4F3A !important;
}

.meetingbtnactive .iconb {
    filter: brightness(0) invert(1) !important;
}

.close1 {
    margin-top: -2px;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.loader {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 99999;
}

.loaderSearch {
    position: absolute;
    top: -36px;
    z-index: 99999;
    left: 50%;
}

.loaderAnalytics {
    position: absolute;
    top: 50%;
    z-index: 99999;
    left: 50%;
}

.taskpopup .modal-header .dropdown-menu-right1 {
    top: 68px;
    right: 0px;
    left: unset;
    float: none;
    width: 250px;
}

.react-datepicker-wrapper {
    display: unset !important;
    padding: unset !important;
    border: 0 !important;
}

.react-datepicker__header:not(.react-datepicker__header--has-time-select) {
    background-color: white !important;
    border-bottom: 1px solid #eee;
}

.react-datepicker__month-container {

    width: 248px !important;
    font-size: 100% !important;
}

.react-datepicker {
    width: 250px !important;
    font-family: unset !important;
    font-size: 80% !important;
}

.react-datepicker__day-name,
.react-datepicker__day,
.react-datepicker__time-name {
    width: 2.9rem !important;
}

.react-datepicker__current-month,
.react-datepicker-time__header,
.react-datepicker-year-header {
    font-size: 15px !important;
    height: 44px;
}

.react-datepicker__day--selected {
    background-color: #C9E7EA !important;
    border-radius: 50% !important;
}

.react-datepicker__day--keyboard-selected {
    background-color: #C9E7EA !important;
    border-radius: 50% !important;
}

.react-datepicker__day:hover {
    background-color: #eee !important;
    border-radius: 50% !important;
}

.react-datepicker__day {
    line-height: 2.5rem !important;
}

.react-datepicker__navigation {

    top: 12px !important;
}

.MuiInput-underline:before {
    content: "\00a0" !important;
    border-bottom: 0px solid rgba(0, 0, 0, 0.42) !important;
}

.MuiInput-underline:hover:not(.Mui-disabled)::before {
    content: "\00a0" !important;
    border-bottom: 0px solid rgba(0, 0, 0, 0.42) !important;
}

.Mui-focused {
    border-bottom: 0px solid rgba(0, 0, 0, 0.42) !important;
}

.user-blank-teamlarge {

    border: 1px solid #ddd;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    margin-right: 5px;
    overflow: hidden;
    line-height: 90px;
    background: #1D4F3A;
    padding: 5px;
    text-align: center;
    color: white;
    font-size: 30px;
    font-weight: 600;
    display: block;

}

.react-tel-input :disabled {
    cursor: not-allowed;
    background-color: #eee !important;
}

.apexcharts-canvas {
    margin: 0 auto !important;
}

.selectteamleft .my-dropdown {
    margin-top: 10px;
}

.selectteamleft .my-dropdown:before {
    right: unset;
    left: 15px;
}

.teamtaskoutlistviwscroll {
    /* height: calc(100vh - 130px); */
    background: #E6E9F0;    
}

.taskmodsidelistviwscroll {
    height: calc(100vh - 130px);
    scrollbar-width: none;
}

.taskmodsidelistviwscroll::-webkit-scrollbar {
    width: 0px;
}

/* Track */
.taskmodsidelistviwscroll::-webkit-scrollbar-track {
    box-shadow: inset 0 0 0px white;
    border-radius: 0px;
}

.taskmodsidelistviwscroll::-moz-scrollbar {
    width: 0px;
}

/* Track */
.taskmodsidelistviwscroll::-moz-scrollbar-track {
    box-shadow: inset 0 0 0px white;
    border-radius: 0px;
}

@-moz-document url-prefix() {
    .serchteam.dropdown-menu-right {
        left: 0 !important;
    }
}

.markasread {
    margin-right: 20px;
    padding: 3px 10px;
    border-right: 1px solid #dbdbdb;
}

.markasread a {
    font-size: 15px;
    font-weight: 500;
}

.notificationcount {
    position: absolute;
    top: 6px;
    left: unset;
    right: unset;
    background-color: #1D4F3A;
    color: white;
    margin-left: 29px;
    border-radius: 50%;
    border: 1px solid white;
    width: 22px;
    height: 22px;
    padding: 3px 0;
    font-size: 11px;
    text-align: center;
}


/* Privacy Policy start*/
.publicpage .policytopsection {
    padding-top: 140px !important;
    margin-bottom: 50px;
}

.publicpageolul .h1ai {
    font-weight: 700 !important;
    font-size: 68px !important;
    line-height: 78px;
}

.publicpage .policytopsection .policytext .newstitle {
    font-size: 16px;
    text-transform: uppercase;
    font-weight: normal;
}

.publicpage .policytopsection .policytext h2 {
    font-size: 28px;
    font-weight: bold;
    margin-top: 20px;
}

.publicpage .policytopsection .policytext p {
    font-size: 20px;
    font-weight: 600;
    margin-top: 20px;
    line-height: 30px;
}

.publicpage .policytext .mt50 {
    margin-top: 50px;
}

.publicpage .policytext .innersubtitle {
    font-size: 28px;
    font-weight: 700;
}

.publicpage .policytopsection .policytext .ullist li {
    font-size: 17px;
    font-weight: 500;
    margin-bottom: 10px;
}

/* Privacy Policy End*/

.datecolor {
    color: #808080 !important;
    font-weight: 500;
}

.pagenotfound {
    text-align: center;
    padding-top: 10%;
}

.pagenotfound h3 {
    color: #028090;
    font-size: 28px;
    padding-bottom: 20px;
}

.projectmeeting {
    font-size: 11px;
    color: #028090;
}

abbr[data-original-title],
abbr[title] {
    cursor: default !important;
}


.loadMoreBtn {
    font-size: 15px;
    font-weight: 600;
    color: #028090;
    position: relative;
    display: block;
    margin: 0 auto;
    border: navajowhite;
    background: transparent;
    padding-bottom: 15px;
}

.loadingText {
    font-size: 15px;
    font-weight: 600;
    color: #028090;
    position: relative;
    display: block;
    margin: 0 auto;
    border: navajowhite;
    background: transparent;
}

/**
 * ==============================================
 * Dot Pulse
 * ==============================================
 */
.dot-pulse {
    position: relative;
    left: -9999px;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #337ab7;
    color: #337ab7;
    box-shadow: 9999px 0 0 -5px #337ab7;
    animation: dotPulse 1.5s infinite linear;
    animation-delay: .25s;
}

.dot-pulse::before,
.dot-pulse::after {
    content: '';
    display: inline-block;
    position: absolute;
    top: 0;
    width: 10px;
    height: 10px;
    border-radius: 5px;
    background-color: #337ab7;
    color: #337ab7;
}

.dot-pulse::before {
    box-shadow: 9984px 0 0 -5px #337ab7;
    animation: dotPulseBefore 1.5s infinite linear;
    animation-delay: 0s;
}

.dot-pulse::after {
    box-shadow: 10014px 0 0 -5px #337ab7;
    animation: dotPulseAfter 1.5s infinite linear;
    animation-delay: .5s;
}

@keyframes dotPulseBefore {
    0% {
        box-shadow: 9984px 0 0 -5px #337ab7;
    }

    30% {
        box-shadow: 9984px 0 0 2px #337ab7;
    }

    60%,
    100% {
        box-shadow: 9984px 0 0 -5px #337ab7;
    }
}

@keyframes dotPulse {
    0% {
        box-shadow: 9999px 0 0 -5px #337ab7;
    }

    30% {
        box-shadow: 9999px 0 0 2px #337ab7;
    }

    60%,
    100% {
        box-shadow: 9999px 0 0 -5px #337ab7;
    }
}

@keyframes dotPulseAfter {
    0% {
        box-shadow: 10014px 0 0 -5px #337ab7;
    }

    30% {
        box-shadow: 10014px 0 0 2px #337ab7;
    }

    60%,
    100% {
        box-shadow: 10014px 0 0 -5px #337ab7;
    }
}


.react-tel-input .form-control {
    width: inherit !important;
}

.valign {
    vertical-align: middle;
}

.m-30 {
    margin: 0px !important;
}

.shimmer-avatar {
    /* margin-top: 10px; */
}

.taskBox1 .shimmer-title--secondary {
    margin-bottom: 14px;
    padding-top: 4px;
}

.taskBox1 .p-15 {
    padding: 21px 50px 9px 10px !important;
}

.taskBox1 .shimmer-avatar {
    margin-bottom: 0px !important;
    margin-top: 4px !important
}

.shimmer-title-line:last-child {
    display: none;
}

.panel-container .panel-tasklist li .taskBox1 {
    padding: 0px 20px;
    /* display: flex; */
}

.tabbox .edit-hovr-icon {
    margin-left: 10px;
    text-align: right;
    visibility: hidden;
}

.tabbox:hover .edit-hovr-icon {
    visibility: visible;
}

.tabbox .edit-hovr-icon a i {
    background: #EAEAEA;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    text-align: center;
    line-height: 25px;
    color: #808080;
}

.special-label {
    display: none;
}

/* #chartdiv1 div svg g:nth-child(2):nth-child(2) g:nth-child(3):last-child{display: none !important;} */


/* 18 May 2022 by AboutUs - Support */
/*About use Page*/
/*About use Page  19/09/2024*/
.publicpage .top_banner {
    background: #EFF1EE;
    margin-top: 72px;
    min-height: 610px;
}

.publicpage .about-top-section {
    width: 100%;
    padding-top: 160px;
}

.publicpage .about-page {
    width: 73.4%;
    margin: 0 auto;
    font-family: 'DM Sans';
}

.about-page .top-banner-text {
    margin: unset;
    margin-left: 0px;
}

.about-page .top-banner-text h1 {
    font-weight: 700;
    font-size: 68px;
    line-height: 78px;
    font-family: 'DM Sans';
    letter-spacing: -2px;

}

.about-page h2 {
    font-weight: 700;
    font-size: 68px;
    font-family: 'DM Sans';
}

.publicpage .about-top-right-logo {
    position: absolute;
    right: 0px;
    top: 85px;
    width: 530px;
    z-index: -1;
}

.publicpage .about-top-section h1 span {
    color: #065F46;
}

.about-page .vision-section {
    padding: 70px 0px 0px 0px;
    width: 100%;
}

.about-page .vision-section .vision-box {
    margin-top: 100px;
}

.about-page h4 {
    font-size: 24px;
    font-weight: 600;
}

.about-page .vision-section .img1 {
    width: 375px;
    border-radius: 10px;
}

.about-page .vision-section .img2 {
    width: 100%;
    padding-top: 210px;
    border-radius: 10px;
}

.about-page p {
    line-height: 28px;
    margin-top: 20px;
    font-size: 21px;
    color: #707070;
    padding: 0px 45px 0px 0px;
}

.about-page .innovation-section {
    padding: 130px 0px 0px 0px;
    width: 100%;
}

.about-page .innovation-section .img1 {
    width: 500px;
    border-radius: 10px;
}

.about-page .innovation-section .img2 {
    width: 100%;
    padding-top: 50px;
    border-radius: 10px;
}

.about-page .innovation-section .para {
    padding: 80px 30px;
}

.about-page .impowering-section {
    padding: 130px 0px 0px 0px;
    width: 100%;
}

.about-page .impowering-section .img1 {
    width: 100%;
    border-radius: 10px;
}

.about-page .impowering-section .para {
    margin: 40px 0px 80px 0px;
}

.about-page .customer-approach {
    padding: 130px 0px 0px 0px;
    width: 100%;
}

.about-page .customer-approach .img1 {
    width: 100%;
    padding-top: 50px;
    border-radius: 10px;
}

.about-page .team-Section {
    padding: 130px 0px 0px 0px;
    width: 100%;

}

.about-page .team-Section .team-card {
    margin-bottom: 50px;
}

.about-page .team-Section .img1 {
    width: 100%;
    border-radius: 10px;
}

.about-page .team-Section h4 {
    font-size: 24px;
    font-weight: 600;
    padding: 20px 0px 5px 0px;
}

.about-page .team-Section h2 {
    padding: 20px 0px 5px 0px;
}

.about-page .team-Section .designation {
    font-size: 20px;
    padding: 0px;
    margin: unset;
}



/* End */
.publicpage .top_banner .banner_flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 80px;
    padding-bottom: 60px;
}

.publicpage .top_banner .banner_flex .text_Side {
    width: 50%;
}

.publicpage .top_banner .banner_flex .img_side {
    width: 50%;
}

.publicpage .top_banner .banner_flex .img_side img {
    width: 100%;
}

.publicpage .top_banner .banner_flex .text_Side .heading h1 {
    font-weight: 900;
    font-size: 50px;
}

.publicpage .top_banner .banner_flex .text_Side .heading p {
    line-height: 30px;
    margin-top: 20px;
    font-size: 18px;
    padding-right: 30px;
}

.page_heading h2 {
    font-weight: 900;
    font-size: 32px;
    line-height: 32px;
    padding-bottom: 18px;
}

.page_heading p {
    line-height: 30px;
    margin-top: 10px;
    font-size: 20px;
}

.our_story {
    text-align: center;
    padding: 100px 0;
}

.values_row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 100px;
}

.values_row .values_content {
    width: 50%;
    padding-right: 15%;
}

.values_row .values_content h3 {
    font-size: 22px;
    padding-bottom: 0;
    font-weight: 900;
}

.values_row .values_content p {
    font-size: 18px;
    color: #4B4B4B;
    line-height: 30px;
    margin-top: 22px;
}

.values_row .values_img {
    width: 50%;
    text-align: center;
}

.values_row .values_img img {}

.reverse {
    flex-direction: row-reverse;
}

.vlaues_top {
    margin-top: 100px;
}

.publicpage .team_card {
    margin-bottom: 30px;
    border-radius: 3px;
    box-shadow: 0 0px 5px rgb(0 0 0 / 15%);
    text-align: center;
    padding: 50px 30px;
}

.publicpage .team_card .team_header {
    position: relative;
}

.publicpage .team_card .team_header .team_img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    overflow: hidden;
    margin: 0 auto;
    border: 1px solid #dfdfdf;
}

.publicpage .team_card .team_header .team_linkedin {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 40%);
}

.publicpage .team_card .team_header .team_linkedin a i {
    background: #fff;
    color: #8A8A8A;
    width: 42px;
    height: 42px;
    line-height: 42px;
    text-align: center;
    border-radius: 3px;
    font-size: 20px;
    transition: all 0.3s ease-in-out;
    border: 1px solid rgba(180, 180, 179, 0.11);
}

.publicpage .team_card .team_header .team_img img {
    width: 100%;
}

.publicpage .team_card .team_desc h4 {
    font-weight: 900;
    font-size: 20px;
    margin-bottom: 10px;
}

.publicpage .team_card .team_desc p {
    line-height: 30px;
    font-size: 18px;
    margin-top: 30px;
}

.publicpage .team_card .team_desc span {
    font-size: 18px;
}

.publicpage .team_sec h3 {
    font-weight: 900;
    font-size: 32px;
}

.publicpage .team_sec p {
    line-height: 30px;
    font-size: 20px;
    margin-top: 10px;
}

.publicpage .team_body .team_desc p {
    font-size: 15px;
    line-height: 26px;
    margin-top: 10px;
}

.publicpage .team_desc {
    margin-top: 40px;
}

.team_space {
    margin-top: 60px;
}

/*Supoort Page*/
.publicpage .banner_btn {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    margin-top: 30px;
}

/*Btn Outline*/
.publicpage .btn_themeline {
    color: #028090;
    border-radius: 3px;
    border: 2px solid #028090;
    font-weight: 700;
    transition: all 0.3s ease-in-out !important;
    padding: 12px 35px;
    font-size: 16px;
    background-color: transparent;
}

.publicpage .btn_themeline:hover {
    background: #028090;
    color: #fff;
}

.publicpage .linkbtn {
    border-bottom: 1px solid #028090;
    color: #1D1D1D;
    font-size: 16px;
    font-weight: 600;
}

/*Btn Fill*/
.publicpage .btn_theme {
    background-color: #028090;
    color: #fff;
    border-radius: 3px;
    border: 2px solid #028090;
    font-weight: 700;
    transition: all 0.3s ease-in-out !important;
    padding: 12px 35px;
    font-size: 16px;
}

.publicpage .btn_theme:hover {
    background: transparent;
    color: #028090;
}

.publicpage .supoort_form {
    margin: 100px 200px;
}

.publicpage .supoort_form .support_box {
    margin-top: 60px;
}

.publicpage .supoort_form .support_box .support_feild {
    margin-bottom: 50px;
}

.publicpage .supoort_form .support_box .support_feild .support_text {
    margin-bottom: 30px;
}

.publicpage .supoort_form .support_box .support_feild .support_text h3 {
    font-size: 22px;
    padding-bottom: 0;
    font-weight: 900;
}

.publicpage .supoort_form .support_box .support_feild .support_text p {
    font-size: 16px;
    color: #4B4B4B;
    line-height: 30px;
    margin-top: 10px;
}

.publicpage .supoort_form .support_box .support_feild input.form-control,
select.form-control {
    height: 45px;
}

.file-input__input {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.file-input__label {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    border-radius: 50px;
    font-size: 16px;
    font-weight: 600;
    color: #919191;
    padding: 14px 32px;
    background-color: rgba(2, 128, 144, 0.1);
}


/*Blog Page*/

.publicpage .blog-banner-container {
    width: 100%;
    margin: 0 auto;
    font-family: 'DM Sans';


}

.publicpage .blog-page {
    width: 73.4%;
    margin: 0 auto;
    font-family: 'DM Sans';


}

.publicpage .blog-top-section {
    width: 100%;
    margin-bottom: 40px;
    margin-top: 100px;
}

.blog-top-section h1 {
    font-weight: 700;
    font-size: 68px;
    line-height: 78px;
    font-family: 'DM Sans';
    letter-spacing: -2px;
    margin: 20px 0px;
}

.blog-page .blog-top-section .blog-detail-box {
    color: #fff;
    padding: 20px;
    backdrop-filter: blur(10px);
    background-color: rgba(28, 28, 28, 0.66);
    position: absolute;
    bottom: 0;
    width: 98%;
    box-sizing: border-box;
    border-radius: 15px;
    margin: 10px;
}

.blog-page .blog-top-section .badge {
    background-color: unset;
    border: solid 1px #065F46;
    border-radius: 30px;
    padding: 5px 10px;
    margin-right: 10px;
    color: #065F46;
}

.blog-page .blog-top-section .text-muted {
    color: #707070;
}

.blog-head-1 {
    width: 73%;
    margin: 0 auto !important;
    margin-bottom: 50px !important;
}

.banner-blog-card {
    border: none;
    border-radius: 10px;
    overflow: hidden;
    transition: all 0.3s ease;
    position: relative;
    width: 100%;
    margin-left: 15%;
}


.banner-blog-card .blog-detail-box {
    color: #fff;
    padding: 20px;
    backdrop-filter: blur(10px);
    background-color: rgba(28, 28, 28, 0.66);
    position: absolute;
    bottom: 0;
    width: 98%;
    box-sizing: border-box;
    border-radius: 15px;
    margin: 10px;
}

.banner-blog-card .badge {
    background-color: unset;
    border: solid 1px #065F46;
    border-radius: 30px;
    padding: 5px 10px;
    margin-right: 10px;
    color: #fff;
}

.banner-blog-card .card-title {
    color: #ffffff;
    font-weight: 600;
    font-size: 24px;
    padding-bottom: 10px;
}

.banner-blog-card .card-title a {
    color: #ffffff;
}

.blog-page .card-title a {
    color: #ffffff;
}

.banner-blog-card .arrow-icon {
    position: absolute;
    right: 40px;
    bottom: 20px !important;
}


.blog-page h2 {
    font-weight: 700;
    font-size: 68px;
    font-family: 'DM Sans';
}

.publicpage .blog-top-section h1 span {
    color: #065F46;
}

.mb-40 {
    margin-bottom: 40px;
}

.blog-page .card-img-top {
    width: 100%;
    border-top-right-radius: 20px;
    border-top-left-radius: 20px;
    object-fit: cover;
}


.blog-page .blog-detail-box {
    background-color: #19191B;
    color: #fff;
    padding: 20px 20px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

.blog-page .badge {
    background-color: unset;
    border: solid 1px #065F46;
    border-radius: 30px;
    padding: 5px 10px;
    margin-right: 10px;
    color: #fff;
}

.blog-page .card-title {
    color: #ffffff;
    font-weight: 600;
    font-size: 24px;
}

.blog-page .inner-blog-card {
    border-radius: 30px;
    padding: 15px;
    border: solid 1px #ccc;
    margin-bottom: 20px;
}

.inner-blog-card .blog-card-body {
    padding: 10px;
}

.inner-blog-card .card-title {
    color: #1B1B1B;
    font-weight: 600;
    font-size: 24px;
    padding: 10px 0px;
}

.inner-blog-card .card-text {
    color: #707070 !important;
    line-height: 21px;
    font-size: 15px;
    padding-top: 10px;
    width: 90%;
}

.inner-blog-card .badge {
    background-color: unset;
    border: solid 1px #065F46;
    border-radius: 30px;
    padding: 5px 10px;
    margin-right: 10px;
    color: #065F46;
}

.inner-blog-card .arrow-icon {
    position: absolute;
    right: 40px;
    bottom: 40px !important;
}

.inner-blog-card .text-muted {
    color: #707070 !important;
}

.blog-page .card-title a {
    color: #ffffff;
}

.blog-page .card-title a:hover {
    color: #D9D9D9;
}

.blog-page .card-text {
    color: #D9D9D9;
    line-height: 21px;
    font-size: 15px;
    padding-top: 10px;
    width: 90%;
}

.blog-page .arrow-icon {
    position: absolute;
    right: 40px;
    bottom: 40px;
}

.blog-page .stretched-link {
    color: #fff;
    text-decoration: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.blog-page .text-muted {
    color: #D1D1D1;
}

.blog-page .stretched-link:hover {
    color: #fff;
}

/* blog details */


.blog-page .author-section {
    display: flex;
    align-items: center;
}

.blog-page .aouther {
    display: flex;
    flex-direction: column;
}

.blog-page .aouther-name {
    color: #065F46;
    font-weight: 600;
}

.blog-page .author-image {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin-right: 10px;
}

.blog-inner-details {
    margin: 0 auto;
    width: 60%;
    padding: 50px 20px 20px 20px;
}

.blog-inner-details p {
    color: #707070;
    font-size: 18px;
    line-height: 28px;
}

.blog-inner-details blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #065F46;
}

.blog-inner-details .share-post-blck {
    border-top: 1px solid #028090;
    padding: 40px 5px 20px 5px;
    display: flex;
    justify-content: space-between;
}

.blog-inner-details .social-section {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.blog-inner-details .share-this-post {
    color: #1B1B1B;
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 7px;
}

.link-view-all-blog {
    border-radius: 30px;
    padding: 10px 25px;
    color: #fff !important;
    background-color: #1B1B1B;
}

.more-stories-tilte {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 50px;

}

.link-view-all-blog a {
    color: #fff !important;
}

.share-post-blck .badge {
    background-color: unset;
    border: solid 1px #065F46;
    border-radius: 30px;
    padding: 5px 10px;
    margin-right: 10px;
    color: #065F46;
}

.hero-image img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.blog-inner-details .hero-image img {
    width: 100%;
    height: auto;
    border-radius: 10px;
}

.blog-page .quote {
    font-style: italic;
    border-left: 4px solid #28a745;
    padding-left: 15px;
    margin: 20px 0;
}

.blog-page .tag {
    margin-right: 10px;
}

.blog-page .breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: unset !important;

}

.blog-page .breadcrumb-item li {
    font-size: 12px;
}

/* .end blog */


.task-landingview {
    padding: 160px 0;
    text-align: center;
    min-height: 507px
}

.d-flex {
    display: flex;
}

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

.modal-top-list {
    background: white;
    padding: 7px 10px;
    border: 1px solid #e5e5e5;
    border-radius: 3px;
    color: #89959e;
    font-size: 13px;
    font-weight: 500;
    margin: 5px;
    display: inline-block;
}

.modal-top-list img {
    cursor: pointer;
}

.attch-file {
    border: 2px dotted #e5e5e5;
    width: 80px;
    height: 80px;
    border-radius: 4px;
    text-align: center;
    line-height: 72px;
    color: #e5e5e5;
    float: left;
    margin-right: 5px;
    margin-bottom: 5px;
}

/*Features Analytics*/
.publicpage .top_banner .banner_flex .text_Side .heading h4 {
    font-weight: 700;
    margin-bottom: 10px;
}

.mtop {
    margin-top: 13%;
}

/*Help Guide*/
.help_guide {
    padding-top: 60px;
    padding-bottom: 60px;
}

.help_guide .tab_list {}

.help_guide .tab_list {}

.help_guide .tab_list .tab_list_ul {
    padding: 0;
    list-style: none;
}

.help_guide .tab_list .tab_list_ul .main_li {
    margin-bottom: 40px;
}

.help_guide .tab_list .tab_list_ul .main_li .main_a {
    color: #707070;
    text-transform: uppercase;
    font-size: 16px;
    font-weight: 700;
}

.help_guide .tab_list .tab_list_ul .main_li .main_a i {
    margin-left: 10px;
}

.help_guide .tab_list .tab_list_ul {}

.help_guide .tab_list .tab_list_ul .sub_ul {
    padding: 0;
    list-style: none;
}

.help_guide .tab_list .tab_list_ul .sub_ul .sub_li {
    margin: 30px 0;
}

.help_guide .tab_list .tab_list_ul .sub_ul .sub_li a {
    color: #028090;
    font-size: 16px;
    font-weight: 600;
}

.help_guide_body .help_guide_content {
    margin-bottom: 50px;
}

.help_guide_body .help_guide_content h2 {
    font-weight: 900;
    font-size: 26px;
    margin-bottom: 20px;
    line-height: 36px;
}

.help_guide_body .help_guide_content p {
    line-height: 32px;
    font-size: 18px;
}

.help_bnr {
    margin-top: 30px;
}

.help_bnr img {
    width: 100%;
}

.help_tip {
    display: flex;
    align-items: center;
    background: rgba(2, 128, 144, 0.04);
    border: 1px solid #A9A9A9;
    border-radius: 5px;
    padding: 20px;
    margin-top: 30px;
}

.help_tip .tip_icon {
    margin-right: 20px;
}

.help_tip .tip_icon img {
    width: 40px;
}

.help_tip .tip_text {
    font-size: 16px;
    font-weight: 600;
    color: #707070;
    line-height: 30px;
}

/*Work Tutorial*/
.tutorial_body {
    margin-top: 70px;
}

.tutorial_body h3 {
    font-size: 20px;
    font-weight: 900;
    line-height: 36px;
    padding-bottom: 20px;
}

.tutorial_body p {
    font-size: 18px;
    line-height: 36px;
}

.tutorial_video {
    padding-top: 30px;
}

.tutorial_video img {
    width: 100%;
}

.tutorial_content {
    margin-bottom: 100px;
}

.publicpage .supoort_form .support_box .support_feild textarea {
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
}


/*walkthrough Popup*/
.walkthrough_popup.popup1 .popup_container {
    transition: all 0.3s ease-in-out;
    transform: scale(1.3);
    position: fixed;
    z-index: 6;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(21, 17, 17, 0.61);
    display: flex;
    align-items: center;
}

.walkthrough_popup.popup2 .popup_container {
    transition: all 0.3s ease-in-out;
    transform: scale(1.3);
    position: fixed;
    z-index: 6;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(21, 17, 17, 0.61);
    display: flex;
    align-items: center;
}

.walkthrough_popup.popup3 .popup_container {
    transition: all 0.3s ease-in-out;
    transform: scale(1.3);
    position: fixed;
    z-index: 6;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(21, 17, 17, 0.61);
    display: flex;
    align-items: center;
}

.walkthrough_popup .popup_container .popup_content {
    background-color: #fefefe;
    margin: auto;
    padding: 30px;
    border: 1px solid #888;
    width: 50%;
    min-height: 586px;
    border-radius: 20px;
}

.walkthrough_popup .popup_container .popup_content a.close {
    color: #aaaaaa;
    float: left;
    font-size: 28px;
    font-weight: bold;
    background: none;
    padding: 0;
    margin: 0;
    text-decoration: none;
}

.walkthrough_popup .popup_container .popup_content a.close:hover {
    color: #333;
}

.walkthrough_popup .popup_container:target {
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}

.walkthrough_popup .flex_box {
    display: flex;
    align-items: center;
    margin-top: 30px;
    margin-bottom: 30px;
}

.walkthrough_popup .popup_img {
    width: 50%;
    margin-right: 50px;
}

.walkthrough_popup .popup_img img {
    width: 100%;
}

.walkthrough_popup .popup_text {
    width: 50%;
}

.walkthrough_popup .popup_text h3 {
    font-size: 24px;
    font-weight: bold;
}

.walkthrough_popup .popup_text p {
    font-size: 18px;
    line-height: 26px;
    margin-top: 10px;
}

.wrap-btn .btn-primary {
    background: rgba(6, 95, 70, 1);
    border-radius: 5px;
    color: #fff;
    border-color: rgba(6, 95, 70, 1);
    font-weight: bold;
    transition: all 0.3s ease-in-out !important;

}

.wrap-btn .btn-lg {
    padding: 16px 25px;
    font-size: 14px;
}

.wrap-btn .btn-primary:hover {
    background: transparent;
    color: rgba(6, 95, 70, 1);
    border: 1px solid rgba(6, 95, 70, 1);
}

.skip_btn {
    text-align: right;
}

.skip_btn {
    background: rgba(2, 128, 144, 0.08);
    border-radius: 3px;
    border: unset;
    color: rgba(6, 95, 70, 1);
    font-size: 14px;
    font-weight: 600;
    padding: 10px 30px;
}

.skip_btn :hover {
    text-decoration: none;
}


.popup2 .react-multi-email.empty>span[data-placeholder] {
    font-size: 11px;
}

.popup2 .react-multi-email>input {
    font-size: 11px;
}

/* add-new-member */
/* .popup2{text-align:center;    padding: 30px 0;} */
.popup2 .iconimg {
    height: 16px;
    width: 16px;
    border-radius: 50%;
}

.popup2 .InviteBox {
    border-radius: 5px;
    padding: 0;
}

.popup2 .InviteBox .InviteBox-List {
    background: #F2F2F2;
    border: 1px solid #CDCDCC;
    display: inline-table;
    padding: 3px 3px;
    border-radius: 3px;
    float: left;
    margin-bottom: 1px;
    margin-right: 10px;
    color: #808080;
}

.popup2 .InviteBox .InviteBox-List span {
    margin-left: 4px;
    margin-right: 5px;
    font-size: 10px;
}


.InviteBox .react-multi-email {
    max-height: 100px;
    overflow: auto;
}

.sr_Class {
    font-size: 9px;
    position: absolute;
    margin-top: -3px;
    left: 40%;
    color: black;
}

/* Image View Previous Button Hide */
.styles-module_prev__KqFRp {
    display: none !important;
}

.styles-module_next__1uQwZ {
    display: none !important;
}

.icon.iconBugCustom img {
    width: 100%;
    padding: 5px 8px;
}

.progress-bar-green {
    background-color: #065F46 !important;
}


.formControlTextarea {
    display: block;
    width: 100%;
    height: 60px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc !important;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
}

/* new style */
.newthemserchbtn {
    background-color: #1c1c1c;
    color: #fff;
}



/* //// css 30/04/2024 //// */

.unilogo {
    display: block;
    /* margin-top: -12px !important; */
    width: 100% !important;
    color: rgba(27, 27, 27, 1) !important;
    font-weight: 700 !important;
    font-size: 28px !important;
    height: 58px !important;
}

.unicon {
    color: rgba(27, 27, 27, 1) !important;
    font-weight: 700 !important;
    font-size: 22px !important;
    margin-top: 10px !important;
    font-family: sans-serif;
}

.mt-08rem {
    margin-top: 0.8rem !important;
}

.nav-fontlink {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #1B1B1B !important;
}

.w-106 {
    width: 106% !important;
}

.text-white {
    color: #fff !important;
}

.img-top-banner {
    margin-top: -40px !important;
    margin-left: 90px !important;
}

.input-email {
    width: 100% !important;
    margin-right: 10px;
    height: 58px !important;
    padding: 6px 12px !important;
    font-size: 14px !important;
    line-height: 1.42857143 !important;
    color: #555 !important;
    background-color: #fff !important;
    background-image: none !important;
    border: 1px solid #ccc !important;
    border-radius: 15px !important;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%) !important;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s !important;
}

.text-black {
    color: #1B1B1B !important;
}

.text-center {
    text-align: center !important;
}

.h1ai {
    font-weight: 700 !important;
    font-size: 72px !important;
    padding-top: 5px !important;
    color: #1B1B1B;
}

.slider-content .h1ai {
    font-weight: 700 !important;
    font-size: 48px !important;
    color: #1B1B1B;
}

.mt-131 {
    margin-top: 131px !important;
}

.pai {
    line-height: 30px !important;
    margin-top: 20px !important;
    font-size: 21px !important;
    color: #707070 !important;
}

.heading-1 {
    width: 70% !important;
    margin: 0 auto !important;
}

.superchange-img {
    width: 100% !important;
}

.px-60 {
    padding-left: 50px !important;
    padding-right: 50px !important;
}

.revenue-p {
    line-height: 43px !important;
    margin-top: 20px !important;
    font-size: 38px !important;
    font-weight: 511 !important;
}

.text-green {
    color: #065F46 !important;
}

.doc-card {
    border-radius: 40px !important;
    border: 1px solid #E1DCDC;
    padding: 25px !important;
    margin-top: 30px !important;
}

.footer-box {
    border-radius: 20px !important;
}

.doc-card2 {
    border-radius: 20px !important;
    border: 1px solid #E1DCDC;
    padding: 20px !important;
    margin-top: 20px !important;
}


.doc-card h3 {
    font-weight: 900;
    font-size: 18px;
}

.doc-card p {
    font-size: 15px;
    line-height: 26px;
    margin-top: 10px;
}

.mb-15 {
    margin-bottom: 15px !important;
}

.mt-80 {
    margin-top: 80px !important;
}


.btn-outlinenew {
    color: #065F46 !important;
    border: 1px solid #065F46 !important;
    border-radius: 3px !important;
    font-size: 12px !important;
    transition: all 0.3s ease-in-out !important;
    border-radius: 15px !important;
}

.publicpage .btn:focus {
    color: #065F46 !important;

}

/* .btn-outlinenew:hover {
    background: #065F46 !important;
    color: #fff !important;
} */

.faq-icon {
    margin-right: 5px !important;
    margin-top: -3px !important;
}


.accordion {
    width: 50% !important;
}

.accordion-item {
    background: #f9f9f9 !important;
    margin-bottom: 10px !important;
    border: none !important;
}

.accordion-button {
    background: #f1f1f1 !important;
    color: #444 !important;
    cursor: pointer !important;
    padding: 18px !important;
    width: 100% !important;
    border: none !important;
    text-align: left !important;
    outline: none !important;
    font-size: 15px !important;
    transition: background-color 0.6s ease !important;
    border-radius: 40px !important;
}

.accordion-button:hover,
.accordion-button.active {
    background-color: #ccc !important;
}

.accordion-content {
    padding: 0 18px !important;
    display: none !important;
    overflow: hidden !important;
    background-color: white !important;
    transition: max-height 0.2s ease-out !important;
}

.accordion-content.active {
    display: block !important;
}

.accordion-content p {
    font-size: 15px !important;
    line-height: 26px !important;
    margin-top: 10px !important;
}

.accordion-content h3 {
    font-weight: 900 !important;
    font-size: 18px !important;
}

.accordion-content a {
    color: #065F46 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
}

.accordion-content a:hover {
    text-decoration: underline !important;
}

.accordion-content ul {
    list-style: none !important;
    padding: 0 !important;
}

.accordion-content ul li {
    font-size: 15px !important;
    line-height: 26px !important;
    margin-top: 10px !important;
}


.doc-name h3 {
    font-weight: 900 !important;
    font-size: 18px !important;
}


.doc-name p {
    font-size: 11px !important;
    line-height: 14px !important;
    margin-top: 2px !important;
}

.ms-5 {
    margin-left: 10px !important;
}

.w-48 {
    width: 48% !important;
}

.w-100 {
    width: 100% !important;
}

/* Additional CSS for card consistency */
.doc-card2 {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 20px;
    background-color: #fff;
    transition: box-shadow 0.3s ease;
    min-height: 400px;
}

.doc-card2:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.doc-card2 h3 {
    font-size: 18px !important;
    font-weight: 700 !important;
    margin-bottom: 10px !important;
}

.card-desc {
    margin-top: 10px;
}

.card-desc small {
    color: #999;
}

.readmore {
    text-align: left;
    position: absolute;
    bottom: 25px;
}

.readmore a {
    /* color: #007bff; */
    text-decoration: none;
}

.readmore a:hover {
    text-decoration: underline;
}


.container {
    width: 90%;
    max-width: 1000px;
    text-align: center;
}



.get-started,
.join-us {
    padding: 10px 20px;
    margin: 10px;
    border: none;
    border-radius: 5px;
    background-color: #4CAF50;
    color: white;
    cursor: pointer;
}

.join-us {
    background-color: transparent;
    border: 1px solid #4CAF50;
}

.navigation {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.nav-section {
    text-align: left;
}

.nav-section h4 {
    margin-bottom: 10px;
}

.nav-section ul {
    list-style-type: none;
}

.nav-section li {
    margin-bottom: 2px;
    color: #c4c8cb;
}

.footer {
    font-size: 0.75rem;
    opacity: 0.6;
}

@media (max-width: 768px) {
    .navigation {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        flex-wrap: wrap;
        align-items: flex-start;
        align-content: flex-start;
    }

    .nav-section {
        margin-bottom: 20px;
    }
}

.footer-box {
    border-radius: 40px !important;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1) !important;

    margin-top: 20px !important;
    background-color: black !important;
    color: white !important;
}

.footer-box .footer-box-detail {
    border-radius: 40px !important;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1) !important;
    padding: 30px !important;

    background-color: black !important;
    color: white !important;
}

.footer-box .footer-box-detail .fitem {
    color: #999 !important;
    padding: 5px 0px;
    display: inline-block;
    font-size: 13px;
}

.footer-box-detail ul,
li {
    color: #999 !important;
    font-size: 13px;
}

.navbar-right {
    float: right !important;
    margin-right: 15px !important;
}

.company-logos {
    display: flex;
    align-items: center;
    gap: 50px;
    justify-content: center;
    width: 60%;
    margin: 0 auto;
}


.top-imageposition {
    position: absolute;
    margin-top: 37px !important;
}


.mt-35 {
    margin-top: 35px !important;
}

.mt-20 {
    margin-top: 20px !important;
}

.mt-50 {
    margin-top: 50px !important;
}

.card-mt-50 {
    margin-top: 50px !important;
}

.card-minus-50 {
    margin-top: -50px !important;
}

.glyphicon {
    position: absolute !important;
    top: 14px !important;
    cursor: pointer;
}

.navbar-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu-panel-dflex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky !important;
    border-radius: 10px 0px 0px;
    z-index: 2;
}

.page-heading-mytask {
    font-size: 22px;
    font-weight: bold;
    font-family: "Mulish", sans-serif;

}


.tab-live {
    align-items: center;
    color: #707070;
    font-size: 14px;
}

.mb-8px {
    margin-bottom: 8px !important;
}

.tab-live.active {
    font-weight: bold;
    color: #1D4F3A;
    text-decoration: underline !important;
    text-underline-offset: 5px !important;
    /* Adjust the space as needed */
    padding-bottom: 2px;
    text-decoration-thickness: 1px !important;
}



.me-20 {
    margin-right: 20px !important;
}


.hr-seprator {
    border-top: solid 1px #282828 !important;
}



.show-in-mob {
    display: none !important;
}

.hide-in-mob {
    display: block !important;
}

.icon-cross {

    font-size: 15px;
    color: #888;

}

.update-task-bt {
    text-align: left;
    position: absolute;
    bottom: 10px;
    right: 80px;
    display: flex;
}
.update-meeting-bt {
    text-align: left;
    position: absolute;
    bottom: 10px;
    right: 22px;
    display: flex;
}

.new-btn {
    border-radius: 50px !important;
    padding: 10px 40px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #fff !important;
    background-color: #1D4F3A !important;
    border: none !important;
    cursor: pointer !important;
    border: 1px solid #1D4F3A !important;

}

.new-btn:hover {
    background: #fff !important;
    color: #1D4F3A !important;
    border: 1px solid #1D4F3A !important;
}

.cancel-new-btn {
    border-radius: 50px !important;
    padding: 10px 50px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #808080 !important;
    background-color: #fff !important;
    border: 1px solid #E4E4E4 !important;
    cursor: pointer !important;
    transition: all 0.3s ease-in-out !important;
}

.modal-footer {
    padding: 10px !important;
    text-align: right !important;
    border-top: 1px solid #e5e5e5 !important;
    background: #FAFAFA !important;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;

}

.width-900 {
    width: 800px !important;
}

.right-100 {
    right: 100px !important;
}

.padding-left-30 {
    padding-left: 30px !important;
}


.listview {
    position: relative !important;

    width: 80% !important;
}




/* ///---- 27/05/2024 ----/// */
.imgbox {
    position: relative;
    display: inline-block;
}

.taskBox {
    position: relative;
}

.position-3dot {
    display: none;
    position: absolute;
    top: 11px;
    right: 16px;
    padding: 5px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    text-align: center;
    margin-top: 7px;

}

.position-3dot:hover {
    position: absolute;
    top: 11px;
    right: 16px;
    background-color: #E7E7E7;
    padding: 5px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    text-align: center;
    margin-top: 7px;
    cursor: pointer;
}

.dropdown-menu1 {
    display: none;
    position: absolute;
    background-color: white;

    z-index: 1;
    margin-top: 20px;
    right: 0px;
    top: 18px;
    min-width: 140px;
    flex-wrap: wrap;
    border-radius: 20px;
}

.taskBox:hover .position-3dot {
    display: block;
}

.position-3dot:hover .dropdown-menu1 {
    display: block;
    border-radius: 20px;
}

.dropdown-menu1:before {

    background: #fff;

    border-radius: .2rem;

    bottom: 100%;

    content: "";

    display: block;

    height: 16px;

    right: 3rem;

    position: absolute;

    transform: rotate(-45deg) translateY(1rem);

    width: 16px;

    z-index: -5;

    border: solid 1px #E4E4E4;

    border-left-color: #fff;

    border-bottom-color: #fff;

}

.dropdown-item {
    padding: 8px 16px;
    text-decoration: none;
    display: block;

}

.dropdown-item:hover {

    color: #FF0000;
}


.text-red {
    color: #DE5353 !important;
}

.text-gray {
    color: #808080 !important;
}

.w-90 {
    width: 90% !important;
}


/* Style for the slider */
.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 8px;
    border-radius: 5px;
    background: linear-gradient(to right, #1D4F3A 0%, #1D4F3A var(--value), #d3d3d3 var(--value), #d3d3d3 100%);
    outline: none;
    opacity: 1;
    transition: opacity .15s ease-in-out;
}

/* Custom thumb style */
.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #4CAF50;
    cursor: pointer;
}

.slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #4CAF50;
    cursor: pointer;
}



/* 
  //// comment ///// */

.comment-container {
    display: flex;
    /* align-items: flex-start; */
    /* padding: 10px; */
    /* background: #f9f9f9; */
    /* border-radius: 8px; */
    margin-bottom: 10px;
    max-width: 600px;
    /* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); */
}

.img-divcom {
    margin-right: 10px;
}

.user-pic {
    width: 30px;
    height: 30px;
    border-radius: 50%;
}

.user-blank {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #bdbdbd;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.comment-div-content {
    flex-grow: 1;
    position: relative;
    background: #F0F0F0;
    border: 2px solid #EEEEEE;
    border-radius: 20px;
    padding: 10px;
    min-height: 96px;
    max-height: none;
    /* Ensure max-height is not restricting the content */
    /* overflow: hidden; Prevent scrolling */
}

.comment-author {
    font-weight: bold;
    color: #1D4F3A;
    margin-right: 10px;
    display: inline-block;
}

.comment-date {
    display: block;
    font-size: 10px;
    color: #808080;
    margin-top: 5px;
}

.comment-text {
    margin: 5px 0;
    font-size: 14px;
    color: #101010;
}

.position-absolute-icon {
    position: absolute !important;
    right: 0;
    top: -12px;
}

.dropdown-toggle img {
    width: 33px;
    height: 32px;
}

.dropdown-menu {
    position: absolute;
    top: 20px;
    right: 0;
    display: none;
    background-color: white;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    z-index: 1;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-menu li {
    list-style: none;
    padding: 5px 10px;
}

.dropdown-menu li a {
    text-decoration: none;
    color: #000;
    cursor: pointer;
}

.dropdown-menu li a:hover {
    background-color: #f0f0f0;
}

.dp-siz {
    border-radius: 20px !important;
    width: 10px;
    left: 29px !important;
}


/* /// chat bot //// */
/* src/Chatbot.css */
.chatbot-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1000;
}

.react-chatbot-kit-chat-bot-message .add-member-btn {
    margin-bottom: 10px;
    display: block;
}

.chatbot-toggle-button {
    color: white;
    border: none;
    border-radius: 5px;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 16px;
}


.chatbot-window {
    position: fixed;
    bottom: 3px;
    right: 2px;
    width: 25%;
    border-radius: 5px;
    overflow: hidden;
    background-color: #FAFAFA;
    /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); */
    height: calc(100vh - 132px) !important;

}

.chatbot-window-team {
    position: fixed;
    bottom: 3px;
    right: 2px;
    width: 25%;
    /* border: 1px solid #ccc; */
    border-radius: 5px;
    overflow: hidden;
    background-color: white;
    /* box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); */
    height: calc(100vh - 198px) !important;

}



.react-chatbot-kit-chat-btn-send {
    background-color: #fff !important;
    width: 36px !important;
    border: none !important;
    color: #fff;
    border-bottom-right-radius: 5px;
    height: 36px !important;
    position: absolute !important;
    bottom: 0 !important;
    right: 0 !important;
}

.react-chatbot-kit-chat-btn-send-icon {
    fill: #707070 !important;
}

.botisopen {
    margin: 0 40px !important;
    width: 68% !important;
}


.react-chatbot-kit-chat-container {
    width: 100% !important;
    height: 100% !important;
}

.react-chatbot-kit-chat-message-container {
    height: 90% !important;
}


.react-chatbot-kit-chat-inner-container {
    height: 100% !important;
}

.react-chatbot-kit-chat-bot-avatar-container {
    display: none !important;
}




.react-chatbot-kit-chat-bot-message {
    background-color: #ffffff !important;
    padding: 10px 10px 0px 10px !important;
    border-radius: 5px 20px 20px 20px !important;
    font-size: 15px !important;
    color: #000 !important;
    font-weight: medium !important;
    position: relative !important;
    width: 80% !important;
    margin-left: 16px !important;
    text-align: left !important;
    border: 1px solid #EEEEEE !important;
    margin-top: 12px;
}


.react-chatbot-kit-chat-bot-message-arrow {
    display: none !important;
}


.react-chatbot-kit-chat-message-container {
    background: #FAFAFA !important;
}


.react-chatbot-kit-user-avatar-container {
    display: none !important;
}

.react-chatbot-kit-user-chat-message {
    background-color: #EDF3F4 !important;
    padding: 10px 10px 0px 10px !important;
    border-radius: 20px 5px 20px 20px !important;
    font-size: 15px !important;
    color: #1D4F3A !important;
    font-weight: medium !important;
    position: relative !important;
    text-align: left !important;
    width: 80% !important;
    border: 1px solid #CFE5E8 !important;
    right: -55px !important;
    margin-top: 12px;
}

.react-chatbot-kit-user-chat-message h6 {
    color: #999 !important;
    font-size: 10px;
    margin-top: 2px;
}

.react-chatbot-kit-user-chat-message-arrow {
    display: none !important;
}

.react-chatbot-kit-chat-input {
    width: 100%;
    padding: 12.5px;
    border: none;
    font-size: 16px !important;
    border-top: 1px solid #d8d8d8;
    border-bottom-left-radius: 5px;
    height: 68px;
}

.react-chatbot-kit-chat-header {
    display: flex;
    justify-content: space-between !important;
    padding: 9px 20px !important;
    /* margin-top: 2px; */
    background: #F1F3F2 !important;
    color: #000 !important;
    font-size: 18px !important;
    font-weight: 600 !important;
    border-top-left-radius: 5px !important;
    border-top-right-radius: 5px !important;
}


.outer-Container-box {
    width: 100%;
    max-width: 960px;
    margin: auto;
}

.w-40-h-40 {
    width: 40% !important;
    height: 40% !important;
}

/* /// calender css /// */

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #2f4f4f;
    color: #ffffff;
    padding: 10px 20px;
}

.nav-button {
    background: none;
    border: none;
    color: #ffffff;
    font-size: 20px;
    cursor: pointer;
}

.calendar-dates {
    display: flex;
    justify-content: space-around;
    width: 100%;
}

.date-box {
    text-align: center;
}

.date-box.active {
    background-color: #8fbc8f;
    border-radius: 5px;
    padding: 5px;
}

.tskcalviewTasks {
    /* padding: 20px; */
    flex: 1;
}

.tasks-list {
    display: flex;
    flex-direction: column;
}

.task-item {
    display: flex;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.task-item:last-child {
    border-bottom: none;
}

.task-item input[type="checkbox"] {
    margin-right: 10px;
}

.task-item label {
    flex-grow: 1;
    font-size: 16px;
    cursor: pointer;
}


/* /////// rakesh css 01/06/2024 ////// */

/* /// rakesh css end /// */

.mt-0 {
    margin-top: 0 !important;
}

.twotopbar {
    list-style-type: none !important;
    float: left !important;
    margin-left: 2px !important;
    /* margin-right: 20px !important; */
    /* padding-top: 20px !important; */

}

.twotopbarlia {
    font-weight: 500 !important;
    font-size: 18px !important;
    color: #808080;
    height: 40px !important;
    display: inline-block !important;
}

.ml-3 {
    margin-left: 3px !important;
}

.topbartwocenter {
    display: flex !important;
    /* flex-direction: row; */
    align-items: center !important;
    /* margin-top: -13px !important; */
    margin-left: 20px;

}

.mt-minus-10 {
    margin-top: -10px !important;
}

.top-26 {
    margin-top: 26px !important;
}

.top-26 :hover {
    margin-top: 26px !important;
}

.viewtask {
    font-size: 13px !important;
    font-weight: 501 !important;
    color: #1D4F3A !important;
    cursor: pointer !important;
    padding-top: 2px;
}


#date-carousel .days {
    background-color: #1D4F3A;
    color: #ffffff;
}

.head4 {
    color: #1D4F3A;
}

/* ///  calender css  /// */

.cal-dropdown {
    cursor: pointer;
    top: 26px;
    position: absolute;
    background-color: #f9f9f9;
    /* max-width: 130px; */
    padding: 5px;
    border-radius: 50px;
    /* box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2); */
    z-index: 1;
    font-size: 15px;
    color: #707070;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    padding-left: 20px !important;
    padding-right: 20px !important;
    border: solid 1px #E4E4E4;
}

/* .cal-dropdown:hover .fa-chevron-down{
    transform: rotate(180deg);
        transition: transform 0.3s ease;
    } */

.w-35-h-35 {
    width: 35% !important;
    height: 35% !important;
}

.selected-date {
    font-size: 13px !important;
}


.custom-dropdown-item {
    padding: 4px 10px;
    display: block;
    color: black;
    text-decoration: none;
}

/* .custom-dropdown-item:hover {
    background-color: #f1f1f1;
  } */

.custom-text-gray {
    color: gray;
}

.custom-text-red {
    color: #DE5353;
}

.custom-text-red:hover {
    color: #ad2929;
}

.text-red:hover {
    color: #cf1414 !important;
}

.custom-position-3dot {
    cursor: pointer;
}

.dropdown-menu-team {
    position: absolute;
    top: 100%;
    /* Position below the user item */
    left: 0;
    background-color: white;
    border: 1px solid #ccc;
    box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    /* Ensure it is above other content */
}

.dropdown-menu-team p {
    margin: 0;
    padding: 8px 16px;
    cursor: pointer;
}

.dropdown-menu-team p:hover {
    background-color: #f1f1f1;
}


.hover-dot-img {
    width: 22% !important;
    position: absolute;
    bottom: 80px;
    right: 42px;
}

.cal-icon {
    font-size: 30px !important;
    padding-top: 5px !important;
    border: none !important;
}


.menu-panel-dflex-second {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.d-flex-justify-end {
    display: flex;
    justify-content: flex-end;
}

.d-flex-space-between {
    display: flex;
    justify-content: space-between;
}

.d-flex-justify-center {
    display: flex;
    justify-content: center;
}

.w-22 {
    width: 20% !important;
}

.p-20 {
    padding: 20px !important;
}

.actbtn {
    background: #F1F3F2;
    border-radius: 10px;
    padding: 20px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}

/* 04-06-2024 */
.team-member-new {
    display: flex;
    flex-wrap: wrap;
}

.dropdown-for-right-side {
    top: 34px;
    left: -114px;
}

.meetings-button-new {
    display: flex;
    margin-top: 300px;
    justify-content: center;
    position: absolute;
    bottom: 23px;
    text-align: center;
    margin: 0 auto;
    width: 207px;
}

.btn-primary {
    color: #fff;
    background-color: #1D4F3A;
    border-color: #2e6da4;
}

.startDateAndTime {
    display: flex;
    justify-content: space-between;
}

/* 17-06-2024 by rakesh*/
.imgboxTask {
    position: relative;
    display: inline-block;
}

.imgboxTask .dropdown-menu {
    display: none;
    position: absolute;
    background-color: white;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.imgboxTask:hover .dropdown-menu {
    display: block;
}

.imgboxTask .dropdown-menu a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.imgboxTask .dropdown-menu a:hover {
    background-color: #ddd;
}

.user-blank {
    position: relative;
    display: inline-block;
    width: 32px;
    height: 32px;
    background-color: #1D4F3A;
    border-radius: 50%;
    text-align: center;
    line-height: 34px;
    font-size: 13px;
    color: white;
}

.user-blank .dropdown-menu {
    display: none;
    position: absolute;
    background-color: white;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.user-blank:hover .dropdown-menu {
    display: block;
}

.user-blank .dropdown-menu a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

.user-blank .dropdown-menu a:hover {
    background-color: #ddd;
}

.user-blank-content {
    display: inline-block;
    width: 100%;
    height: 100%;
    /* vertical-align: text-top;    */
}

.marked-day::after {
    content: '';
    display: block;
    margin: 0 auto;
    height: 4px;
    width: 4px;
    background-color: #F4BA76;
    border-radius: 50%;
    /* margin-top: 4px; */
}

.selected-day {
    background-color: rgba(110, 132, 117, 0.3);
}

.btn-save {
    color: #fff !important;
    background-color: #065F46 !important;
    border-color: #065F46 !important;
    border-radius: 20px !important;
    padding: 8px 25px 8px 25px !important;
    min-width: 100px !important;
}

.btn-cancel {
    color: #808080 !important;
    background-color: #fff !important;
    border-color: #808080 !important;
    border-radius: 20px !important;
    padding: 8px 25px 8px 25px !important;
    min-width: 100px !important;
}

.btn-team-header {
    color: #808080 !important;
    background-color: #fff !important;
    border-color: #808080 !important;
    border-radius: 20px !important;
    padding: 8px 25px 8px 25px !important;
    min-width: 100px !important;
}

.btn-team-header-active {
    color: #fff !important;
    background-color: #065F46 !important;
    border-color: #065F46 !important;
    border-radius: 20px !important;
    padding: 8px 25px 8px 25px !important;
    min-width: 100px !important;
}


.btn-remove {
    color: #fff !important;
    background-color: #DE5353 !important;
    border-color: #DE5353 !important;
    border-radius: 30px !important;
    padding: 10px 40px 10px 40px !important;
    min-width: 100px !important;
    margin-left: 8px;
    font-size: 16px !important;
}

.del-meet .btn-remove:hover {
    color: #fff !important;
    background-color: #ca3838 !important;
}

/* implement hovering effect */
.del-meet .btn-save:hover {
    color: #065F46 !important;
    background-color: #fff !important;
    border-color: #065F46 !important;
}

.btn-team-header:hover {
    color: #fff !important;
    background-color: #065F46 !important;
    border-color: #065F46 !important;
}

.btn-remove:hover {
    color: #fff !important;
    background-color: #FF0000 !important;
    border-color: #FF0000 !important;
}

.teamtaskProfileImage {
    display: flex;
    align-items: center;
    border: solid 1px #1D4F3A;
    border-radius: 20px;
    padding: 2px 10px 2px 10px;
    display: inline-flex;
    cursor: pointer;

}

.teamtaskProfileImage2 {
    display: flex;
    align-items: center;
    border: solid 1px #1D4F3A;
    border-radius: 20px;
    padding: 4px 0px 4px 6px;
    display: inline-flex;
    cursor: pointer;
    background-color: #dae2e7 !important;

}

.teamTaskUserImage {
    width: 32px;
    height: 32px;
    text-align: center;
    line-height: 32px;
    border-radius: 100%;
    background: #1D4F3A;
    color: white;
    font-size: 12px;
    display: inline-block;
}

.modal-footerWithRadius {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
    border-bottom-left-radius: 20px !important;
    border-bottom-right-radius: 20px;
}

.plus-icon {
    width: 16px;
    position: relative;
    top: 8px;
}

.taskRightcol .plus-icon {
    width: 16px;
    position: relative;
    top: -16px; 
}

.taskRightcol .meeting-plus-icon {

    top: -16px !important;

}

.taskRightcol input {
    border: none;
}


.audio-mic {
    position: absolute;
    bottom: 35px;
    right: 10px;
    display: flex;
}

/* .blinking-wave {
    width: 20px;
    height: 20px;
    background-color: #1D4F3A;
    border-radius: 50%;
    animation: blink 1s infinite;
  }

  @keyframes blink {
    0% { opacity: 1; }
    50% { opacity: 0.5; }
    100% { opacity: 1; }
  } */

@keyframes blink {
    0% {
        opacity: 0.2;
    }

    20% {
        opacity: 1;
    }

    100% {
        opacity: 0.2;
    }
}

.blinking-wave {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
}

.blinking-wave span {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin: 0 2px;
    background-color: #1D4F3A;
    border-radius: 50%;
    animation: blink 1.4s infinite both;
}

.blinking-wave span:nth-child(1) {
    animation-delay: 0s;
}

.blinking-wave span:nth-child(2) {
    animation-delay: 0.2s;
}

.blinking-wave span:nth-child(3) {
    animation-delay: 0.4s;
}

@keyframes wave {

    0%,
    100% {
        height: 8px;
    }

    50% {
        height: 20px;
    }
}

.wave {
    display: flex;
    align-items: center;
}

.wave span {
    display: inline-block;
    width: 3px;
    height: 4px;
    background-color: #1D4F3A;
    margin: 0 1px;
    animation: wave 1s infinite;
}

.wave span:nth-child(1) {
    animation-delay: 0s;
}

.wave span:nth-child(2) {
    animation-delay: 0.2s;
}

.wave span:nth-child(3) {
    animation-delay: 0.4s;
}

.wave span:nth-child(4) {
    animation-delay: 0.6s;
}

.wave span:nth-child(5) {
    animation-delay: 0.8s;
}

.sound-wave {
    height: 20px;
    width: 70px;
}

.sound-wave canvas {
    background-color: #FF4081;
    /* Change the background color */
    stroke: #101010;
    /* Change the stroke color */
}

.chatbot-preview-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1;
}

.chatbot-toggle-button {
    cursor: pointer;
}

.chatbot-toggle-button-icon {
    width: 100px;
    height: 100px;
}

.chat-container {
    flex: 1;
    padding: 10px;
    overflow-y: auto;
}

.input-container {
    position: absolute;
    bottom: 0;
    width: 100%;
    display: flex;
    background-color: #FAFAFA;
    border: none !important;
    padding: 10px;
}

.input-container textarea {
    flex: 1;
    padding: 10px 41px 10px 20px !important;
    /* border-radius: 5px; */
    height: 84px;
    border: 1px solid #E4E4E4 !important;
    border-radius: 20px;
    background: #F6F6F6;
    /* border-top: solid 1px #ccc; */
}



.input-container button {
    padding: 10px 20px;
    border: none;
    background-color: #007bff;
    color: white;
    border-radius: 5px;
    cursor: pointer;
}

.send-chat-icon {
    position: absolute;
    right: 25px;
    bottom: 25px;
    cursor: pointer;
    width: 20px;
    cursor: pointer;
}

.audio-record-icon {
    position: absolute;
    right: 22px;
    bottom: 56px;
    width: 30.2px;
    cursor: pointer;
}

.audio-delete-icon {

    width: 30.2px;
    cursor: pointer;
}

.audio-tooltip-container {

    display: inline-block;
    cursor: pointer;

}

.audio-tooltip-container .tooltip-text {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 10px;
    position: absolute;
    z-index: 1;
    top: -40px;
    transform: translateX(-100%);
    opacity: 0;
    transition: opacity 0.3s;
    width: 200px;
}

.audio-tooltip-container .tooltip-text::after {
    content: '';
    position: absolute;
    bottom: -17%;
    right: 10px;
    transform: translateX(-100%);
    border-width: 5px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
}

.audio-tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

/* stop .recording-con */
.audio-stop-tooltip-container {

    display: inline-block;
    cursor: pointer;

}

.audio-stop-tooltip-container .tooltip-text {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 10px;
    position: absolute;
    z-index: 1;
    top: -41px;
    transform: translateX(-100%);
    opacity: 0;
    transition: opacity 0.3s;
    width: 200px;
}

.audio-stop-tooltip-container .tooltip-text::after {
    content: '';
    position: absolute;
    bottom: -17%;
    right: 10px;
    transform: translateX(-100%);
    border-width: 5px;
    border-style: solid;
    border-color: #000 transparent transparent transparent;
}

.audio-stop-tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}

.audio-send-icon {
    position: absolute;
    display: flex;
    right: 16px;
    bottom: 16px;
}

.recording-indicator {
    position: absolute;
    left: 30px;
    bottom: 61px;
}

.chat-box-container {
    height: calc(100vh - 299px) !important;
    overflow: scroll;
    padding-bottom: 7px;
    overflow-x: hidden;
    background-color: #FAFAFA;
}

/* .chat-box-container-team {
    height: 48vh;
    overflow: scroll;
    padding-bottom: 7px;
    overflow-x: auto;
} */

.chat-box-container-team {
    overflow: scroll;
    padding-bottom: 7px;
    overflow-x: auto;
    height: calc(100vh - 362px) !important;
    background-color: #FAFAFA;
}

.notify-message-on-chatbot {
    position: absolute;
    right: 43px;
    bottom: 80px;
    /* border: solid 5px; */
    background-color: red;
    border-radius: 100%;
    height: 20px;
    width: auto;
    font-size: 12px;
    padding: 2px 4px !important;
}

.model-new-design {
    text-align: center;

}

.profile-inviteeCount {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    margin-right: 15px;
}

.more-invitee-count {
    height: 30px;
    width: 30px;
    border: solid 1px;
    background-color: #EDF3F4 !important;
    color: #1D4F3A !important;
    border-radius: 100%;
    /* padding: 6px; */
    padding-top: 6px;
    text-align: center;
    position: relative;
    font-size: 12px;
    font-weight: 900;
}

.text-modal {
    padding: 4px 19px;
}

.text-align-center {
    text-align: center;
}

.react-chatbot-kit-chat-bot-message .bell-icon {
    position: absolute;
    display: flex;
    align-items: center;
    top: 10px;
    right: -48px;
}

.react-chatbot-kit-chat-bot-message .bell-icon img {
    width: 36px;
}

.react-chatbot-kit-chat-bot-message h6 {
    color: #999 !important;
    font-size: 10px;
    margin-top: 2px;
}



.chat-bot-audio {
    height: 20px;
    width: 240px;
}

.engagement-survey-point {
    display: flex;
    margin-top: 10px;
    justify-content: space-between;
    margin-bottom: 10px;
}

.engagement-survey-point span {
    border: solid 1px #D3E9EB;
    background: #F2F9F9 !important;
    border-radius: 7px;
    color: #1D4F3A;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    width: 42px;
    height: 38px;
    align-items: center;
    justify-content: center;
}

.engagement-survey-point span:hover {

    background: #1D4F3A !important;
    color: #fff;

}

.engagement-survey-point img {
    background: #ffdc57;
    overflow: hidden;
    width: 28px;
    height: 28px;
    border-radius: 100%;
    margin-right: 10px;
    cursor: pointer;
}

.engagement-survey-value {
    display: flex;
    justify-content: space-between;
    margin-top: 5px;
}

.engagement-survey-value span {
    font-size: 12px;
    cursor: pointer;
}

.happiness-survey-res-message {
    border: solid 1px #D3E9EB;
    padding: 10px 15px;
    border-radius: 12px;
    display: inline-block;
    background-color: #F2F9F9 !important;
    margin-top: 5px;
    font-size: 12px;
    margin-bottom: 10px;
}

.marked-selected-day {
    background-color: rgba(110, 132, 117, 0.3);
}

a {
    cursor: pointer !important;
}

.task-list-cart-tree-dot {
    position: absolute;
    right: 3px;
    top: 5px;
}

.task-meeting-join-btn-active {
    color: #fff !important;
    border: none;
    background-color: #1D4F3A !important;
    padding: 8px 15px;
    font-size: 14px;
    /* border-color: #808080 !important; */
    border-radius: 15px !important;
    /* padding: 3px 5px 5px 5px !important; */
    min-width: 76px !important;
}

.task-meeting-join-btn-active img {
    filter: brightness(0) invert(1) !important;
}

.w-15px {
    width: 15px !important;
}

.task-meeting-not-active-btn {
    color: #808080 !important;
    border: none;
    background-color: #EDF3F4 !important;
    padding: 8px 15px;

    font-size: 14px;
    /* border-color: #808080 !important; */
    border-radius: 15px !important;
    /* padding: 3px 5px 5px 5px !important; */
    min-width: 76px !important;
}


.mb-40 {
    margin-bottom: 40px !important;
}

/* new css by vaibhav 120724 */

.meeting-overview .profile-inviteeCount {
    padding-right: 25px;
}

.activemeeting {
    position: relative;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

.meeting-dtl {
    border-left: 3px solid #C7DBD1;
    border-radius: 5px 0px 0px 5px;
}

.meeting-time {
    display: block !important;
    border: 1px solid !important;
    border-radius: 28px !important;
    /* height: 28px !important; */
    /* margin-left: 15px !important; */
    padding: 2px 12px 1px 12px !important;
    font-size: 12px !important;
    /* margin-bottom: 14px !important; */
    /* margin-top: 10px; */
    width: fit-content !important;
    font-weight: 500 !important;
}

.more-invitee-count-meeting {

    height: 30px;
    width: 30px;
    background: #1D4F3A;
    border-radius: 100%;
    padding: 4px !important;
    text-align: center;
    position: relative;
    right: 15px;
    color: #fff;
    /* font-size: 12px; */

}


.activemeeting:hover .position-3dot-meeting {
    display: block;
    /* Display on hover */
}

.position-3dot-meeting:hover .dropdown-menu1 {
    display: block !important;
    border-radius: 20px !important;
    /* overflow: visible; */
}

.time-label {
    background-color: #f0f4f8;
    border-radius: 12px;
    padding: 5px 10px;
    font-size: 12px;
    color: #333;
}

.meeting-title {
    font-size: 20px !important;
}

.position-3dot-meeting {
    display: none;
    position: absolute;
    /* top: 11px; */
    top: 27%;
    align-items: center;
    right: 5px;
    cursor: pointer;
    /* padding: 14px; */
}

.btn-radius-98 {
    border-radius: 98px !important;
}

.meeting-submit-btn {
    padding: auto !important;
    /* font-size: 20px !important; */
    border-radius: 150px !important;
}

.ms-2 {
    margin-left: 20px !important;
}

.me-1 {
    margin-right: 10px !important;

}


.me-2 {
    margin-right: 20px !important;
}

.mt-2 {
    margin-top: 20px !important;
}

.mt-3 {
    margin-top: 30px !important;
}

.mt-4 {
    margin-top: 40px !important;
}

.mb-2 {
    margin-bottom: 20px !important;
}

.mb-1 {
    margin-bottom: 10px !important;
}

.mb-3 {
    margin-bottom: 30px !important;
}


/* //// meeting css //// */

.bg-none {
    background: none !important;
}

.btn-meeting-type {
    width: 16px !important;
    margin-right: 10px !important;
}

.meeting-virtual-tab {
    border: 1px solid #E4E4E4 !important;
    background: #f2f7f5 !important;
    color: #065F46 !important;

}

.meeting-time-box {
    color: #1D4F3A !important;
    border: 0.5px solid #1D4F3A !important;
    background-color: #f2f8f9 !important;
}

.meeting-time-box-cancel {
    color: #9D5C5C !important;
    border: 0.5px solid #9D5C5C !important;
    background-color: #faf7f7 !important;
}

.br-20 {
    border-radius: 20px !important;
}

.meeting-title-new {
    font-size: 18px !important;
    padding-left: 10px !important;
}

.justify-content-between {
    display: flex;
    justify-content: space-between;
}

.position-3dot-meeting {
    position: relative;
}

.dropdown-menu1 {
    transition: opacity 0.3s ease, transform 0.3s ease;
    display: none;
    position: absolute;
    top: 18px;
    right: -18px;
    background-color: white;
    /* Adjust as needed */
    border: 1px solid #E4E4E4;
    /* Adjust as needed */
    z-index: 1000;
    /* Ensure it's above other content */
    opacity: 1;
}

.position-3dot-meeting:hover .dropdown-menu1 {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

.dropdown-item {
    padding: 10px;
    cursor: pointer;
}

.text-gray:hover {
    color: #101010 !important;
}

/* .dropdown-item:hover {
    color: #1D4F3A !important;
} */

/* 23/07/2024 */
.chatBotCancel-icon {
    height: 15px;
    width: 15px;
    margin-top: 10px;
    cursor: pointer;
}

.react-chatbot-kit-chat-header .kwikbot-head {
    margin-left: 10px;
    color: #101010;
    font-weight: 600;
    font-size: 18px;
}

.mr-10 {
    margin-right: 10px;
}

/* 24-07-2024 */
.close-icon {
    height: 12px;
    width: 12px;
    cursor: pointer;
    margin-left: 12px;
    margin-right: 12px;
}

.team-member-name {
    font-size: 13.5px;
    color: #1D4F3A;
    font-weight: 500;
}

.assignedByMe-checkbox {
    margin-left: 20px;
    color: #1D4F3A;
    font-weight: 600;
}

/* /////////// 24/04/2024 //////////// */

.mt-6px {
    margin-top: 6px !important;
}

.pt-8px {
    padding-top: 8px !important;
}

.pb-8px {
    padding-bottom: 8px !important;
}

.pb-0 {
    padding-bottom: 0px !important;
}

.pt-0 {
    padding-top: 0px !important;
}

.align-iteam-start {
    display: flex !important;
    align-items: start !important;
}

.ms-8px {
    margin-left: 8px !important;
}

.min-height-550 {
    min-height: 500px !important;
}

.px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.mx-0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.min-height-140 {
    min-height: 140px !important;
}

.bottom-20px {
    bottom: 20px !important;
}

.update-popup-position {
    position: relative;
    z-index: 1;
    top: -8px;
    background: #FAFAFA !important;
    width: 36px;
    display: flex !important;
    justify-content: flex-end !important;
    border-top-right-radius: 15px !important;
}

.rightcol-position-2 {
    margin-top: -36px;
}

.taskleftcol .mt-21px {
    margin-top: 12px !important;
}

.taskleftcol .form .form-group {
    margin-bottom: 0px !important;
}

.mt-12px {
    margin-top: 12px !important;
}

.br-25 {
    border-radius: 25px !important;
}

/* .taskpopup .modal-header .ut-icon  :hover{
    cursor: pointer !important;
    background-color: #E7E7E7 !important;
    height: 32px !important;
    width: 32px !important;
    border-radius: 50% !important;
    position: absolute !important;
    top: -11px !important;
    right: -4px !important;
} */

.border-bottom-none {
    border-bottom: none !important;
}

.atta-dp {
    position: absolute !important;
    font-size: 12px !important;
    top: 7px !important;
    right: 12px !important;
    z-index: 1111 !important;

}

/* 26-07-2024 rakesh */
.mt-100 {
    margin-top: 100px !important;
}

.ml-10 {
    margin-left: 10px !important;
}

.calendar-container {
    display: flex;
    flex-direction: row-reverse;
    position: relative;
}

.checkbox-main {
    display: block;
    position: relative;
    padding-left: 30px;
    /* margin-bottom: 15px; */
    cursor: pointer;
    font-size: 15px;
    text-align: center;
    /* margin-top: 5px; */
    font-weight: 500;
    margin-top: 10px;
}

.checkbox-main input[type=checkbox] {
    visibility: hidden;
}

.checkbox-container {
    position: absolute;
    top: 0;
    left: 0;
    height: 18px;
    width: 20px;
    background-color: transparent;
    border: 2px solid #1D4F3A;
    /* border color */
    border-radius: 5px;
    margin-top: 2px;
}

/* Hover effect */
.checkbox-main:hover input~.checkbox-container {
    background-color: #fff;
}

/* Active effect */
.checkbox-main input:active~.checkbox-container {
    background-color: #EDF3F4;
}

/* Checked effect */
.checkbox-main input:checked~.checkbox-container {
    background-color: #1D4F3A !important;
}

/* Checkmark */
.checkbox-container::after {
    content: "";
    position: absolute;
    display: none;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Display checkmark when checked */
.checkbox-main input:checked~.checkbox-container::after {
    display: block;
}

.mx-2 {
    margin-left: 20px !important;
    margin-right: 20px !important;
}

.pt-50 {
    padding-top: 50px !important;
}

.top--10 {
    top: -10px !important;
}

.top--10:hover {
    top: -10px !important;
}

.delete-message {
    padding: 15px 5px 0px 5px;
}

.mr-10 {
    margin-right: 10px !important;
}

.cross-icon {
    text-align: end;
    margin: 10px;
}

.taskBox {
    overflow: visible;
    /* Ensure the dropdown isn't clipped */
}

.bottom-12px {
    bottom: 12px !important;
}

.ms-35px {
    margin-left: 56px !important;
}

.lebl-icon {
    width: 40px !important;
    margin-right: 10px !important;
}

.h-40px {
    height: 40px !important;
}

.input-container audio {
    position: relative;
    /* top: -41px; */
    margin-right: 2px;
}

.react-calendar__tile--hasActive {
    background-color: white !important;
}

.create-taskpage-container {
    padding-left: 55px !important;
    padding: 41.6px;
    height: calc(100vh - 130px);
    overflow-y: scroll;
    /* Allow vertical scrolling */
    overflow-x: hidden;
    /* Hide horizontal scrollbar */
}

/* Hide scrollbar for Chrome, Safari and Opera */
.create-taskpage-container::-webkit-scrollbar {
    display: none;
}


/* Hide scrollbar for IE, Edge and Firefox */
.create-taskpage-container {
    -ms-overflow-style: none;
    /* IE and Edge */
    scrollbar-width: none;
    /* Firefox */
}

.mb-50px {
    margin-bottom: 50px !important;
}

.left-22px {
    left: 22px !important;
}

.d-none {
    display: none !important;
}

.recording-con {
    flex: 1;
    padding: 10px 41px 10px 20px !important;
    /* border-radius: 5px; */
    height: 105px;
    border: 1px solid #E4E4E4 !important;
    border-radius: 20px;
    background: #F6F6F6;

}

.m-0 {
    margin: 0px !important;
}

.mb-10px {
    margin-bottom: 10px !important;
}

.mb-100 {
    margin-bottom: 100px !important;
}

.mt-58px {
    margin-top: 58px !important;
}

.w-123px {
    width: 123px !important;
}

.left-4px {
    left: 4px !important;
}

.w-918px {
    width: 950px !important;
    margin-top: 5px;
    margin: 0 auto;
}

.searchbox-header::-webkit-input-placeholder {
    color: #fafafa !important;
    font-size: 12px !important;
}

.searchbox-header:-moz-placeholder {
    /* Firefox 18- */
    color: #fafafa !important;
    font-size: 12px !important;
}

.searchbox-header::-moz-placeholder {
    /* Firefox 19+ */
    color: #fafafa !important;
    font-size: 12px !important;
}

.searchbox-header:-ms-input-placeholder {
    /* Internet Explorer 10-11 */
    color: #fafafa !important;
    font-size: 12px !important;
}

.searchbox-header::placeholder {
    /* Standard */
    color: #fafafa !important;
    font-size: 12px !important;
}

.seprator {
    border-right: 1px solid #ccc;
    height: 30px;
    margin: 0 10px;
}

.dt-seprator {
    position: relative;
    top: 22px;
}

.mt-21px {
    margin-top: 21px !important;
}

.min-h-662px {
    min-height: 662px !important;
}

.taskRightcol .form-input {
    background-color: #FAFAFA !important;
    padding-right: 10px;
    position: relative;
}

.taskRightcol .form-input::after {
    content: '';
    /* Add this line */
    background-image: url('/images/tasks/down-arrow-gray.svg');
    background-size: contain;
    /* Ensures the image fits inside the box */
    background-repeat: no-repeat;
    /* Prevents the image from repeating */
    position: absolute;
    right: 10px;
    /* Adjust the position based on your design */
    top: 50%;
    /* Vertically centers the arrow */
    transform: translateY(-50%);
    /* Vertically centers the arrow */
    width: 10px;
    height: 10px;
    pointer-events: none;
    /* Ensures the arrow does not interfere with input */
}


.taskpopup .taskRightcol .datedownarrow {
    display: none;
}

.nav-tabs>li>a {
    line-height: 1;
}

/* /// rakesh 02-08-2024 ////// */
.btn-img-meeting {
    color: #1D4F3A !important;
    background-color: #EDF3F4 !important;
    border-color: #D3E9EB !important;
    border-radius: 20px !important;
    padding: 4px 0px 3px 0px !important;
    min-width: 98px !important;
    font-weight: 600 !important;
    font-size: 10px !important;
}

.ml-20px {
    margin-left: 20px !important;
}

/* ////////////// */

.taskleftcol-update {

    padding: 28px 19px 2px 26px !important;

}

.nav-tabs>li>a {
    line-height: 1 !important;
}

.ms-1 {
    margin-left: 4px !important;
}

.task-calendar-icon {
    height: 23px;
    margin-right: 10px;
    width: 24px;
}

.red-icon {
    filter: invert(38%) sepia(82%) saturate(2867%) hue-rotate(334deg) brightness(90%) contrast(97%);
}

.mb-47px {
    margin-bottom: 47px !important;
}

.seperator {
    border-right: 1px solid #ccc;
    height: 20px;
    margin-top: 38px;
}


.attachment-3dot {
    position: absolute;
    display: none;
    top: 10px;
    right: 5px;
    padding: 5px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    text-align: center;
    margin-top: 7px;
    color: #838D88;
}

.attachment-box:hover .attachment-3dot {
    display: block;
}

.attachment-3dot:hover .dropdown-menu1 {
    display: block;
}

.attachment-dropdown-menu {
    padding: 6px 0px;
    top: 11px !important;
    right: -16px !important;
}

.inp-attachment-pot {
    position: relative !important;
    top: -60px !important;
    padding-left: 31px !important;
}

.add-attachment-label {
    font-weight: 500;
}

.comment-3dot:hover {
    position: absolute;
    top: 4px;
    right: 7px;
    background-color: unset;
    padding: 5px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    text-align: center;
    margin-top: 7px;
}

.comment-3dot:hover svg path {
    fill: #838d88;
    display: block;
}

.ut-icon:hover svg path {
    fill: #838d88;
    display: block;
}

.comment-3dot {
    display: none;
    position: absolute;
    top: 4px;
    right: 7px;
    padding: 5px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    text-align: center;
    margin-top: 7px;
}

/* input[type="date"]::-webkit-inner-spin-button, */
input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
    -webkit-appearance: none;
}

.comment-div-content:hover .comment-3dot {
    display: block;
}

.comment-3dot:hover .dropdown-menu1 {
    display: block;
}

.comment-dropdown-menu {
    min-width: 90px !important;
    right: -5px !important;
    line-height: 15px !important;
    border-radius: 15px !important;
    top: 14px !important;
}

.comment-dropdown-menu:before {
    right: 20px !important;
}

.custom-icon {
    font-size: 11px !important;
}

.react-calendar {
    width: 350px;
    max-width: 100%;
    background: white;
    border: 1px solid #a0a096;
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.125em;
    margin-top: 68px !important;
    border-radius: 30px !important;
}

.h-15rem {
    height: 1.5rem !important;
    vertical-align: -0.3em !important;
}

.day-of-month {
    margin-bottom: -4px;
    font-size: 14px;
    color: #f0f4f8;
    width: 30px;
}

.day-of-week {
    font-weight: 200;
    color: #f0f4f8;
    padding-top: 3px;
}

.pd-10px {
    padding: 10px !important;
}

.bg-grey {
    background-color: #FAFBFC !important;
}


.react-calendar__navigation {
    display: flex;
    height: 54px !important;
    margin-bottom: 1em;
    align-items: center;
    padding: 10px;
}

.react-calendar__navigation {
    display: flex;
    height: 44px;
    margin-bottom: 1em;
    background-color: #F1F3F2;
    border-radius: 30px;
}

.react-calendar__navigation button:enabled:hover,
.react-calendar__navigation button:enabled:focus {
    border-radius: 7px;
    margin-left: 10px;
}

.react-calendar__navigation button:enabled,
.react-calendar__navigation button:enabled {
    border-radius: 7px;
    margin-left: 10px;
    margin-right: 10px;
}

.react-calendar__navigation__label:hover {
    background-color: red !important;
}

.react-calendar__navigation button {
    font-size: 28px;
    line-height: unset !important;
    font-weight: 500 !important;
    height: 40px;
    color: #808080;
    font-family: "DM Sans" !important;
}


.react-calendar__navigation__prev-button {
    background-color: #fff !important;

    min-width: 28px !important;
    height: 28px !important;
}

.react-calendar__navigation__next-button:hover {
    background-color: #fff !important;
}

.react-calendar__navigation__next-button {
    background-color: #fff !important;

    min-width: 28px !important;
    height: 28px !important;
}

.react-calendar__navigation__next-button:hover {
    background-color: #fff !important;

}

.react-calendar__navigation__label:hover {
    background-color: unset !important;

}

.meeting-cal-img {
    width: 23px !important;
    height: 23px !important;
    margin-top: 6px !important;
}

.meeting-title-new p {
    float: none !important;
    color: #101010 !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    margin-bottom: 5px !important;
}

.taskBoxmeeting {
    padding: 22px 20px 22px 29px !important;
}

.taskBoxmeeting .position-3dot-meeting-new {
    top: unset !important
}


.position-3dot-meeting-new :hover {
    /* top: 25px !important; */
}

.position-3dot-meeting-new {
    top: 25px !important;
}

.pt-12px {
    padding-top: 12px !important;
}

.pb-12px {
    padding-bottom: 12px !important;
}

.ms-12px {
    margin-left: 12px !important;
}

.fs-12px {
    font-size: 12px !important;
}

.rec-img {
    height: 12px;
    width: 14px;
    margin-left: 5px;
}

.pt-28px {
    padding-top: 28px !important;
}

.meeting-call-dropdown {
    max-height: 200px !important;
    overflow-y: auto !important;
    position: absolute !important;
    top: 23px !important;
}

.pt-7px {
    padding-top: 7px !important;
}

.call-meeting-input {
    border-radius: 18px 10px 0px 0px !important;
}

.new-btn-meeting {
    border-radius: 50px !important;
    padding: 10px 35px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #fff !important;
    background-color: #1D4F3A !important;
    border: none !important;
    cursor: pointer !important;
    border: 1px solid #1D4F3A !important;
    display: flex;
    align-items: center;
    gap: 5px;
}

.new-btn-meeting:hover {
    background: #fff !important;
    color: #1D4F3A !important;
    border: 1px solid #1D4F3A !important;
}

.cancel-new-btn {
    border-radius: 50px !important;
    padding: 10px 40px !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #808080 !important;
    background-color: #fff !important;
    border: 1px solid #E4E4E4 !important;
    cursor: pointer !important;
    transition: all 0.3s ease-in-out !important;
}

.cancel-new-btn:hover {
    border: 1px solid #E4E4E4 !important;
    background-color: #FCFCFC !important;
    color: #808080 !important;
}

.callbymeeting-box {
    padding: 2px 0px 2px 4px !important;
    border: 0.5px solid #E4E4E4 !important;
    border-radius: 20px !important;
    background-color: #f2f8f9 !important;
    color: #1D4F3A !important;
    align-items: center !important;
    width: fit-content;
}

/* .callbymeeting-box img {
    width: 28px !important;
    height: 28px !important;
} */

.callbymeeting-box .user-blank {
    width: 28px !important;
    height: 28px !important;
    line-height: 30px !important;
}

.call-cross {
    width: 15px !important;
    height: 15px !important;
}

.allc img {
    width: 20px !important;
    height: 20px !important;
}

.h-63px {
    min-height: 63px !important;
}

.nav-meeting-link {
    color: #1D4F3A !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    padding: 5px 20px !important;
}

.nav-meeting-link:hover {
    color: #065F46 !important;
}

.fs-16px {
    font-size: 16px !important;
}

.pxy-5-20 {
    padding: 5px 20px !important;
}

.back-icon {
    width: 16px !important;
    height: 16px !important;
    margin-top: -7px !important;
    margin-right: 10px !important;
    cursor: pointer !important;
}

.p-15px {
    padding: 15px !important;
}

.modal-content.heightunsetrec {
    min-height: unset !important;
    width: 376px !important;
    border-radius: 15px !important;
    margin: 0 auto;
}

.rec-heading {
    font-size: 20px !important;
    font-weight: 600 !important;
    font-family: "Mulish", sans-serif !important;
}

.cancelbtn-rec {
    width: 15px;
    margin-top: -5px;
}

.rec-form-select {
    margin-left: 27px !important;
    margin-top: -27px !important;
    width: 104px !important;
}

.rec-select-date {
    margin-left: 27px !important;
    margin-top: -18px !important;
}

.virtual-meeting-body {
    border-bottom: solid 1px #EBEBEB;
    padding: 15px 0px;
    cursor: pointer !important;
}

.virtual-meeting-body .lebl-icon {
    width: 26px !important;
    margin-right: 10px !important;
}

.virtual-meeting-body .metting-row {
    border-bottom: solid 1px #EBEBEB;
    padding: 10px 0px;
}

/* .virtual-meeting-body :hover {
    background-color: #EDF3F4 !important;
} */



/* ///// rakesh 07-08-2024 ////// */
.chat-name-desig {
    display: flex !important;
    flex-direction: column;
    text-align: left;
    align-items: flex-start;
}

.chat-name-desig .name {
    font-size: 14px !important;
    font-weight: 600 !important;
}

.chat-name-desig .desig {
    font-size: 12px !important;
    color: #1D4F3A !important;

}

.user-chat-task-box {
    border-bottom: solid 1px #cccccc70;
    padding: 15px 5px;
    margin-bottom: 20px;
}

.taskChatBox {
    font-size: 14px;
    padding-left: 4px;
    margin-top: 15px;
}

.taskChatBox img {
    width: 24px;
    height: 24px;
    margin-right: 10px;

}

.mr-10 {
    margin-right: 10px;
}

.ps-12px {
    padding-left: 12px !important;
}

.ps-10 {
    padding-left: 10px !important;
}


.team-setting {
    position: relative;
    display: flex;
    /* float: inline-end; */
    flex-direction: row;
    justify-content: flex-end;
    margin-bottom: 13px;

}

.w-13px {
    width: 13px !important;
}

.whitecard-name-designation p {
    color: #838D88 !important;
}

.team-card-separater {
    border-right: 1px solid #ccc;
    height: 30px;
    margin: 0 10px;
}

.separater hr {
    margin-top: 10px !important;
    margin-bottom: 15px !important;
}



.p-25px {
    padding: 25px !important;
}

.team-lable {
    font-size: 13px !important;
    font-weight: 300 !important;
}

.h-30px {
    height: 30px !important;
}

.team-radio {

    color: #000 !important;
    font-size: 14px !important;
}

.border-0 {
    border: 0 !important;
}

.w-40px {
    width: 40px !important;
}

.team-popup-time {
    border: 1px solid #E4E4E4 !important;
    background: #FCFCFC !important;
    border-radius: 25px !important;
    padding: 5px 0px 5px 20px !important;
    color: grey !important;
    font-size: 13px !important;
}

.w-18px {
    width: 18px !important;
}

.mr-5px {
    margin-right: 5px !important;
}

.msg-bar {
    background-color: #1A8E66;
    ;
    border-radius: 20px;
    padding: 0px 20px;
    margin-bottom: 14px;
    color: white;
    font-size: 18px;
    display: flex;
    align-items: center;
    transition: all 2s ease-in;
}

.msg-bar-text {
    flex: 1;
    text-align: left;
    margin-right: 10px;
}

.msg-bar-icon {
    cursor: pointer;
}

.msg-bar-icon img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    padding: 5px;
}

.add-team-img {
    width: 93px !important;
    margin-bottom: 22px !important;
}

.h-470px {
    height: 470px !important;
}

.add-member-team {
    height: 102px;
    margin-bottom: 10px;
}

.member-teamp .meetInvitees {
    background-color: #FFFFFF;
    max-height: 198px;
    overflow-y: auto;
    overflow-x: hidden;
    border-radius: 10px;
    border: 1px solid #E4E4E4;
    padding: 10px 0 0 10px;
}


.member-teamp .Invitees-serch {
    padding-left: 25px;
    background: transparent;
    border-radius: 10px;
    /* box-shadow: none; */
    display: block;
    width: 100%;
    height: 54px;
    padding: 11px 16px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    border: 1px solid #E4E4E4;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.member-teamp .inputBtn {
    display: none;
}

.member-teamp .serchmeetInvitees {
    width: 100%;
    max-height: 198px;
    overflow-x: hidden;
    overflow-y: auto;
    padding-right: 0px;
    margin-top: 10px;
    margin-bottom: 15px;
    background: #FFFFFF;
    border: 1px solid #E4E4E4 !important;
    border-radius: 10px !important;
    padding-left: 0px;
}

.br-15px {
    border-radius: 15px !important;
}

.br-10px {
    border-radius: 10px !important;
}

.mt-33px {
    margin-top: 33px !important;
}

.mt-minus-25px {
    margin-top: -35px !important;
}

.cal-team .react-calendar {
    margin-top: -10px !important;
    right: 0px;
}

.right-minus-5px {
    right: -5px !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.teammodlist {
    background-color: #fff;
    border-radius: 15px;
    display: grid;
}

.team-member-list {
    padding: 15px 20px;
    border-bottom: 1px solid #E4E4E4;
}

.tv-list {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.fs-18px {
    font-size: 18px !important;

}

.viewtask .fs-18px {
    font-size: 13px !important;
}

.t-memberp {
    font-size: 16px;
    color: #838D88;
}

.t-list-name {
    margin-left: 14px !important;
    font-weight: 600 !important;
    color: #101010;
}

.team-member-list .three-dot-team {
    display: none;
    position: absolute !important;
    top: 4px !important;
    /* right: 316px !important; */
    left: -14px !important;
}

.teammodcardlist .three-dot-team:hover svg path {
    fill: #838d88;
    display: block;
}


.team-member-list .custom-dropdown-menu {
    right: auto !important;
}

/* kundan */
.analytic-search-box {
    display: flex;
    gap: 10px;
    border-radius: 30px;
    padding: 2px;
    color: #838D88;
    margin-right: 13px;
}

.analytic-search-box .option-hover {}

.analytic-search-box .option-hover:hover {}

.analytic-search-box select {
    border-radius: 15px;
    padding: 5px 10px;
    background-color: #FAFAFA;
    border: solid 1px #EFEFEF;
}

.analytic-select {
    border: none;
    color: #838D88;
    border-radius: 30px;
}

.border-right-analytic {
    border-right: 1px solid #838D88;
}

.w-35-h-35px {
    width: 35px !important;
    height: 35px !important;
}

.me-6px {
    margin-right: 6px !important;
}

.my-2px {
    margin-top: 2px !important;
    margin-bottom: 2px !important;
}

.analytic-chart-taskbox {
    background: #FFFFFF !important;
    border: 1px solid #E4E4E4 !important;
    height: 370px !important;
    border-radius: 15px !important;

}

.analytic-chart-taskbox .chartbox {
    padding: 0px;
}

.task-Completion-Rate {
    padding: 2px 15px;
    border-radius: 30px;
    border: solid 1px #F5F5F5;
    background-color: #F5F5F5;
    color: #707070;
    min-width: 75px;
    display: inline-block;
    text-align: center;
    font-size: 12px;
}


.pe-0 {
    padding-right: 0px !important;
}

.ps-0 {
    padding-left: 0px !important;
}

.analytic-chart-taskbox .chartbox-title {
    padding: 18px !important;
    background-color: #F1F3F2;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
}

.analytic-chart-taskbox .apexcharts-legend-series {
    cursor: pointer;
    line-height: normal;
    display: flex;
    align-items: flex-start !important;
    flex-direction: column-reverse !important;
    padding: 5px;
    border-radius: 8px;
    background-color: #272B30;
    margin: 4px 3px !important;
    min-width: 50px;
}

.managers-chart-taskbox {
    background: #FFFFFF !important;
    border: 1px solid #E4E4E4 !important;
    height: 370px !important;
    border-radius: 15px !important;
}

.chart-dtl-height {
    height: 320px;
    overflow: auto;
    overflow-x: hidden;
}

.managers-chart-taskbox .apexcharts-legend-series {
    cursor: pointer;
    line-height: normal;
    display: flex;
    align-items: flex-start !important;
    flex-direction: row;
    padding: 5px;
    border-radius: 8px;
    /* background-color: #272B30; */
    margin: 4px 3px !important;
}

.chart-dtl-height::-webkit-scrollbar {
    width: 4px;
}

.chart-dtl-height::-webkit-scrollbar:hover {
    background: #F1F3F2;
}

/* Handle */
.chart-dtl-height::-webkit-scrollbar-thumb {
    background: #ECECEC;
    padding-top: 40px;
    border-radius: 10px;
}

/* Handle on hover */
.chart-dtl-height::-webkit-scrollbar-track {
    background: transparent;
    padding-top: 50px;
    /* Space at the top inside the track */
}

.chart-dtl-height::-webkit-scrollbar-thumb:hover {
    background: #F1F3F2;
}

.analytic-chart-taskbox::-webkit-scrollbar-track {
    background: transparent;
    padding-top: 50px;
    /* Space at the top inside the track */
}

.analytic-chart-taskbox::-webkit-scrollbar {
    width: 4px;
}

.analytic-chart-taskbox::-webkit-scrollbar:hover {
    background: #F1F3F2;
}

/* Handle */
.analytic-chart-taskbox::-webkit-scrollbar-thumb {
    background: #F1F3F2;
}

/* Handle on hover */
.analytic-chart-taskbox::-webkit-scrollbar-thumb:hover {
    background: #F1F3F2;
}








.managers-chart-taskbox .apexcharts-legend.apx-legend-position-bottom.apexcharts-align-center,
.managers-chart-taskbox .apexcharts-legend.apx-legend-position-top.apexcharts-align-center {
    justify-content: end;
    position: absolute;
    right: 0px !important;
    bottom: 0px !important;
}

.analytic-chart-taskbox .apexcharts-legend-text {
    position: relative;
    font-size: 10px !important;
    color: #EFEFEF !important;
}

.analytic-chart-taskbox .chartbox-title h4 {
    font-size: 17px;
    font-weight: 600;
    margin: unset;
}

.analytic-chart-taskbox .table-head {
    background-color: #FFFBF6;
}

.analytic-chart-taskbox .table-head th {
    padding: 15px 15px;
    font-size: 14px;
    border-bottom: 1px solid #EFEFEF !important;
}

.manager-performance-head {
    font-size: 17px;
    padding: 10px 15px;
    font-weight: 600;
}

.analytic-chart-taskbox .table>tbody>tr>td {
    font-weight: 500;
}

.analytic-chart-taskbox .table>tbody>tr>td,
.analytic-chart-taskbox .table>tfoot>tr>td,
.analytic-chart-taskbox .table>tfoot>tr>th,
.analytic-chart-taskbox .table>thead>tr>td {
    padding: 10px 15px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #EFEFEF;
}

.analytic-chart-taskbox .chartbox .chartbox-title .donddl {
    margin-left: 120px;
}

.manager-performance-head {
    font-size: 17px;
    padding: 10px 15px;
}

.analytic-chart-taskbox .chartbox .chartbox-title .donddl a {
    color: #838D88;
    font-size: 11px;
    font-weight: lighter;
}

.analytic-chart-taskbox .chartbox .chartbox-title .donddl .caret {
    margin-left: 5px;
}

.analytic-chart-taskbox .chartsemicirclettt {}

.ml-274px {
    margin-left: 268px;
}

.analytic-chart-taskbox .chartvalue {
    font-size: 12px;
    font-weight: lighter;
    color: #838D88;
    padding-bottom: 30px;
}

.analytic-chart-taskbox .chartvalue .chartvalue-left {
    position: absolute;
    left: 108px;
    top: 212px;
}

.analytic-chart-taskbox .chartvalue .chartvalue-right {
    position: absolute;
    right: 102px;
    top: 212px;
}

.analytic-chart-taskbox .chart1 p {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 0px;
}

.analytic-chart-taskbox .chart1 img {
    height: 14px;
    margin-top: -2px;
}

.analytic-chart-taskbox .chart1 span {
    font-size: 13px;
    color: #838D88;
}

.analytic-chart-taskbox .ovr-task {
    padding: 20px 15px;
}

.analytic-chart-taskbox .progress-bar {
    height: 100%;
    line-height: 0px;
}

.analytic-chart-taskbox .ovr-task .progress-bar-red {
    background-color: #ED7171;
}

.analytic-chart-taskbox .ovr-task .progress {
    background-color: #F5F5F5;
}

.analytic-chart-taskbox .ovr-task .progress.sm,
.progress-sm {
    height: 6px;
}

.analytic-chart-taskbox .progress-group {
    margin-bottom: 30px;
}

.analytic-chart-taskbox .progress-group .progress-text {
    font-size: 13px;
    line-height: 29px;
    color: #838D88;
}

.analytic-chart-taskbox .ovr-task .progress-group .progress-number {
    border: 1px solid #065F46;
    color: #fff;
    background-color: #065F46;
    border-radius: 20px;
    font-size: 10px;
    padding: 2px 10px 2px 10px;
    margin-top: 3px;
    width: 40px;
    text-align: center;
}

.anly-box .analytic-chart-taskbox {
    height: auto !important;
}

.anly-box .analytic-chart-taskbox .ovr-task {
    padding: 0px 15px;
}

.anly-box .analytic-chart-taskbox .chartbox .chartbox-title .donddl {
    margin-left: 250px;
}

.per-score h3 {
    font-size: 30px;
    font-weight: 600;
    margin-bottom: 0px;
    margin-top: 20px;
    padding-bottom: 0px;
    padding-left: 18px;
}

.per-score span {
    font-size: 16px;
    color: #838D88;
    padding-left: 18px;
}

.anly-box table tr th {
    background-color: #FFFBF6;
}

.anly-box .box-body {
    padding: 0px;
}

.anly-box .Leaderboard .table>tbody>tr>th {
    border-top: none;
    font-weight: 500;
    font-size: 13px;
    padding: 18px;
}

.anly-box .table>tbody>tr>td,
.table>tbody>tr>th,
.table>tfoot>tr>td,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>thead>tr>th {
    padding: 12px 18px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}

.td-score {
    font-size: 16px;
    border: 1px solid #F5F5F5;
    color: #707070;
    background-color: #F5F5F5;
    border-radius: 20px;
    font-size: 12px;
    padding: 2px 10px 1px 10px;
    margin-top: 5px;
    ;
    font-weight: 500;
}

.anly-box .leadername {
    font-size: 16px;
    font-weight: 500;
    color: #000000;
}

.mt-57px {
    margin-top: 57px !important;
}

.mt-18px {
    margin-top: 18px !important;
}

.h-317px {
    height: 317px !important;
}

.engage .analytic-chart-taskbox {
    height: 317px !important;
}

.engage .analytic-chart-taskbox .chartbox .chartbox-title .donddl {
    margin-left: 240px !important;
}

.anylcom .analytic-chart-taskbox .chartbox .chartbox-title .donddl {
    margin-left: 268px !important;
}

.m-2px {
    padding: 10px !important;
}

.card-footer {
    padding: 18px;
    background-color: #F1F3F2;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
}

.card-footer h4 {
    font-size: 17px;
    font-weight: 500;
    margin: 0 !important;
    padding-bottom: 0px !important;
}

.modal-reccbody .popupdate {
    padding-left: 54px !important;
}

.filterengagement .form-control {
    height: 34px !important;

}

.filterengagement .lebl-icon {
    width: 40px !important;
    margin-right: 10px !important;
    position: relative;
    top: 10px;
}

.filterengagement .form-group {
    min-height: 70px !important;
    margin-bottom: 5px !important;
}

.box-header2 {
    border-top-right-radius: 15px !important;
    border-top-left-radius: 15px !important;
}

.insight {
    color: #1D4F3A !important;
    font-size: 15px !important;
    font-weight: 510 !important;
}

.cursor-pointer {
    cursor: pointer !important;
}

.insight-body {
    padding: 10px 20px 20px 20px !important;

}

.eng-meter {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding: 0px 69px;
    top: -31px;
    color: #838D88;
    font-size: 14px;
}

.eng-text {
    color: #1D4F3A;
    font-weight: 600;
}

.eng-img {
    position: relative;
    top: -2px;
}

.score-detail-box {

    border-radius: 15px !important;
    background-color: #FFFFFF !important;
    border: 1px solid #E4E4E4 !important;
    min-height: 600px !important;
}

.score-top-box {
    padding: 20px 20px 0px 20px !important;
    border-bottom: 1px solid #E4E4E4 !important;
    background-color: #0b7154 !important;
    border-top-right-radius: 15px !important;
    border-top-left-radius: 15px !important;
    height: 293px;
}

.score-subtitle {
    color: #FFFFFF !important;
    font-size: 12px !important;
}

.score-top-box .CircularProgressbar .CircularProgressbar-path {
    stroke: #EECF7F !important;
}

.progress-group-score {
    height: 120px !important;
    width: 120px !important;
    text-align: center;
    margin-left: 12px;
}

.progress-group-score .CircularProgressbar .CircularProgressbar-text {
    fill: #fff !important;
    font-weight: 300 !important;
    font-size: 18px !important;
}

.score-circular-footer {
    font-size: 14px;
    color: #FFFFFF;
    font-weight: 600;
    margin-left: 34px;

}

.progress-group-score-row {
    padding: 15px 20px;
    border-bottom: 1px solid #E4E4E4;
    display: flex;
    align-items: center;
}

.progress-group-score-row .progress {
    height: 7px;
}

.progress-group-score-row .progress-number {
    font-size: 14px;
    font-weight: 600;
    color: #1D4F3A;
    position: relative;
    top: -6px;
}

.progress-group-score-row p {
    color: #101010;
    font-weight: 500;
    font-size: 16px;
}

.p-score {
    position: relative;
    top: 10px;
}

.score-number-circle {
    border: 1px solid #F1F3F2;
    border-radius: 50%;
    color: #838D88;
    font-size: 14px;
    font-weight: 600;
    background-color: #F1F3F2;
    width: 26px;
    height: 26px;
    text-align: center;
    margin-right: 10px;
    line-height: 24px;
    position: relative;
    top: -5px;

}

.onboarding-top-header {
    padding: 10px 100px;

}

.heading-underline {
    width: 100%;
    height: 3px;
    margin-top: 16px;
    background-image: url(../images/onboarding/line-signup.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

.mt-38px {
    margin-top: 38px !important;
}

.onboarding .btn-primary:active {
    background: #1D4F3A;
    border: 1px solid #1D4F3A;
    color: #fff;
}

.onboarding .btn-primary:active:hover {
    background: #1D4F3A;
    border: 1px solid #1D4F3A;
    color: #fff;
}

.onboarding .btn-primary:hover {
    color: #1D4F3A !important;
}

.publicpage .btn-primary:hover {
    color: #1D4F3A !important;
}

.btn-primary.active,
.btn-primary:active,
.open>.dropdown-toggle.btn-primary {
    background-color: rgba(6, 95, 70, 1) !important;
    border-color: rgba(6, 95, 70, 1) !important;
    color: #fff !important;
}


.btn-primary.focus,
.btn-primary:focus {
    background-color: #1D4F3A !important;
    border-color: #1D4F3A !important;
    color: #fff !important;
}

.onboarding .login-right-pnl .loginform .form-group .form-checkbox label {
    font-size: 13px;
    font-weight: 500;
}

.otp-input-box {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
}

.onboarding .react-tel-input .flag-dropdown {
    position: absolute;
    top: 0;
    bottom: 0;
    padding: 0;
    background-color: #f5f5f5;
    border: 1px solid #E4E4E4 !important;
    border-radius: 10px 0 0 10px !important;
}

.onboarding .react-tel-input .selected-flag {
    width: 44px !important;
}

.btn-border-bg-none {
    border: none;
    background: none;
}

.cam-position {
    position: relative;
    top: 11px;
    left: -47px;
}

.onboarding .cam-position {
    position: relative;
    top: -12px;
    left: -47px;
}

.border-bottom-none {
    border-bottom: none !important;
}



.testimonial-profile-img {
    height: 48px;
    width: 48px;
    border: solid 2px rgb(6 95 70);
    border-radius: 50%;
    padding: 2px;
    background-color: #fff;
    object-fit: cover;
}


/* ////////////////////// sandeep0 17-08-2024 ////////////////////// */
.onboarding {
    background: #1D4F3A !important;
    height: 100vh !important;
    overflow-y: scroll !important;

}

.onboarding .login-right-pnl {
    background: #1D4F3A !important;
}

.onboarding-box {
    background: #FFFFFF !important;
    border-radius: 30px !important;
    padding: 30px !important;
    margin-top: 3px !important;
    min-height: 540px;
    position: relative;
}

.onboarding .unilogo {
    height: 75px !important;

    margin-right: 8px;
}

.onboarding .onboarding-top-header {
    padding: 20px 30px;
}

.onboarding .unicon {
    font-weight: bold !important;
    font-size: 30.4px !important;
    margin-top: 15px !important;
    font-family: "Mulish", sans-serif !important;
}

.onboarding .closebtn {
    position: relative;
    right: 14px !important;
    top: -13px !important;
}

.onboarding .login-right-pnl {
    padding: 0px 32.8% !important;
    margin-bottom: 50px !important;
}

.onboarding .sign-top {
    padding-top: 0px !important;
}

.onboarding .login-right-pnl .top-title .line2 {
    margin-top: 0px !important;
}

.onboarding .onbording-btn-position {
    position: absolute;
    bottom: 0px;
    padding: 45px;
    left: 0;
    width: 100%;
}

.portal-p {
    font-size: 16px;
    color: #808080;
    line-height: 26px;
}

.portal-sel {
    border: 1px solid #E4E4E4;
    padding: 8px 20px;
    font-size: 16px;
    color: gray;
    border-radius: 15px;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.portal-sel:focus {
    border: 1px solid #065F46;
    color: #065F46;
}

.portal-sel:hover {
    border: 1px solid #065F46;
    background-color: #f2f7f5;
    color: #065F46;
}

.onboarding .arrow-button {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #f0f0f0;
    /* Light grey background */
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
}

.onboarding .arrow-icon {
    color: #7d7d7d;
    /* Grey arrow color */
    font-size: 20px;
    /* Adjust size as needed */
    transition: color 0.3s ease;
}

/* Hover state */
.onboarding .portal-sel:hover .arrow-button {
    background-color: #1b5e20;
    /* Green background */
}

.onboarding .portal-sel:hover .arrow-icon {
    color: #ffffff;
    /* White arrow color */
}


.publicpage .slider-container {
    width: 84%;
    margin: 0 auto;
    overflow: visible;
}

.productivity-partner-box {
    padding: 40px;
    border: 1px solid #163346;
    border-radius: 70px;
    color: #b9c1c7;
    background: #163346;
}

.productivity-partner-box .h4 {
    font-size: 28px;
    line-height: 36px;
    /* margin-top: 24px; */
    color: #FFFFFF;
}

.productivity-partner-box p {
    font-size: 18px;
    line-height: 27px;
    margin-top: 20px;
}

.publicpage .carousel .slider-wrapper {
    overflow: hidden;
    margin: auto;
    width: 100%;
    transition: height .15s ease-in;
    min-height: 500px;
}

.publicpage .slider {
    height: unset;
    background-color: unset;
    opacity: unset;

}

.publicpage .tab-buttons {
    display: flex;
    justify-content: center;
    margin-bottom: 50px;
}

.publicpage .tab-buttons span {
    margin-right: 70px;
    padding-right: 0;
    font-weight: 500;
    font-size: 22px;
    line-height: 32px;
    cursor: pointer;

}

.publicpage .tab-buttons span.active {
    border-bottom: 2px solid #065F46;
    font-weight: 600;
    padding-bottom: 5px;
    color: #1B1B1B;
}

.publicpage .slider-content {
    text-align: left;
    padding: 20px;
}

.publicpage .slider-content ul {
    margin-top: 20px;
    list-style-type: disc;
}

.publicpage .slider-content ul li {
    line-height: 28px;
    margin-top: 20px;
    font-size: 20px;
    color: #707070;

}

.publicpage .carousel.carousel-slider .control-arrow {
    top: 45%;
    position: absolute;
    background-image: url(/images/left-arrow.svg);
    background-size: cover;
    background-position: center;
    padding: 5px;
    height: 54px;
    width: 54px;
    margin-left: -50px;
    z-index: 1111;
    margin-right: -50px;
}

.publicpage .carousel.carousel-slider {
    position: relative;
    margin: 0;
    overflow: visible;
}

.publicpage .carousel .control-dots {
    display: none;
}

.publicpage .carousel.carousel-slider .control-arrow:hover {
    background: unset;
    border-radius: 50%;
    border: solid 1px #337ab7;
    position: absolute;
    background-image: url('/images/left-arrow.svg');
    /* Add the image URL here */
    background-size: cover;
    /* Ensures the image covers the entire area */
    background-position: center;
    /* Centers the image */
    padding: 5px;
    height: 54px;
    width: 54px;
}

.publicpage .carousel .control-prev.control-arrow:before {
    border-right: unset;
}

.publicpage .carousel .control-prev.control-arrow:before svg {
    border-right: unset;
    transform: scale(-1);
}

.publicpage .carousel button.control-arrow.control-prev {

    transform: scale(-1);
}

.publicpage .carousel .control-arrow:before,
.carousel.carousel-slider .control-arrow:before {
    margin: unset;
    display: inline-block;
    border-top: unset;
    border-bottom: unset;
    content: '';
}

.publicpage .carousel .control-next.control-arrow:before {
    border-left: unset;
}



.onboarding .btn-primary:hover {
    background: transparent !important;
}

:where(.css-dev-only-do-not-override-1gwfwyx).ant-picker .ant-picker-input {

    width: 62% !important
}

.team-member-list .crownbg img {
    position: absolute;
    width: 20px !important;
    height: 20px !important;
    left: 27px;
    top: -3px;
}


.del-meet .btn-cancel {
    color: #808080 !important;
    background-color: #fff !important;
    border-color: #E4E4E4 !important;
    border-radius: 30px !important;
    padding: 10px 40px 10px 40px !important;
    min-width: 100px !important;
    font-size: 16px !important;
}

.del-meet .btn-save {
    padding: 10px 40px 10px 40px !important;
    font-size: 16px !important;
}

.tooltip-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}

.tooltip-container .tooltip-text {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 10px;

    position: absolute;
    z-index: 1;
    top: 35px;
    left: 100px;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    width: 235px;
}



.tooltip-container .tooltip-text::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 35px;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #000 transparent;
}

.tooltip-container:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}



.tooltip-container .tooltip-text-mob {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 10px;
    position: absolute;
    z-index: 1;
    top: 35px;
    left: 46px;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    width: 130px;
}

.tooltip-container .tooltip-text-mob::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 35px;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #000 transparent;
}

.tooltip-container:hover .tooltip-text-mob {
    visibility: visible;
    opacity: 1;
}

.tooltip-container .tooltip-text-grid-mob {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 10px;
    position: absolute;
    z-index: 1;
    top: 35px;
    left: 70px;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    width: 130px;
}

.tooltip-container .tooltip-text-grid-mob::after {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 36px;
    transform: translateX(-50%);
    border-width: 5px;
    border-style: solid;
    border-color: transparent transparent #000 transparent;
}

.tooltip-container:hover .tooltip-text-grid-mob {
    visibility: visible;
    opacity: 1;
}

.tooltip-container .tooltip-connect-text {
    visibility: hidden;
    width: auto;
    background-color: #000;
    color: #fff;
    text-align: left;
    padding: 8px 10px;
    border-radius: 10px;
    position: absolute;
    z-index: 1;
    /* top: 35px; */
    right: 35px;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s;
    width: 140px;
}



.tooltip-container .tooltip-connect-text::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -10%;
    /* Place the arrow at the right edge */
    transform: translateY(-50%);
    border-width: 8px;
    border-style: solid;
    border-color: transparent transparent transparent #000;
    /* Adjust arrow color */
}

.tooltip-container:hover .tooltip-connect-text {
    visibility: visible;
    opacity: 1;
}



.whitecard-team .flex {
    display: flow;
    width: 150px;

}

.whitecard-team .p-15 {
    padding: 15px 0px;
    width: 100%;
}

.h-258px {
    height: 258px !important;
}

.whitecard-team .shimmer-button--sm {
    border-radius: 3px;
    height: 13px;
    width: 100px;
}

.shimmer-button {
    margin-bottom: 0px;
}

.tv-list .tooltip-container .tooltip-text {
    left: 124px;
}


.listpin img {
    transition: fill 0.3s ease;
}

.listpin:hover img {
    fill: green;
    /* This works if the SVG file has a fill attribute */
    filter: invert(41%) sepia(77%) saturate(1094%) hue-rotate(68deg) brightness(88%) contrast(85%);
    /* Fallback for non-inline SVGs */
}

abbr[title] {
    text-decoration: none !important;
    color: #808080 !important;
}


.react-calendar__tile.react-calendar__month-view__days__day.highlight abbr {
    position: relative;
    margin-top: 8px;
    margin-bottom: 5px;
    padding: 4px 8px 4px 8px !important;
}

.react-calendar__tile.react-calendar__month-view__days__day.highlight abbr::after {
    content: '';
    position: absolute;
    bottom: -4px;
    left: 50%;
    transform: translateX(-50%);
    width: 4px;
    height: 5px;
    background-color: #fff;
    border-radius: 50%;
    border: solid 2px #d78812;
}


.unique-shimmer-card {
    /* padding: 20px; */
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #fff;
    border-radius: 8px;
    width: 100%;
    height: 100%;
}

.unique-shimmer-image {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    margin-bottom: 10px;
    background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
    background-size: 200% 100%;
    animation: uniqueShimmer 1.5s infinite;
}

.unique-shimmer-title {
    width: 60%;
    height: 20px;
    margin-bottom: 5px;
    background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
    background-size: 200% 100%;
    animation: uniqueShimmer 1.5s infinite;
    border-radius: 5px;
}

.unique-shimmer-subtitle {
    width: 50%;
    height: 15px;
    margin-bottom: 15px;
    background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
    background-size: 200% 100%;
    animation: uniqueShimmer 1.5s infinite;
    border-radius: 5px;
}

.unique-shimmer-icons {
    display: flex;
    justify-content: space-around;
    width: 40%;
    margin-bottom: 10px;
}

.unique-shimmer-icon {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
    background-size: 200% 100%;
    animation: uniqueShimmer 1.5s infinite;
}

.unique-shimmer-line {
    width: 90%;
    height: 1px;
    margin-bottom: 15px;
    background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
    background-size: 200% 100%;
    animation: uniqueShimmer 1.5s infinite;
}

.unique-shimmer-viewtasks {
    width: 50%;
    height: 20px;
    background: linear-gradient(to right, #f6f6f6 8%, #f0f0f0 18%, #f6f6f6 33%);
    background-size: 200% 100%;
    animation: uniqueShimmer 1.5s infinite;
    border-radius: 5px;
}

@keyframes uniqueShimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}


/* ///27-08-2024/// */
.bas-border-right {
    border-right: 1px solid #576c7a;
    border-style: dashed;
}

.productivity-partner-box p b {
    color: #fff;
}



.home-other-company-logo {
    background-color: #F8F8F8;
    border-radius: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    flex-direction: row;
}

.home-other-company-logo img {
    width: 50px;
}

.medium-logo {
    height: 100px;
    width: 120px;
}

.publicpage .google-meet-logo {
    height: 105px;
    width: 165px;
    margin-bottom: 15px;
}

.large-logo {
    height: 220px;
    width: 100px;
}

.large-logo-team-logo {
    height: 220px;
    width: 120px;
    float: right;
}

.favorate-logos {
    display: flex;
    width: 444px;
}

.medium-logo-sm {
    width: 120px;
    height: 105px;
    margin-bottom: 15px;
}

.flex-wrap {
    flex-wrap: wrap;
}


/* Ensure the logos scale well with their containers */


.mb-md-0 {
    margin-bottom: 0px !important;
}

.justify-content-end {
    justify-content: flex-end !important;
}

.position-large-icon {
    position: relative;
    left: 100px;
}

.icon-cont {
    width: 382px;
    display: flex;
    justify-content: end;
}

.search-panel-header .btn.focus,
.btn:focus {
    color: #fff !important;
}

.setting-module .unique-shimmer-viewtasks {
    width: 90%;
}

.reminder-heading {
    font-variant-caps: all-small-caps;
    font-size: 16px;
}

.publicpage .btn-team-header {
    color: #707070 !important;
    background-color: #fff !important;
    border-color: #e0e0e0 !important;
    border-radius: 20px !important;
    padding: 8px 25px 8px 25px !important;
    min-width: 100px !important;
    border: 1px solid #e0e0e0 !important;
}

/* Custom Carousel Styles */
.myCarousel {
    position: relative;
    width: 100%;
    overflow: hidden;
    margin-top: 20px;
}

.myCarousel-inner {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

.myCarousel-item {
    min-width: 100%;
    box-sizing: border-box;
}

.myCarousel img {
    width: 100%;
    height: auto;
    display: block;
}

.myCarousel-dots {
    text-align: right;
    margin-top: 10px;
    margin-right: 15px;
}

.myCarousel-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 0 5px;
    background-color: #bbb;
    border-radius: 50%;
    cursor: pointer;
}

.myCarousel-dot.active {
    background-color: #717171;
}

.indicate-arrow {
    position: relative;
    float: right;
    right: 380px;
}

.img-home-con {
    background-image: url('/images/home/Ai-ban.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    flex: 1;
    min-height: 100%;
    border: 0;
}

.align-items-stretch {
    align-items: stretch !important;
}

.mx-10px {
    margin-left: 10px !important;
    margin-right: 10px !important;
}

.truncate-text {
    white-space: nowrap;
    /* Prevent text from wrapping */
    overflow: hidden;
    /* Hide text overflow */
    text-overflow: ellipsis;
    /* Show ellipsis when text overflows */
}

.whitecard-name-designation {
    width: 171px;
    /* Set a fixed width or max-width for the container */
}

/* ///// super admin css ///// */
.sadmin .dropdown-toggle img {
    width: 40px;
    height: 40px;
    border-radius: 25px;
}

.sadmin .topbarProfile .profleddl {
    min-width: 170px !important;
}

.hadmin .navbar-brand {
    padding: 7px 0px !important;
}

.me-3 {
    margin-right: 3rem !important;
}

.ms-0 {
    margin-left: 0px !important;
}


.dashboard-top-card {
    min-height: 110px !important;
    border: 1px solid #E4E4E4 !important;
    background: #fff;
    border-radius: 15px;
    padding: 20px;
    box-shadow: 0 0px 5px 0 rgba(0, 0, 0, 0.2);
}

.sadmin-module .CircularProgressbar .CircularProgressbar-path {
    stroke: #065F46 !important;
}

.sadmin-module .CircularProgressbar {
    width: 50% !important;
}

.sadmin-module .CircularProgressbar-text {
    dominant-baseline: middle !important;
    text-anchor: middle !important;
}

.align-flex-end {
    align-items: flex-end !important;
}


.p-2 {
    padding: 10px !important;
}

.equal-height-row {
    display: flex;
}

.equal-height-row .col-md-6 {
    display: flex;
    flex-direction: column;
}

.equal-height-row .card {
    flex-grow: 1;
}


.user-client-statistics .topbarProfile .profleddl {
    min-width: max-content !important;
}

.user-client-statistics .my-dropdown:before {
    right: 140px !important;
}

.user-client-statistics .search-panel-header .btn.focus,
.btn:focus,
.btn:hover {
    /* color: #065F46 !important; */
    /* background-color: #065F46 !important;
    border-color: #065F46 !important; */
    /* opacity: 0.2; */
}

.custom-select {
    width: 100%;
    padding: 8px;
    border: 1px solid #ced4da;
    border-radius: 4px;
    background-color: #ffffff;
    font-size: 14px;
    color: #495057;
}

.custom-select:focus {
    border-color: #80bdff;
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(38, 143, 255, 0.25);
}

.mt-28px {
    margin-top: 28px !important;
}

.cart-title-dashboard {
    font-size: 14px !important;
}

.sup-sech-icon {
    position: relative !important;
    top: 8px !important;
    left: -26px !important;
    z-index: 2 !important;
}

.w-270px {
    width: 270px !important;
}

.card-usage-con {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: space-between;
}

.w215px {
    min-width: 215px !important;
}

.org-profile .dashboard-top-card {
    min-height: 232px !important;
}

.org-profile .user-client-statistics .search-panel-header .btn.focus,
.btn:focus {
    color: #fff !important;
}

.min-w-136px {
    min-width: 136px !important;
}

/* kundan */
.analytics-container {
    padding: 20px;
}

.selectors {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.overall-task-completion,
.task-completion-trend,
.overdue-tasks,
.performance-leaderboard,
.member-performance {
    margin-bottom: 40px;
}

h3 {
    margin-bottom: 10px;
}

.publicpageolul {

    margin-left: 20px;
}

.publicpageolul ul li,
ol li {
    line-height: 28px;
    margin-top: 20px;
    font-size: 20px;
    color: #707070;
}

.standard-ul {
    margin-left: 20px;
}

.standard-ul li {
    line-height: 28px;
    margin-top: 5px !important;
    font-size: 20px;
    color: #707070;
}

.ml-40 {
    margin-left: 40px !important;
}

.ml-180 {
    margin-left: 180px !important;
}

.react-multi-email span {
    color: #ccc;
}

.InviteBox-List span {
    color: unset;
}

.w-40 {
    width: 40px !important;
}


/* //// super admin css //// */
.spadmin .btn-primary:hover {
    color: #fff !important;
}

/* /////// subscription /////// */
.basic-btn {
    background-color: #D78812;
    color: #fff;
    border: 1px solid #D78812;
    border-radius: 30px;
    padding: 2px 10px;
    font-size: 13px;
}
.payment-history-btn {
    color: #065F46;
    font-size: 13px;
    margin-top: -10px;
    border: 1px solid #F3F7F6;
    border-radius: 20px;
    padding: 8px 15px;
    background-color: #F3F7F6;
}
.subscription-id-history-section{
    display: flex;
        justify-content: space-between;
        margin-bottom: 15px;
}

.subscription-card-box {
    border: 1px solid #E4E4E4;
    border-radius: 20px;
    padding: 15px;
    /* margin-bottom: 20px; */
    background-color: #fff;
    display: flex;
    flex-direction: column;
    /* justify-content: space-between; */
    height: 100%;
}
.subscription-card-box-left {
    background-image: url(/images/setting/bg-subcription-left.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    border-radius: 15px;
    padding: 15px;
}
.subscription-card-box-left .expires-on-box{
    background-color: #0E7B5C;
    color: #fff;
    border-radius: 15px;
    padding: 10px 15px;
    margin-top: 10px;
}
.subscription-card-box-left .expires-on-box .manage-payment{
    font-size: 13px;
    font-weight: 600;
}
.subscription-card-box-left .expires-on-box .expires-on-text{
    font-size: 16px;
    font-weight: 600;
}
.billing-address-box {
    background-color: #F0F0F0;
    border-radius: 15px;
    padding: 20px 30px;
    margin-top: 20px;
}
.billing-address-title{
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: #101010; 
}
.billing-to-name{
    font-size: 16px;
    font-weight: 600;
    color: #065F46;
    line-height: 30px;
}
.billing-to-address{
    font-size: 14px;
    font-weight: 400;
    color: #101010; 
    line-height: 20px;
}
.subscription-addon-card{
    background-color: #FFFFFF;
    border-radius: 15px;
   
   
}
.subscription-addon-card-header {
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: #101010;
    background-color: #FFFBF6;
    padding: 15px 20px;
    border-radius: 15px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
.subscription-addon-card-body{
    font-size: 14px;    
    font-weight: 400;
    color: #101010; 
    line-height: 20px;
}
.subscription-addon-card-body-item {
    font-size: 14px;
    border-top: 1px solid #E4E4E4;
    padding: 15px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
}

.subscription-addon-card-body-item .arrow-button-sub-btn {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #1D4F3A;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
    color: #fff;
}
.subscription-addon-card .arrow-button-sub-btn .arrow-icon-sub-btn {
    font-size: 12px !important;
    position: relative;
    top: 1px;
    color: #fff;
}

.switch-to-annual-btn {
    color: #fff !important;
    background-color: #065F46 !important;
    border-color: #065F46 !important;
    border-radius: 20px !important;
    padding: 8px 15px 8px 15px !important;
    min-width: 100px !important;
}


.promo-section {  
    border-radius: 15px;
    padding: 15px;
    
}
.promo-section-content .arrow-button-sub-btn .arrow-icon-sub-btn {
    font-size: 12px !important;
    position: relative;
    top: 1px;
    color: #065F46;
}
.promo-section-content {
    background-color: #E9F0FC;
    border-radius: 20px;    
    display: flex;
}
.promo-section-content-img{   
    border-radius: 20px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}
.promo-section .promo-content{
    padding: 15px;
    background-color: #E9F0FC;
    border-radius: 20px;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}
.promo-section .promo-content .promo-title{
    font-size: 16px;
    font-weight: 500;
    line-height: 30px;
    color: #101010;
}
.promo-section .promo-content .promo-description{
    font-size: 14px;
    font-weight: 400;
    color: #101010;
    line-height: 20px;
    

}
.promo-section .promo-content .explore-btn{
    background-color: #1D4F3A;  
    color: #fff;
    border-radius: 20px;
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
}








.flex-grow-1 {
    flex-grow: 1;
}

.update-btn-sub {
    color: #fff !important;
    background-color: #1D4F3A !important;
    border-color: #1D4F3A !important;
    border-radius: 20px !important;
    padding: 8px 15px 8px 15px !important;
    min-width: 150px !important;
}

.update-btn-sub:hover {
    background-color: #25663b;
}

.price-h {
    font-size: 40px;
    color: #fff;
}

.price {
    font-size: 16px;
    color: #707070;
    font-weight: 600;
    display: flex;
    margin: 15px 0;
}


.price span {
    font-size: 13px;
    color: #fff;
    font-weight: 600;
}


.usage {
    text-align: left;
}

.users,
.storage {
    font-size: 14px;
    margin-bottom: 8px;
    font-weight: 510;
}

.users-bar,
.storage-bar {
    background-color: #eee;
    height: 8px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.users-progress {
    background-color: #3c6b36;
    height: 100%;
    border-radius: 4px;
}

.storage-progress {
    background-color: #d18342;
    height: 100%;
    border-radius: 4px;
}


.arrow-button-sub {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #1b5e20;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
    color: #fff;
}

.arrow-button-sub-btn {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease;
    color: #fff;
}

.portal-sel-sub {
    background-color: #f2f7f5;
    color: #065F46;
    padding: 8px 20px;
    font-size: 16px;
    border-radius: 25px;
    font-weight: 500;
    display: flex;
    justify-content: space-between;
    align-items: center;

}

.portal-sel-sub .arrow-icon-sub {
    font-size: 12px !important;
    transition: color 16.3s ease;
    position: relative;
    top: 1px;
}

.arrow-button-sub-btn .arrow-icon-sub-btn {
    font-size: 12px !important;
    position: relative;
    top: 1px;
    color: #065F46;
}

.w-24px {
    width: 24px !important;
}

.sub-h4 {
    font-size: 18px;
    font-weight: 510;
}

.sub-p {
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.sub-table-h4 {
    font-size: 18px;
    font-weight: 600;
}

.addons-table-container {
    max-width: 800px;
    margin: 20px auto;
    background-color: #f5f5f5;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.addons-pricing-table {
    width: 100%;
    border-collapse: collapse;
}

.addons-header {
    font-size: 16px;
    text-align: left;
    padding: 15px;
    background-color: #FFFBF6;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    font-weight: 600;
}

.addons-units-header {
    font-size: 16px;
    text-align: left;
    padding: 15px;
    background-color: #FFFBF6;
    border-bottom: 1px solid #ddd;
    border-top-right-radius: 20px;
    font-weight: 600;
}

.addons-item {
    padding: 15px;
    border-bottom: 1px solid #eee;
    font-size: 16px;
    font-weight: 500;
}

.addons-view-plans {
    font-size: 14px;
    font-weight: bold;
    color: #087d56;
    background-color: #f0f7ef;
    padding: 5px 10px;
    border-radius: 15px;
    display: inline-block;
    margin-left: 10px;
}

.addons-arrow-icon {
    margin-left: 5px;
    font-size: 12px;
}

.addons-options {
    padding: 15px;
    border-bottom: 1px solid #eee;
}

.addons-option-label {
    margin-right: 20px;
    font-size: 15px;
    color: #808080;
    font-weight: 500;
}

.addons-radio {
    height: 18px;
    width: 25px;
    border-color: #E4E4E4;
    position: relative;
    top: 2px;
}

.addons-pricing-table tbody tr:hover {
    background-color: #f9f9f9;
}

.p-0 {
    padding: 0px !important;
}

.sub-footer-bg {
    background-color: #FAFAFA;
    border-bottom-right-radius: 20px;
    border-bottom-left-radius: 20px;
}


/* ///////////////////////////////////////////////////////////////////////////////////////////////////////////// */

/* Plans Section */
.plans-container {
    display: flex;
    justify-content: space-between;
}

.plan-card {
    background-color: white;
    border-radius: 10px;
    padding: 20px;
    width: 32%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
    transition: transform 0.3s ease;
    background-image: url('/images/setting/card-top-bg.svg');
    background-repeat: no-repeat;
    background-position: top;
    background-size: contain;

}



.highlighted {
    background-color: white;
    border-radius: 10px;
    padding: 20px;
    width: 32%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    text-align: center;
    transition: transform 0.3s ease;
    background-image: url('/images/setting/card-top-green.svg');
    background-repeat: no-repeat;
    background-position: top;
    background-size: contain;
}

.plan-header {
    text-align: center;
}

.plan-header h2 {
    font-size: 40px;
    margin: 6px 0;
    font-weight: bolder;
}

.plan-header .sub-title {
    margin-top: 12px;
    margin-bottom: 12px;
}

.plan-header .users-info {
    font-size: 16px;
    color: #1D4F3A;
    font-weight: 510;
}

.btn-get-started {
    background-color: #FFFFFF;
    color: #1D4F3A;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 10px;
    border: 1px solid #1D4F3A;
    width: 150px;
}

.btn-get-highlighted {
    background-color: #D78812;
    color: #fff;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 10px;
    border: 1px solid #D78812;
    width: 150px;
}

.trial-info {
    font-size: 14px;
    color: #999;
    margin-top: 6px;
    font-weight: 500;
}

.plan-features {
    list-style: none;
    padding: 0;
    margin: 20px 0;

}

.plan-features li {
    padding: 8px 0;
    font-size: 15px;
    text-align: left;
    font-weight: 500;
}

.plan-features img {
    margin-right: 10px;
    margin-top: -5px;
    width: 24px;
}

.available {
    color: #101010;
}

.unavailable {
    color: #101010;

}

/* Add-ons Section */
.addons-container {
    display: flex;
    justify-content: space-between;
    margin-top: 40px;
}

.addon-card {
    background-color: #fff;
    padding: 20px;
    text-align: center;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    width: 45%;
}

.addon-card h3 {
    font-size: 18px;
    color: #333;
}

.addon-card p {
    font-size: 16px;
    color: #666;
}

.btn-add-plan {
    background-color: #006c4f;
    color: white;
    border: none;
    padding: 10px 20px;
    border-radius: 8px;
}

.sub-card-btn {
    background-color: #e7efec;
    color: #065F46;
    border: none;
    padding: 6px 20px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    width: 100px;
}

.highlighted .sub-card-btn {
    background-color: #295844;
    color: #fff;
    border: none;
    padding: 6px 20px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    width: 100px;
}

.footer-box-plan {
    background-color: #1D4F3A;
    border: 1px solid #1D4F3A;
    border-radius: 20px;
    color: #fff;
    padding: 20px;
}

.btn-get-started-plan {
    background-color: #FFFFFF;
    color: #1D4F3A;
    padding: 10px 20px;
    border-radius: 20px;
    font-weight: 500;
    cursor: pointer;
    margin-top: 10px;
    border: 1px solid #1D4F3A;
    width: 270px;
}

.footer-box-plan img {
    width: 45px;
    margin-right: 20px;
    margin-top: -10px;
}

.footer-box-plan p {
    color: #bbcac4;
}

.input-group-text-sub {
    position: absolute !important;
}

.billing-address {
    width: 100%;
    height: 250px;
}

/* //// payment method  //// */

.unique-cards-container {
    display: flex;
    gap: 20px;
    justify-content: center;
    padding: 40px;
    background-color: #f5f7fa;
}

.unique-card-item:hover,
.unique-card-item:focus {
    /* border: 1px solid #004d3f; */
    /* Default card border on hover/focus */
}

.unique-card-item:hover .unique-status,
.unique-card-item:focus .unique-status {
    background-color: #004d3f;
    /* Change to dark green */
    color: white;
    /* Change text to white */
}

.unique-card-item {
    background-color: white;
    border-radius: 20px;   
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.unique-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.unique-card-logo {
    width: 90px;
}

.unique-delete-btn {
    background: none;
    border: none;
    cursor: pointer;
}

.unique-delete-btn img {
    width: 45px;
}

.unique-card-details p {
    margin: 0;
    font-size: 14px;
    color: #333;
}

.unique-card-details h5 {
    margin: 0;
    font-size: 16px;
    color: #000;
}

.unique-status {
    padding: 5px 10px;
    border-radius: 12px;
    font-size: 12px;
    border: none;
    cursor: pointer;
}

.unique-default-card {
    border: 1px solid #004d3f;
}



.unique-default-status {
    background-color: #004d3f;
    color: white;
}

.unique-set-default-status {
    background-color: #e6f0eb;
    color: #004d3f;
}

.unique-expired-card {
    background-color: #feeceb;
    color: #f44336;
}

.unique-expired-status {
    background-color: #feeceb;
    color: #f44336;
}

/* Responsive design */
@media (max-width: 768px) {
    .unique-cards-container {
        flex-direction: column;
        align-items: center;
    }
}


/* 24-09-2024 */
.css-lxfshk-MuiInputBase-root-MuiOutlinedInput-root {
    font-size: 14px !important;
    border: none !important;
}

.css-lc42l8-MuiInputBase-input-MuiOutlinedInput-input {
    border: none !important;
    color: #101010 !important;
    font-family: "DM Sans" !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    background-color: #ffffff !important;
}

.css-1d3z3hw-MuiOutlinedInput-notchedOutline {
    text-align: left;
    position: absolute;
    bottom: 0;
    right: 0;
    top: -5px;
    left: 0;
    margin: 0;
    padding: 0 8px;
    pointer-events: none;
    border-radius: inherit;
    border-style: solid;
    border-width: 0px !important;
    overflow: hidden;
    min-width: 0%;
    font-size: 14px;
    /* border-color: rgba(0, 0, 0, 0.23); */
}

.date-separator {
    text-align: center;
    margin: 10px 0;
}

.date-separator::before {

    border-bottom: solid 1px red;
    width: 100px;
    height: 20px;
}

.date-separator::after {

    border-bottom: solid 1px red;
    width: 100px;
    height: 20px;
}


.date-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
}

.date-container .line {
    flex-grow: 1;
    border: none;
    border-top: 1px solid #d4d4d485;
    margin: 0 10px;
}

.date-container .date {
    color: #707070;
    font-size: 12px;
    font-weight: 500;
}


.date-separator div {
    padding: 8px;
    border: none;
    border-radius: 8px;
    background-color: transparent;
}


/* superadmin */
.super-admin .onboarding-box {
    min-height: auto !important;
}

.chat-box-container textarea {
    border: 1px solid #E4E4E4 !important;
}

.form-control:focus {
    border-color: #66afe9;
    outline: 0;
    /* -webkit-box-shadow: unset !important;
    box-shadow: unset !important; */
}

.task-title-text {
    max-width: 90%;
}

.taskBox label {
    margin: unset !important;
}

/* features-page */
.features-page {
    width: 100%;
    margin: 0;
    padding: 0;
    font-size: 16px !important;
}

.features-page p {
    font-size: 20px;
    color: #707070;
    text-align: center;
    line-height: 28px;
}

.features-page .header-container {
    background-image: url('/images/features/features-bg.png');
    background-size: cover;
    background-position: center;
    height: 108vh;
    font-size: 16px;
}

.features-page .breadcrumb-container {
    padding-top: 175px;
    text-align: center;

}

.features-page .breadcrumb-container a {

    font-weight: 500;
    color: #065F46;
}

.features-page .breadcrumb-container span {
    color: #707070;
}

.features-page .header-container h1 {
    font-size: 70px;
    font-weight: 600;
    color: #1B1B1B;
    text-align: center;
    margin-top: 10px;
    font-family: "DM Sans";
    letter-spacing: -4px;
    width: 80%;
    margin: 0 auto;
    padding: 10px 0px;

}

.features-page h2 {
    font-weight: 700;
    font-size: 72px;
    font-family: 'DM Sans';
    padding-bottom: 20px;
    text-align: center;
}

.features-page img {
    width: 100%;
}

.features-page .header-container p {
    font-size: 16px;
    font-weight: 500;
    color: #065F46;
    text-align: center;
    padding: 18px 0px;
    font-size: 20px;
    width: 80%;
    margin: 0 auto;
    line-height: 30px;
}

.features-page-btn-container {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: center;
    margin-top: 15px;
}

.features-page-btn-container .get-started {
    width: 150px;
    border-radius: 15px;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    background-color: #1D4F3A;
    color: #fff;
    margin: unset;
}

.features-page-btn-container .book-demo {
    width: 150px;
    border-radius: 15px;
    padding: 12px 20px;
    font-size: 16px;
    font-weight: 500;
    text-align: center;
    background-color: #F8F8F8;
    color: #101010;
    border: 1px solid #E1DCDC;
}

.header-container .help-you {
    color: #101010;
    margin-top: 20px;
}

.header-container .help-you p {
    color: #1B1B1B;
    font-size: 24px;
    font-weight: 600;
}

.innercontainer.feature-container {
    background-color: #FFFFFF;
    margin-top: -70px !important;
    border-radius: 15px;
    padding: 20px 30px;
    box-shadow: 0 8px 10px 0 rgb(135 66 66 / 10%), 0 8px 8px 0 rgb(147 90 69 / 4%);
    width: 65%;
}

.features-page-btn-container a.get-started:hover {
    color: #fff !important;
}

.feature-container .feature-item {
    display: flex;
    align-items: center;
    gap: 14px;
    text-align: left;
    margin: 10px;
}

.feature-container .feature-item img {
    width: 32px;
}


.testimonial-section {
    background: linear-gradient(180deg, #065f4621 0%, #f5784200 74%, #f5784200 97%);
    border-radius: 15px;
    padding: 100px;
}

.company-logo img {
    height: 40px;
    margin-bottom: 20px;
    width: auto;
}

.testimonial-text p {
    font-size: 20px;
    text-align: left;
}

.author-info {
    display: block;
    margin-top: 50px;
}

.author-img {
    border-radius: 50%;
    overflow: hidden;
    width: 60px;
    height: 60px;
    margin-right: 15px;
}

.author-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.author-details {
    text-align: left;
    padding: 5px 0px;
    text-align: left;
}

.author-details h4 {
    font-size: 24px;
    font-weight: 600;
    color: #1B1B1B;
}

.author-details span {
    font-size: 20px;
    color: #707070;
    font-weight: 500;
}

.react-calendar__tile--now {
    background: none !important;
    background: unset !important;
}



.taskBox .position-3dot {

    clear: both;
    display: none;
    position: absolute;
    top: unset !important;
    right: 5px;
    padding: 8px;
    height: unset;
    width: unset;
    border-radius: 50%;
    text-align: center;
    margin-top: unset;
    transition: 0.3s;
}

.taskBox .position-3dot:hover svg path {
    fill: #838d88;
    display: block;
}

.taskBox .position-3dot:hover {

    display: block;
    background-color: unset;
}

fieldset {

    border-width: unset;
    border-color: unset !important;
}

.css-igs3ac {
    text-align: left;
    position: absolute;
    inset: -5px 0px 0px;
    margin: 0px;
    padding: 0px 8px;
    pointer-events: none;
    border-radius: inherit;
    border-style: solid;
    border-width: 0px !important;
    overflow: hidden;
    min-width: 0%;
    border-color: rgba(0, 0, 0, 0.23);
}

.css-1qs43bf {
    font: inherit;
    letter-spacing: inherit;
    color: currentcolor;
    border: 0px !important;
    box-sizing: content-box;
    background: none;
    height: 1.4375em;
    margin: 0px;
    -webkit-tap-highlight-color: transparent;
    display: block;
    min-width: 0px;
    width: 100%;
    animation-name: mui-auto-fill-cancel;
    animation-duration: 10ms;
    padding: 16.5px 0px 16.5px 14px;
    font-size: 14px !important;
}


/*Toast Styles*/
/* General toast container styling */

.Toastify__toast-container--top-center {
    transform: translate(-50%, -50%) !important;
    top: 100px !important;
    position: relative;
}


.Toastify__toast {
    border-radius: 8px;
    /* Rounded corners */
    padding: 10px;
    /* Adjust padding */
    display: flex;
    /* Flexbox for layout */
    align-items: center;
    /* Vertically center content */
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
    /* Add a box shadow */
    overflow: visible !important;
}

/* Error toast specific styling */
.Toastify__toast--error {
    background-color: #fdecea;
    /* Light red background */
    border: 1px solid #FFB3B3;
    /* Red border for error */
    border-radius: 15px !important;
    color: #611a15;
    /* Dark red text */
}

/* Success toast specific styling */
.Toastify__toast--success {
    background-color: #f0f4f7;
    /* Light green background for success */
    border-left: 4px solid #00c49a;
    /* Green border for success */
    color: #2f5c4a;
    /* Dark green text */
}

/* Add a label (like "ERROR" or "SUCCESS") on the left */
.Toastify__toast-body::before {
    content: 'SUCCESS';
    display: inline-block;
    background-color: #00c49a;
    /* Red background for error */
    color: white;
    /* White text */
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: bold;
    margin-right: 10px;
    text-transform: uppercase;
    position: absolute;
    top: -10px;
}

/* Success label */
.Toastify__toast--success .Toastify__toast-body::before {
    content: 'SUCCESS';
    background-color: #00c49a;
    /* Green background for success */
    position: absolute;
    top: -10px;
}


/* Success label */
.Toastify__toast--error .Toastify__toast-body::before {
    content: 'ERROR';
    background-color: #d32f2f;
    /* Green background for success */
    position: absolute;
    top: -10px;
}

/* Toast message styling */
.Toastify__toast-body {
    margin-left: 10px;
    font-size: 14px;
}

/* Close button styling */
.Toastify__close-button {
    align-self: center;
    margin-left: auto;
    color: #999999;
}

.Toastify__toast-icon {
    width: 35px !important;
}

/* Hide the default icon */
.Toastify__toast-icon svg {
    display: none !important;
}


/* Add custom icon for error toasts */
.Toastify__toast--error .Toastify__toast-body .Toastify__toast-icon::before {
    content: '';
    display: inline-block;
    background-image: url('/images/icons/error-badge.png');
    /* Replace with error image */
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin-right: 0px;
    background-size: cover;
}

/* Add custom icon for error toasts */

.Toastify__toast-icon::before {
    content: '';
    display: inline-block;
    background-image: url('/images/icons/success-badge.png');
    /* Replace with error image */
    background-repeat: no-repeat;
    width: 24px;
    height: 24px;
    margin-right: 0px;
    background-size: cover;
}


/* new carousel */
.carousel {
    position: relative !important;
    width: 75%;
    /* Show 75% of the current slide */
    margin: 0 auto;
    /* Center the carousel */
    overflow: visible;
    /* Show the next slide partially */
}

.carousel-inner {
    display: flex;
    /* Display slides in a row */
}

.carousel-item {
    flex: 0 0 100%;
    /* Ensure each slide takes full width */
    transition: transform 0.6s ease-in-out;
    margin-right: -25%;
    /* This will make the next slide visible */
}

.carousel-item img {
    width: 100%;
    height: auto;
    object-fit: cover;
    /* Ensure the image covers the slide */
}

.carousel-control-prev,
.carousel-control-next {
    width: 50px;
    /* Adjust size of control buttons */
    z-index: 10;
    /* Keep control buttons above content */
}

.carousel-caption {
    position: absolute;
    bottom: 20px;
    left: 15%;
    right: 15%;
    z-index: 10;
    color: #fff;
    text-align: center;
}


/* help center */

.publicpage .innercontainer {
    width: 73.4%;
    margin: 0 auto;
    font-family: 'DM Sans';
}


.publicpage .innercontainer h2 {
    font-weight: 700;
    font-size: 68px;
    font-family: 'DM Sans';
}

.publicpage .help-banner-container {
    background-image: url('/images/home/help-center-bg.png');
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    width: 100vw;
    height: 68vh;
    object-fit: cover;
    margin-top: 64px;
}

.help-banner-container .banner-container-detals {

    width: 73.4%;
    margin: 0 auto;
    font-family: 'DM Sans';
    padding-top: 120px;

}

.banner-container-detals h1 {
    padding: 20px 0px;
    font-weight: 700;
    font-size: 68px;
    line-height: 78px;
    letter-spacing: -2px;
    color: #FFF;
}

.banner-container-detals .form-control {
    display: block;
    max-width: 700px;
    height: 64px;
    padding: 6px 30px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #F5F5F7;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 50px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
}

.innercontainer .btn-commn {
    padding: 6px 22px;
    font-size: 14px !important;
    font-weight: 500;
    border-radius: 30px !important;
    background-color: #065F46;
    color: #fff;
}

.comon-para {
    line-height: 28px;
    margin-top: 20px;
    font-size: 21px !important;
    color: #707070;
    padding: 0px 45px 0px 0px;

}

.public-h3 {
    padding-top: 15px;
    font-weight: 900 !important;
    font-size: 18px !important;
}

.helpqa-img {
    height: 48px;
    width: 48px;
    padding: 2px;
    background-color: #fff;
    object-fit: cover;
}

.img-wid100 {
    width: 100%;
    margin: 0;
}

.innercontainer .btn-commn:hover {

    background-color: #065F46;
    color: #fff;
}

.innercontainer .video-list {
    padding-top: 20px;
}

.innercontainer .video-list a {
    display: flex;
    justify-content: space-between;
    background-color: #F8F8F8;
    padding: 15px 20px;
    border: solid 1px #ccc;
    border-radius: 15px;
    align-items: center;
    margin-bottom: 20px;
    font-size: 21px;
}

.banner-container-detals .banner-text {
    font-size: 21px;
    max-width: 700px;
    color: #fff;
    line-height: 32px;

}

.innercontainer .form-container {
    background-color: #F8F8F8;
    padding: 40px 20px 40px 20px;
    border-radius: 15px;
}

.innercontainer .form-container .form-control {
    height: 52px !important;
    border: 1px solid #E4E4E4;
    border-radius: 15px;
    margin-bottom: 10px;
}

.innercontainer .form-container select {
    border-radius: 15px;
    padding: 5px 10px;
    border: solid 1px #EFEFEF;
    height: 52px !important;
    width: 100%;
}

.innercontainer .form-container .textarea {
    height: 100px !important;
    border-radius: 15px;
    padding: 5px 10px;
    border: solid 1px #EFEFEF !important;
}

.form-container .btn-contact-save {
    background: #1B1B1B;
    font-weight: 500 !important;
    color: #fff !important;
    border-radius: 30px;
    padding: 10px 30px !important;
}

.contact-info-section {
    margin: 0;
}

.contact-info-section .contact-info {
    padding: 10px 0px 10px 20px;
}

.contact-info .info-icon {
    width: 28px;
    margin-bottom: 20px;
}

.infovl {
    border-right: 2px solid #EBEBEB;
    height: 35px;
    margin-top: -65px;
}

.contact-info-section h4 {
    font-size: 28px;
    padding: 20px 0px;
    color: #1B1B1B
}

.contact-info-section .contact-info .emailinfo {
    font-size: 24px;
    color: #1D4F3A;
    font-weight: 600;
}

.contact-info-section .contact-info .emailfor {
    font-size: 20px;
    color: #707070;
}

/* tream of user */
.terms-container {
    display: flex;
    flex-direction: column;
    align-items: center;

}

.terms-container .h1ai {
    font-size: 50px !important;
}

.terms-container .ulli {
    line-height: 28px;
    margin-top: 20px;
    font-size: 20px;
    display: flex;
    color: #707070;
    align-items: flex-start;
    gap: 8px;
}

.terms-container .ulli img {
    margin-top: 5px;
}

.terms-wrapper {
    display: flex;
    flex-direction: row;
    width: 100%;
    max-width: 1200px;
    gap: 20px;
}

.terms-sidebar {
    flex: 0 0 40%;
    padding: 20px 0px;
}


.terms-sidebar ul {
    list-style-type: none;
    padding: 0;
}

.terms-sidebar li {
    margin-bottom: 15px;
    cursor: pointer;
    font-size: 16px !important;
    padding: 10px 15px;
    color: #707070 !important;
    font-weight: 500 !important;
}

.terms-sidebar li.active {
    border: 1px solid #E1DCDC;
    padding: 10px 15px;
    border-radius: 15px;
    background-color: #F8F8F8;
    color: #1B1B1B !important;
    font-size: 16px;
    font-weight: 500 !important;
}

.terms-content {
    flex: 1;
    padding: 40px 20px;
    background-color: #fff;
}

.right-content-div {
    border-bottom: 1px solid #e6e6e6;
    padding-bottom: 30px;
    margin-bottom: 30px;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .terms-wrapper {
        flex-direction: column;
    }

    .terms-sidebar {
        width: 100%;
        border-right: none;
        border-bottom: 1px solid #ddd;
    }

    .terms-content {
        width: 100%;
    }
}






/* Submenu */
.header-dropdown-menu {
    display: none;
    position: absolute;
    background-color: #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    top: 45px;
    left: 0;
    border-radius: 8px;
    z-index: 1000;
    min-width: 180px;
    transition: all 0.3s ease;
}

.header-nav-item:hover .header-dropdown-menu {
    display: block;
}

.header-dropdown-item {
    padding: 10px 20px;
    transition: background-color 0.3s ease;
}

.header-dropdown-item a {
    color: #333;
    text-decoration: none;
}

.header-dropdown-item:hover {
    background-color: #f7f7f7;
}

.header-dropdown-item a:hover {
    color: #007bff;
}

.headersearch .fa-chevron-down {
    font-size: 12px;
}


/* Mobile Styles */

/* Mobile Styles */
@media (max-width: 768px) {
    .navbar-collapse {
        display: block;
    }

    .header-dropdown-menu {
        position: relative;
        display: none;
        box-shadow: none;
        padding: 0;
    }

    .header-dropdown-show {
        display: block;
    }

    .header-dropdown-item {
        padding: 10px 0;
    }

    .navbar-collapse {
        flex-direction: column;
    }
}


/* Submenu Styles */
.header-dropdown-menu {
    display: none;
    position: absolute;
    background-color: #fff;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
    padding: 10px 0;
    top: 45px;
    left: 0;
    border-radius: 8px;
    z-index: 1000;
    min-width: 180px;
    transition: all 0.3s ease;
}

.header-dropdown-show {
    display: block;
}

.header-dropdown-item {
    padding: 10px 20px;
    transition: background-color 0.3s ease;
}

.header-dropdown-item a {
    color: #333;
    text-decoration: none;
}

.header-dropdown-item:hover {
    background-color: #f7f7f7;
}

.header-dropdown-item a:hover {
    color: #007bff;
}

.header-dropdown-menu {
    display: none;
}

.header-dropdown-menu.header-dropdown-show {
    display: block;
    /* or flex, depending on your design */
}

.header-nav-link:hover .fa-angle-down,
.header-nav-item.open .fa-angle-down {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}


/* Rotate icon when dropdown is open */
.header-nav-item.open .fa-angle-down {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
    /* Smooth rotation */
}

/* Ensure rotation is applied on hover as well */
.header-nav-item:hover .fa-angle-down {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
    /* Smooth rotation */
}

/* Mobile Styles */
@media (max-width: 768px) {
    .navbar-collapse {
        display: block;
    }

    .header-dropdown-menu {
        position: relative;
        display: none;
        top: 0;
        left: 17px;
        box-shadow: none;
        padding: 0;
    }

    .header-dropdown-show {
        display: block;
    }

    .header-dropdown-item {
        padding: 10px 0;
    }

    .navbar-collapse {
        flex-direction: column;
    }

    /* Icon Rotation for Submenu Toggle */
    .rotated {
        transform: rotate(180deg);
        transition: transform 0.3s ease;
    }
}



/* Set a consistent height for all .doc-card elements */
.doc-card {
    height: 250px;
    /* Adjust as necessary */

}

.btn-disconnect {
    color: #fff !important;
    background-color: #BD4053 !important;
    border-color: #BD4053 !important;
    border-radius: 20px !important;
    padding: 6px 10px 6px 10px !important;
    min-width: 100px !important;
}

.btn-connect {
    color: #fff !important;
    background-color: #1D4F3A !important;
    border-color: #065F46 !important;
    border-radius: 20px !important;
    padding: 6px 10px 6px 10px !important;
    min-width: 100px !important;
}

.btn-connect:hover {
    background: #fff !important;
    color: #1D4F3A !important;
    border: 1px solid #1D4F3A !important;
}







/* Carousel.css */



/* Media queries for responsive design */
@media (max-width: 768px) {
    .banner-blog-card img {
        height: 120px;
        /* Adjust image height for smaller screens */
    }

    .blog-detail-box {
        padding: 8px;
        /* Reduce padding for smaller screens */
    }
}

@media (max-width: 480px) {
    .banner-blog-card img {
        height: 100px;
        /* Further reduce image height for very small screens */
    }

    .blog-detail-box {
        padding: 4px;
        /* Further reduce padding for very small screens */
    }
}


/* Analytics kundan */
.for-mob-link {
    padding: 10px;
    font-size: 20px;

}

.for-mob-link p {
    font-size: 20px;
    line-height: 30px;
    margin-bottom: 20px;
}

.for-mob-link .img-aap-store {
    padding: 10px;
}

.analytics-dropdown {
    position: relative;
    min-width: 80px;
    text-align: left;
}

.analytics-dropdown-selected {
    cursor: pointer;
    border-radius: 22px;
    padding: 5px 20px;
    border: solid 1px #EFEFEF;
    background-color: #FAFAFA;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.analytics-dropdown-selected .fa {
    margin-left: 5px !important;
    float: right;
}

.analytics-dropdown-selected:hover .fa-angle-down {

    transform: rotate(180deg);
    transition: transform 0.3s ease;
}

.analytics-dropdown-options {
    position: absolute;
    top: 32px;
    left: 0;
    min-width: 160px;
    background-color: white;
    border: 1px solid #ccc;
    display: none;
    z-index: 100;
    border-radius: 10px;
    padding: 5px 0px;
}

/* .analytics-dropdown-options:before {
    content: '';
    background-color: transparent;
    border-right: 8px solid transparent;
    position: absolute;
    border-left: 8px solid transparent;
    border-bottom: 8px solid #fff;
    border-top: 8px solid transparent;
    top: -15px;
    right: 15px;
} */
.analytics-dropdown:hover .analytics-dropdown-options {
    display: block;
}

.dropdown-option-itmes {
    padding: 8px 10px;
    cursor: pointer;
    border-bottom: solid 1px #E4E4E4;
}

.dropdown-option-itmes:hover {
    color: #010101;
}


.analytics-dropdown-options-task {
    position: absolute;
    top: 32px;
    right: 0;
    min-width: 160px;
    background-color: white;
    border: 1px solid #ccc;
    display: none;
    z-index: 100;
    border-radius: 10px;
    padding: 5px 0px;
}

.analytics-dropdown:hover .analytics-dropdown-options-task {
    display: block;
}

.dropdown-option-itmes {
    padding: 8px 10px;
    cursor: pointer;
    border-bottom: solid 1px #E4E4E4;
}

.dropdown-option-itmes:hover {
    color: #010101;
}


.taskpopup .none-drp-postion {
    left: 55px !important;
    width: 147px !important;
    top: 19px !important;
}



.taskpopup .high-drp-postion {
    left: 30px !important;
    width: 147px !important;
    top: 19px !important;
}



.taskpopup .normal-drp-postion {
    left: 48px !important;
    width: 147px !important;
    top: 19px !important;
}

.dropdown-option-itmes {
    padding: 8px 10px;
    cursor: pointer;
    border-bottom: solid 1px #E4E4E4;
}



.dropdown-option-itmes:hover {
    color: #010101;
}



.priority-display {
    display: inline-flex;
    align-items: center;
    gap: 0;
}



.priority-display .fa-chevron-down {
    margin-left: 4px;
    font-size: 12px;
}

.add-attachment-label:hover {
    font-weight: 700 !important;
    cursor: pointer;
}



.dropdown-menu-custom {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 4px;
    z-index: 1050;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    border-radius: 8px;
    padding: 8px 0;
    min-width: 150px;
    background-color: #fff;
    border: 1px solid #ddd;

}



/* Style dropdown list items */

.dropdown-menu-custom li {
    padding: 8px 16px;
    cursor: pointer;
    color: #333;
}



.dropdown-menu-custom li:hover {
    background-color: #f8f9fa;
}


.dropdown-menu-custom li i {
    margin-right: 8px;
}



.priority-display {
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.fa-dwon-arrow-font {
    font-size: 12px;
    color: #333;
}

.crossmetpopup {
    position: relative;
    top: -15px;
}


.setting-module .accordion-item .accordion-title.active-title .three-dot {
    background-color: unset !important;
}


.accordion-item .edit-hovr-icon:hover .three-dot {
    color: #707070 !important;
}

.servetotalbox {
    padding: 5px 20px;
    background-color: #F3F7F6;
    border-radius: 20px;
    color: #065F46;
    min-width: 360px;
}

.timg-file {
    width: 20px;
    margin-right: 5px;
}


.clsicpostion {
    position: relative;
    left: -27px;
}

.comment-spin {
    position: absolute;
    right: 15px;
    top: 15px;
}

.loader-onclick {
    position: absolute;
    top: -1.3px;
    right: -1.2px;
}

.reminder-table-th {
    font-weight: 700;
    padding: 10px 15px;

}

.reminder-table-td {
    text-align: left;
    background: #fff;
    padding: 10px 15px;
}


.notification-settings {
    flex-direction: column;
    padding: 10px;
    border-radius: 15px;
    background-color: #fff;
}

.header-row {
    display: flex;
    padding: 10px 15px;
    justify-content: space-between;
}

.notification-row {
    display: flex;
    padding: 10px 15px;
    justify-content: space-between;
}

.notification-header {
    font-weight: bold;
}

.notification-type-head {
    font-weight: bold;
    width: 400px;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
}

.notification-type {
    font-weight: bold;
    width: 400px;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
}

.notification-cell {

    display: flex;
    justify-content: center;
    align-items: center;
}

.text-center {
    text-align: center;
}

.blank-cell {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;

}

.notification-type .css-1b1fjlj-MuiFormControl-root-MuiTextField-root {
    margin-left: 10px !important;
    cursor: pointer !important;
}

.notification-type .css-1dune0f-MuiInputBase-input-MuiOutlinedInput-input {
    cursor: pointer !important;
    color: #1D4F3A !important;
    font-weight: 700 !important;
}

.invite-member-btn {
    border-radius: 50px !important;
    padding: 6px 15px !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #fff !important;
    background-color: #1D4F3A !important;
    border: none !important;
    cursor: pointer !important;
    border: 1px solid #1D4F3A !important;
}

.invite-member-btn:hover {
    background-color: #fff !important;
    color: #1D4F3A !important;
    border: 1px solid #1D4F3A !important;
}


/* ///// subscription 18-12-2024 ///// */
/* Progress Steps */
.progress-container {
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.progress-step {
    font-weight: bold;
    color: gray;
}

.progress-step.active {
    color: green;
    border-bottom: 2px solid green;
    padding-bottom: 4px;
}

/* Card Hover Effect */

.sub-plane .unique-card-item {
    min-height: 260px;
}

/* .sub-plane .card {
        border-radius: 15px;
        box-shadow: 0 8px 10px 0 rgb(135 66 66 / 10%), 0 8px 8px 0 rgb(147 90 69 / 4%);
        border: 1px solid #E1DCDC;

    } */



/* Toggle Buttons */
.btn-group .btn {
    width: 100px;
    font-weight: 600;
}

.btn-success {
    background-color: #28a745 !important;
    color: white;
}

.btn-light {
    background-color: #f8f9fa;
    color: black;
}

.text-success {
    font-weight: bold;
}


.p-stepper .p-stepper-separator {
    background-color: #DAE6E3 !important;
    height: 3px !important;
}

.p-stepper .p-stepper-header .p-stepper-action {
    background: none !important;
}

.p-stepper .p-stepper-header.p-highlight .p-stepper-number {
    background: #065F46 !important;
}

.p-stepper .p-stepper-header.p-highlight .p-stepper-title {
    color: #065F46 !important;
    font-size: 18px !important;
    margin-left: 5px !important;
}

.p-stepper .p-stepper-header .p-stepper-action .p-stepper-title {

    font-size: 18px !important;
    margin-left: 5px !important;
}


/* Container: rounded pill shape */
.p-selectbutton {
    border-radius: 30px;
    overflow: hidden;
}

/* Common button styles */
.p-selectbutton .p-button {
    padding: 8px 25px !important;
    border: 1px solid #065F46 !important;
    border-radius: 0 !important; /* Remove full rounding */
}

/* Highlighted (active) button */
.p-selectbutton .p-button.p-highlight {
    background: #065F46 !important;
    color: #ffffff !important;
    border-color: #065F46 !important;
}

/* First button (left side of toggle) */
.p-selectbutton .p-button:first-child {
    border-top-left-radius: 30px !important;
    border-bottom-left-radius: 30px !important;
}

/* Last button (right side of toggle) */
.p-selectbutton .p-button:last-child {
    border-top-right-radius: 30px !important;
    border-bottom-right-radius: 30px !important;
}



.p-stepper .p-stepper-panels {
    background: #e6e9f0 !important;
}

.p-button:focus {
    box-shadow: none !important;
}

.sub-plane .unique-card-item {
    background-color: white;
    border-radius: 20px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    /* padding: 20px;    */
}

.btn-upgrade {   
    border-radius: 20px !important;
    padding: 8px 20px !important;
    font-weight: 600 !important;
    background-color: #065F46 !important;
    border: 1px solid #065F46 !important;
    color: #fff !important;
}

.btn-upgrade:hover {
    background-color: #fff !important;
    color: #065F46 !important;
}

.p-stepper .p-stepper-header:has(~ .p-highlight) .p-stepper-separator {
    background-color: #065F46 !important;
}


.pricing-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    padding: 20px;

}

.pricing-card {
    min-height: 170px;
    background: #fff;
    border-radius: 20px;
    padding: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.pricing-card h3 {
    font-size: 20px;
}

.pricing-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.pricing-row input,
.pricing-row select {
    /* padding: 5px 15px; */
    text-align: center;
    /* border-radius: 15px; */
}

.summary-card {
    text-align: center;
}

.summary-card h2 {
    color: #333;
}

.proceed-button {
    background-color: #065F46;
    color: #fff;
    border-radius: 20px;
    padding: 8px 20px;
    font-weight: 600;
    cursor: pointer;
    border: solid 1px #1D4F3A;
}

.proceed-button:hover {
    background-color: #1D4F3A;
}

.sub-plane .cancel-new-btn {
    border-radius: 50px !important;
    padding: 8px 30px !important;
    font-size: 13px !important;
}


.text-start {
    text-align: start !important;
}

.ms-3 {
    margin-left: 3rem !important;
}

.bottom-border-0 {
    border-bottom: none !important;
}

.apy-btn .proceed-button {
    padding: 5px 15px;
}

.apy-btn {
    display: flex;
    justify-content: flex-start !important;
    align-content: flex-start !important;
    flex-direction: column !important;
    align-items: flex-start !important;
}


.apy-btn .form-control {
    border: 1px solid #E4E4E4 !important;
}


.subscription-page {
    max-width: 500px;
    margin: 50px auto;
    padding: 20px;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #f9f9f9;
}

.subscription-title {
    color: #000;
    margin-bottom: 10px;
}

.subscription-message {
    font-size: 18px;
    margin-bottom: 20px;
    color: #555;
}

.subscription-details {
    text-align: left;
    font-size: 16px;
    line-height: 1.6;
}

.subscription-button {
    margin-top: 20px;
    padding: 10px 20px;
    font-size: 18px;
    color: #fff;
    background-color: #28a745;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
}

.subscription-button:hover {
    background-color: #218838;
}

.justify-content-center {
    justify-content: center !important;
}

.text-greenw {
    color: #065F46 !important;
}

.w-50 {
    width: 50% !important;
}

.p-50-18 {
    padding: 50px 18px !important;
}

.chenterprise .form-control {
    padding-left: 0 !important;
}

.new-task-popup-container-bar {
    max-width: 500px;
    margin-top: -65px !important;
    position: relative;
    z-index: 100;
    margin-left: 40px;
}
.d-flex-direction-column{
    flex-direction: column !important;
}
#planDetails .modal-dialog{
    min-width: 1000px !important;
}
 #planDetails .plan-details-modal{
    min-width: 1000px !important;
}
.plan-details-modal .modal-body{
    padding: 10px !important;
}
.mt--50px{
    margin-top: -50px !important;
}
/* 130225 */
.nav.update-popup-nav-tabs{
    background-color: #EEF4F5;
    border-radius: 47px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: 50px;
    margin-bottom: 20px !important;
}


.nav.update-popup-nav-tabs>li>a {
    position: relative;
    display: block;
    padding: 0px 15px;
    padding-top: 5px;
}
.nav.update-popup-nav-tabs>li>a:hover {
    background-color: #EEF4F5 !important;
    color: #fff !important;
}
.update-popup-nav-tabs li {
    font-size: 16px;
    padding: 5px 0px;
    margin-bottom: 0px;
    margin-right: 0px;
}
.update-popup-nav-tabs li.active {    
    border-bottom: none !important;  
   
}
.update-popup-nav-tabs li a svg{    
    border-bottom: none !important;
    width: 48px;
    height: 32px;
    padding: 5px;
    text-align: center;
   
}
.update-popup-nav-tabs li.active a svg {
    background-color: #065F46;
    fill: white;
    width: 48px;
    height: 32px;
    border-radius: 28px;
    padding: 5px;
    text-align: center;
    border-bottom: none !important;
}


.update-popup-nav-tabs li.active a svg path {
    fill: white;
}
.taskRightcol .update-popup-position {
    position: relative;
    z-index: 1;
    /* top: 5px; */
    /* right: 20px; */
    width: 36px;
    display: flex !important;
    justify-content: flex-end !important;
    border-top-right-radius: 15px !important;
    /* background-color: #EEF4F5 !important; */
}
.subscription-payment-history {
    display: flex;
    justify-content: flex-end;
    padding: 3px 5px;
    margin-top: 5px;
}
.d-flex-space-between-align-center {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.project-milestone-info {
    font-size: 0.85rem;
    margin-top: 2px;
    color: #6c757d; /* Bootstrap muted color */
  }
  
  .back-icon {
    width: 20px;
    height: 20px;
    cursor: pointer;
    margin-top: 4px;
  }
  
.project-name-milestone-info {
    margin-top: -10px;
    margin-bottom: 15px;
    font-size: 18px;
    font-weight: 700;
}
.settings-pending-user-email{
    width: 100%;
    height: 50px;

}
.settings-pending-box-height{
    min-height: 290px !important;
}


.taskBox .six-dot-icon-task-list path{
    width: 25px;      
    display: block;  
    fill: #ffffff;
    transition: fill 0.3s ease;
  /* border-radius: 8px;  */
}
.drag-handle{
   width: 25px;
   padding: 0px px 5px 0px;
}

.taskBox:hover .six-dot-icon-task-list path{
    fill: #cccccc;
}
.drag-icon-img {
    width: 20px;
    height: 20px;
    margin-right: 8px;
  }


/* Project Css */
.div-invoice-container{
    text-align: center;
    position: absolute;
    right: 30px;
    top: 90px;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.invoice-download-btn{
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 30px;
    background-color: #1e3f26;
    color: #fff;
}


/* 060625 */


 .common-btn-active{
    border-radius: unset !important;
    border: solid 1px #1D4F3A;
    border-radius: 30px !important;
    background-color: #1D4F3A;
    color: #fff !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 150px;
}
.common-btn-active:hover{
    background-color: #fff !important;
    color: #1D4F3A !important;
    border: solid 1px #1D4F3A !important;
}

.common-btn-cancel{
    border-radius: unset !important;
    border: solid 1px #1D4F3A !important;
    background-color: #fff;
    border-radius: 30px !important;
    color: #101010 !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 100px;
}
.common-btn-cancel:hover{
    background-color: #fff !important;
    color: #101010 !important;
    border: solid 1px #1D4F3A !important;
}


.currency-symbol{
    font-size: 32px;
    font-weight: 600;
    color: #101010;
}
.currency-amount{
   font-weight: 700;
    font-size: 36px;
    color: #101010;   
}
.unique-card-item .plan-expired-btn{
    border: solid 1px #808080;
    border-radius: 30px;
    background-color: #F0F0F0;
    color: #808080 !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 150px;
}
.unique-card-item .plan-expired-btn:hover{
    background-color: #fff !important;
    color: #1D4F3A !important;
    border: solid 1px #1D4F3A !important;
}
.card-bottom-box .plan-free-btn{
    border: solid 1px #1D4F3A;
    border-radius: 30px;
    background-color: #1D4F3A;
    color: #fff !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 150px;
}
.card-bottom-box .plan-free-btn:hover{
    background-color: #fff !important;
    color: #1D4F3A !important;
    border: solid 1px #1D4F3A !important;
}
.card-bottom-box .plan-growth-btn{
    border: solid 1px #1D4F3A;
    border-radius: 30px;
    background-color: #1D4F3A;
    color: #fff !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 150px;
}
.card-bottom-box .plan-growth-btn:hover{
    background-color: #fff !important;
    color: #1D4F3A !important;
    border: solid 1px #1D4F3A !important;
}
.card-bottom-box .plan-professional-btn{
    border: solid 1px #1D4F3A;
    background-color: #DFEDE6;
    border-radius: 30px;
    color: #101010 !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 150px;
}
.card-bottom-box .plan-professional-btn:hover{
    background-color: #fff !important;
    color: #1D4F3A !important;
    border: solid 1px #1D4F3A !important;
}
.enterprise-card-top-bg .plan-enterprise-btn{
    border: solid 1px #fff;
    background-color: #fff;
    border-radius: 30px;
    color: #101010 !important;
    letter-spacing: 0.5px;
    font-weight: 500;
    padding: 7px 20px;
    min-width: 150px;
}
.enterprise-card-top-bg .plan-enterprise-btn:hover{
    background-color: #fff !important;
    color: #101010 !important;
    border: solid 1px #1D4F3A !important;
}



.starter-card-top-bg{
    background-image: url('/images/setting/starter-card-bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;   
    width: 100%;
    position: relative;   
    border-radius: 20px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 15px;
}
.starter-title{
    border: solid 1px #EDEADF;
    background-color: #EDEADF;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    color: #101010;
}
.growth-card-top-bg{
    background-image: url('/images/setting/growth-card-bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;   
    width: 100%;
    position: relative;   
    border-radius: 20px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 15px;
}
.growth-title{
    border: solid 1px #F5E6E6;
    background-color: #F5E6E6;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    color: #101010;
}
.professional-card-top-bg{
    background-image: url('/images/setting/professional-card-bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;   
    width: 100%;
    position: relative;   
    border-radius: 20px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 15px;
}
.professional-title{
    border: solid 1px #DFEDE6;
    background-color: #DFEDE6;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    color: #101010;
}
.enterprise-card-top-bg{
    background-image: url('/images/setting/enterprise-card-bg.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;   
    width: 100%;
    position: relative;   
    border-radius: 20px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 50px 15px 0px 15px;
    text-align: center;
}
.enterprise-title{
    border: solid 1px #3A6654;
    background-color: #3A6654;
    display: inline-block;
    padding: 5px 15px;
    border-radius: 30px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    margin-top: 50;

}
.enterprise-description {
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    margin-top: 10px;
    margin-bottom: 30px;
}



.card-bottom-box{
    padding: 15px;
    text-align: center;
    margin-top: 10px;
}
 .view-plan-details {
    font-size: 13px;
    font-weight: 600;
    color: #065F46;
    padding-top: 10px;
    display: inline-block;
}

.p-stepper-nav{
    background-color: #FFFBF6;
        padding: 15px 15px;
        border-radius: 15px;
        margin-top: 10px;
    }

.downgrade-container{
    max-width: 650px;
    margin: 0 auto;
    padding: 0px;
    border-radius: 15px;
    background-color: #FFFBF6;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}   
.downgrade-bg-image{
    background-image: url('/images/setting/downgrade-bg-img.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;   
    width: 100%;
    position: relative;   
    border-radius: 15px;
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 20px 15px 0px 15px;
    min-height: 280px;
   
}

.storage-card-top-bg {
    background-image: url(/images/setting/storage-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    position: relative;
    border-radius: 20px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    padding: 15px;
}
.downgrade-content{
    position: relative;
    min-height: 270px;
}
.downgrade-confi-container{
    text-align: center;
    padding: 20px;
    max-width: 650px;
    margin: 0 auto;
    border-radius: 15px;
    background-color: #FFFBF6;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
.downgrade-confi-content-p{
    font-size: 18px;
    font-weight: 600;
    color: #101010;
    letter-spacing: 0.5px;
    margin-top: 5px;
    margin-bottom: 30px;
    padding: 0px 50px;
}

.downgrade-content-p {
    padding: 30px 0px;
    font-size: 18px;
    font-weight: 600;
    color: #101010;
    letter-spacing: 0.5px;
}
.downgrade-content-btn{
    position: relative;    
}
.downgrade-bottom-content-p{
    font-size: 12px;
    font-weight: 600;
    color: #D5A138;
    letter-spacing: 0.5px;
    padding-top: 10px;
    position: absolute;
    bottom: 0px;
    left: 0px;   
    display: block;
   
}

.div-increment-user {
    background-color: #FAFAFA;
    border-radius: 30px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 25px;
    width: 150px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);  
    margin: 0 auto;
    margin-top: 10px;
}
.div-increment-user-downgrade {
    background-color: #FAFAFA;
    border-radius: 30px;
    display: inline;   
    padding: 4px 25px;   
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
    margin: 0 auto;
    margin-top: 10px;
}

  .div-increment-user .arrow {
    font-size: 18px;
    color: #838D88;
    cursor: pointer;
  }

  .div-increment-user .number {
    font-size: 18px;
    color: #838D88;
  }

  .div-ddl-add-on {     
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 25px;
    width: 200px;   
    margin: 0 auto;   
}
.ddl-add-on-select{
    border-radius: 30px;
    background: #FAFAFA;
    border: solid 1px #FAFAFA;
    padding: 5px 10px;
    font-size: 18px;
    color: #838D88;    
    cursor: pointer;
    width: 100%;
    text-align: center;
   
}
.pd20{
    padding: 20px !important;
}

.add-on-pay-details-box{
    padding: 10px 20px !important;
   background-color: #FFFBF6 !important;
   border-radius: 10px;
   text-align: center;  
  
}
.pay-detaill-inner-item {
    padding: 20px;
    max-width: 500px;
    margin: 0 auto;
    height: 100%;
    margin-top: 60px;
}
.pay-text-head{
    font-size: 14px;
    font-weight: 600;   
    margin-bottom: -10px;
}
.min-height-upgrade-cols{
    min-height: 280px !important;
}