/*-----------loader modal css-------------*/
.modal_loader {
    display: none; /*Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 9999; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

.content_loader {
    margin: 22% auto 0;
    width: 28%;
    text-align: center;
    background-color: transparent;
    padding: 3% 5%;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14pt;
    border-radius:20px;
    color:white;
    text-shadow:none;
}

#loader {
    width: 100%;
    height: 100%;
}

@media only screen and (max-width:500px) {
    .content_loader {
        margin: 50% auto 0;
        width: 80%;
    }
}
@media only screen and (min-width:501px) and (max-width:1000px) {
    .content_loader {
        margin: 25% auto 0;
        width: 55%;
    }
}

.loaderCenterOuter {
    width:100%;
}
.loaderCenterInner {
    text-align:center;
}

.loaderCenter {
    text-align: center;
}

/*-----------flip card css-------------*/
#Staff_FlipCard_MainWrapper {
    /*margin: 60px auto 10px;*/
    text-align: center;
    /*display:table-cell;*/
}
.flipCardWrapper {
    display:inline-block;
    margin:60px 7px; /*60px 8px;*/
}

.card_operation {
    width: 200px;
    height: 50px;
    border: 1px solid #CCC;
    border-radius:0 0 20px 20px;
   font-size:16px;
   line-height:30px;
}

.scene {
  width: 200px;
  height: 300px;
  border: 1px solid transparent;
  border-bottom: 1px solid #CCC;
  margin: 10px 0 0;
  perspective: 600px;
  border-radius:20px 20px 0 0;
}

.card {
  width: 100%;
  height: 100%;
  transition: transform 1s;
  transform-style: preserve-3d;
  position: relative;
    border-radius:20px 20px 0 0;
}

.card.is-flipped {
  transform: rotateY(180deg);
}

.card__face {
  position: absolute;
  width: 100%;
  height: 100%;
  /*line-height: 260px;*/
  color: white;
  text-align: center;
  font-weight: bold;
  font-size: 40px;
  backface-visibility: hidden;
  border-radius:20px 20px 0 0;
}

.card__face--front {
  background: white;
}

.card__face--back {
  background: #f9f9f9;
  transform: rotateY(180deg);
}

/*flip card content*/
.avatar_flip {
    display: block;
    margin-top: -60px;
    overflow: hidden;
    width: 100%;
}
.mx-auto {
    margin-left: auto!important;
    margin-right:auto!important;
}
.avatar_flip img {
    border: 5px solid #fff;
    background: none repeat scroll 0 0 #fff;
    width: 140px;
    line-height:10px;
    /*max-height:150px;*/
    height: 140px;
    object-fit: cover;
}
.rounded-circle {
    border-radius: 50%!important;
}
.avatar_flip .name {
    font-size:16px;
    color:black;
    line-height:20px;
    font-weight: 700!important;
    margin-top: 30px;
    margin-bottom: 50px;
}
.avatar_flip .position {
    font-size:16px;
    color:black;
    line-height:10px;
    color: #2196f3!important;
    font-weight: 700!important;
    font-family: Roboto,sans-serif;
}
.avatar_flip .status {
    font-size:12px;
    color:black;
    line-height:10px;
    color: #f39721!important;
    font-family: Roboto,sans-serif;
}
.avatar_flip .inactive_status {
    font-size:12px;
    color:black;
    line-height:10px;
    color: #c0c0c0!important;
    font-family: Roboto,sans-serif;
}
.card__face--back .avatar_flip .back_info {
    font-size:12px;
    line-height:25px;
    font-family: Roboto,sans-serif;
    color:black;
    margin: 30px 5% 0;
    text-align:left;
    word-wrap: break-word;
    word-break: break-all;
}

#FilterResultEmptyBox, #EmptyDataReturnGridDataShown {
    text-align: center;
    font-size: 14px;
    color: orange;
    margin: 20px auto 40px;
}
.tbEmptErrLbl {
    text-align: center;
    font-size: 14px;
    color: orange;
    margin: 20px auto 0;
    width: 100%;
}

#lblTotalCount {
    text-align: right;
    width: 100%;
}

.red {
    color:red !important;
}
.green {
    color:green !important;
}
.blue {
    color:blue !important;
}
.lightgrey {
    color:#b3b3b3 !important;
}
.coklat {
    color:#732b00 !important;
}
.orange {
    color:#ff9a00 !important;
}
.special {
    font-weight:700 !important;
}

.wizard_formcontrol_margin {
    margin:10px auto 30px;
    min-height:10px;
}

.wizard_formcontrol_margin_Cbox{
    margin:10px auto 30px;
    padding-top:10px;
    min-height:10px;
}

.wizard_formcontrol_margin_upload {
    margin:10px auto 30px;
    padding-top:20px;
    min-height:10px;
}

@media only screen and (max-width:767px) {
    .wizard_formcontrol_margin {
        margin: 10px auto 30px;
        min-height: 20px;
    }

    .wizard_formcontrol_margin_Cbox {
        margin: 10px auto 40px;
        padding-top: 20px;
        min-height: 20px;
    }

    .wizard_formcontrol_margin_upload {
        margin: 10px auto 30px;
        padding-top: 20px;
        min-height: 10px;
    }

    .wizard_special_3_ControlSqeeze{
        min-height:50px;
    }
}

.stepContainer {
    height:0 !important;
}

.clear_defaultFloat {
    float:none !important;
    display: inline-block;
}

.showinfo_bg {
    background-color:#eaeaed;
    border-radius: 10px;
    padding:20px 8px;
}

.img_Upload_ProfilePic {
    max-height:200px;
}

/*--------------- overwrite ---------------*/
.form-group {
    display: table;
    width: 100%;
}

.alert {
    min-width:170px;
    max-width:none !important;
}

/*----Bootstrap datetimepicker*/
.datepicker div table thead {
    background-color: transparent !important;
}
.datepicker div table thead th {
    color:black;
    border-radius:0;
    background-color:orange !important;
}
.datepicker div table thead .prev:not(.disabled):hover,
.datepicker div table thead .picker-switch:not(.disabled):hover,
.datepicker div table thead .next:not(.disabled):hover {
    background-color:#fdc96a !important;
}
.datepicker-days table td.active,
.datepicker-months table td .active,
.datepicker-years table td .active,
.timepicker div table td button{
    background-color:orange !important;
}
.datepicker-days table td.old,
.datepicker-days table td.new,
.datepicker-days table td.disabled,
.datepicker-months table tbody tr td .disabled,
.datepicker-years table tbody td .disabled,
.datepicker-decades table tbody td .disabled {
    color:#dcdcdc !important;
}
.datepicker-days table td.today {
    font-weight:700;
}
.datepicker-days table td.today:not(.active):before {
    border-bottom-color:orange !important;
}

.timepicker div table td button{
    border:1px solid #f8ffc0;
}

.enlargeNavFontAwesome {
    font-size: 18px;
    padding-right: 8px;
}

.notification_TimeRewrite {
    right: 5px !important;
    border-radius: 15px;
    background-color: rgba(214, 234, 255, 0.6);
    padding: 0 10px;
}

/* ------------------- add/view/edit MOStaff Management ------------------ */
.viewedit_triggerbtn {
    float: right;
    font-size: 16px;
    margin-right:10px;
}
    .viewedit_triggerbtn:hover {
        cursor:pointer;
    }
.viewedit_triggerbtn span{
    font-family: "Helvetica Neue", Roboto, Arial, "Droid Sans", sans-serif;
}

.viewedit_triggertxtDesc {
    float: right;
    margin-right:10px;
}
.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.errorbg, .redbg {
    background-color:red !important;
}

.redborder{
    border-color:red !important;
}

.clickable {
    cursor:pointer;
    float:right;
    margin-left:20px;
    margin-bottom: 5px;
}
.clickable:hover {
    color:#00e5ff;
}

.linkSty {
    color:blue;
    cursor:pointer;
}
.linkSty:hover {
    color:blue;
    text-decoration:underline;
}

.groupEditorTrigerer {
    position:absolute;
    top:10px;
    right:10px;
    display:none;
    cursor:pointer;
    opacity:0.5;
    font-size:16px;
}
    .groupEditorTrigerer:hover {
        color:blue;
        opacity:1;
    }
#group_NavBox:hover .groupEditorTrigerer {
    display:block;
}

#group_NavBox1:hover .groupEditorTrigerer {
    display:block;
}

.Badge_UL_Move {
    position:fixed;
    right:10px;
    top:0;
}

.MODALDIM {
    opacity:0.6 !important;
}

.btn-custom-inactive {
    color:white;
    background-color:#c4c4c4;
    border-color:#d6d6d6;
}
    .btn-custom-inactive:hover {
        color:white;
        background-color:#ababab;
        border-color:#727272;
    }
    .btn-custom-inactive:active {
        color:white;
        background-color:#898989;
        border-color:#000000;
    }
    .btn-custom-inactive:focus {
        color:white;
        background-color:#ababab;
        border-color:#2a2a2a;
    }

.blurEff {
    opacity:0.6;
}
.repeat_NoItem {
    color:orange;
    font-size:14px;
}

/* ------ custom dropdownlist design for user level ------ */
/*reset select*/
.dropdownDynamic_UserLevel {
  -webkit-appearance: none;
  -moz-appearance: none;
  -ms-appearance: none;
  appearance: none;
  outline: 0;
  box-shadow: none;
  border: 0 !important;
  background: #2c3e50;
  background-image: none;
}
/* custom select */
.select_userlevel_div {
  position: relative;
  display: block;
  width: 80%;
  height: 3em;
  line-height: 3;
  background: #2c3e50;
  overflow: hidden;
  border-radius: .25em;
  margin:5px 10px;
}
.dropdownDynamic_UserLevel {
  width: 100% !important;
  height: 100%;
  margin: 0;
  padding: 0 0 0 .5em;
  color: #fff;
  cursor: pointer;
  font-weight:bold;
}
    .dropdownDynamic_UserLevel option {
        font-size:12pt;
        background-color: #2f2f2f;
        color: #f39c12;
    }
.dropdownDynamic_UserLevel::-ms-expand {
  display: none;
}
/* Arrow */
.select_userlevel_div::after {
  content: '\25BC';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 0 1em;
  background: #34495e;
  pointer-events: none;
  color: white;
}
/* Transition */
.select_userlevel_div:hover::after {
  color: #f39c12;
}
.select_userlevel_div::after {
  -webkit-transition: .25s all ease;
  -o-transition: .25s all ease;
  transition: .25s all ease;
}

#BoxHoldingMoreStaff {
    text-align:center;
}
#hdn_ShowSaysSocietySetLinkedMessage {
    font-weight:bold;
    margin-top:10px;
}
.icheckNoOpertion {
    cursor:not-allowed;
    opacity:0.5;
}
.wanderingstaff {
    -webkit-filter: grayscale(100%);
    filter: gray;
}
.masterseeManagementTxt {
    margin-top: 50px;
    font-size: 12px;
    color: #b5b5b5;
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
}

/*-------------- Facility List -------------------*/
#group_NavBox .nav li:hover {
     background-color: #f6fcfd;
}
#group_NavBox .nav .active a {
    background-color: #4c6d8e;
    border-color: #cacaca;
	color:white;
}

#group_NavBox1 .nav li:hover {
     background-color: #f6fcfd;
}
#group_NavBox1 .nav .active a {
    background-color: #4c6d8e;
    border-color: #cacaca;
	color:white;
}


.nxtMaintSmall {
    /*color: #ffd166 !important;
    font-size: 12px;*/
    color: #000 !important;
    font-size: 14px;
    font-weight:300;
    margin: 0 10px;
}

.LongText_tdStyle {
    max-height: 100px;
    overflow-x: hidden;
    overflow-y: auto;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 400px;
    margin: 0 auto;
}

.faciPendignCount {
    font-weight:bold;
    color:#007bff;
}


/*--------------- My Profile  ------------------*/
#myprofile_tab .nav-tabs { border-bottom: 2px solid #DDD; }
    #myprofile_tab .nav-tabs > li.active > a, #myprofile_tab .nav-tabs > li.active > a:focus, #myprofile_tab .nav-tabs > li.active > a:hover { border-width: 0; }
    #myprofile_tab .nav-tabs > li > a { border: none; color: #bdbdbd; }
    #myprofile_tab .nav-tabs > li > a:hover { background-color:#f1f1f1; color: #5a4080; }
        #myprofile_tab .nav-tabs > li.active > a, #myprofile_tab .nav-tabs > li > a:hover { border: none;  color: #5a4080 !important; background: #fff; }
        #myprofile_tab .nav-tabs > li > a::after { content: ""; background: #5a4080; height: 2px; position: absolute; width: 100%; left: 0px; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); }
    #myprofile_tab .nav-tabs > li.active > a::after, #myprofile_tab .nav-tabs > li:hover > a::after { transform: scale(1); }
#myprofile_tab .tab-pane { padding: 15px 0; }
#myprofile_tab .tab-content {padding:20px}

#myprofile_tab .nav-tabs > li  {width:50%; text-align:center;}
#myprofile_tab .nav-tabs > li > a > span {font-weight:700;}
#myprofile_tab .nav-tabs > li.active > a {background: orange;}
#myprofile_tab .nav-tabs > li.active > a > span { font-size:16px; }
#myprofile_tab .nav-tabs > li.active > a > .fa { display:inline-block !important; }
#myprofile_tab {background: #FFF none repeat scroll 0% 0%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); margin-bottom: 30px; border-radius: 0.25rem; }

.lasttab_clearmargin {
    margin-right:0 !important;
}

#myprofile_username {
    margin-top:24pt;
    margin-bottom:16pt;
    font-size:16pt;
    font-weight:700;
}

.singleBtn {
    width: 50%;
    height: 50px;
    border-radius: 200px;
    font-size: 14pt;
    font-weight: 700;

    border: 1px solid #e5e5e5;
    -webkit-box-shadow: 1px -2px 30px 2px rgba(217,217,217,1);
    -moz-box-shadow: 1px -2px 30px 2px rgba(217,217,217,1);
    box-shadow: 1px -2px 30px 2px rgba(217,217,217,1);
}

#ItemLegends {
    font-weight:700;
    min-width:300px;
    border:1px #d8d4d4 solid;
   border-radius:10px;
    padding:10px 5px;
}
    #ItemLegends:hover {
         border-color:black;
         background-color:aliceblue;
    }



@media (max-width: 740px) {
    #ItemLegends {
        margin-top:20px;
        width:60%;
    }
}

.legends-redbg,
.legends-orangebg,
.legends-blackbg,
.legends-bluebg, .legends-greenbg, .legends-aginginactiveunit {
    width: 15px;
    height: 15px;
    border: 1px solid grey;
    display: inline-block;
    margin-right:10px;
}
.legends-redbg {
    background-color:red;
}
.legends-orangebg {
    background-color:orange;
}
.legends-blackbg {
    background-color:black;
}
.legends-bluebg {
    background-color:blue;
}
.legends-greenbg {
    background-color:green;
}
.legends-aginginactiveunit {
    color: #c8c8c8;
    background-color: #efefef;
}

/*.passwordgroup > input[type=password] + .glyphicon,*/
.passwordgroup > .passwordToggleRebind {
   cursor: pointer;
   pointer-events: all;
   color:#7d7d7d;
}

/*--------------- Resident  ------------------*/
#multi_tabRow.panel-white {
    background: #fff;
}

#multi_tabRow ul.panel_tabs li {
    padding-left: 8px;
}

#multi_tabRow .nav-tabs>li>a {
    border-radius: 0!important;
    color: #777;
    border-bottom: 1px solid #DDD;
}
#multi_tabRow ul.panel_tabs a {
    /* color: red !important; */
    font-size: 15px;
    font-weight: 700;
}
#multi_tabRow ul.panel_tabs a {
    padding: 5px;
}
#multi_tabRow .nav-tab, #multi_tabRow .nav-tabs a {
    background: none repeat scroll 0 0 #f1f4f9;
}

#multi_tabRow ul.panel_tabs li {
    padding-left: 8px;
}

#multi_tabRow .nav-tabs>li.active>a, #multi_tabRow .nav-tabs>li.active>a:focus, #multi_tabRow .nav-tabs>li.active>a:hover {
    color: #555;
    cursor: default;
    background-color: #fff;
    border-bottom-color: #fff;
}
#multi_tabRow .nav-tabs>li>a:hover {
    background: #f1f1f1;
}
#multi_tabRow ul.panel_tabs a:focus, #multi_tabRow ul.panel_tabs a:hover {
    background: #fff !important;
}

#multi_tabRow .nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}

.clearx_title {
    border-bottom: 0;
    padding: 0;
    margin-bottom: 0;
}

#DynamicLoad_ActiveResident tr td,
#DynamicLoad_PendingResident tr td,
#DynamicLoad_DisabledResident tr td,
#DynamicLoad_UnusedResident tr td{
    vertical-align: middle;
    text-align:center;
}
#DynamicLoad_ActiveResident tr:hover td,
#DynamicLoad_PendingResident tr:hover td,
#DynamicLoad_DisabledResident tr:hover td,
#DynamicLoad_UnusedResident tr td:hover td{
    background-color:rgba(236,253,255,0.4);
    transition: background-color 0.5s ease;
}
#DynamicLoad_ActiveResident .editControl,
#DynamicLoad_PendingResident .editControl,
#DynamicLoad_DisabledResident .editControl,
#DynamicLoad_UnusedResident .editControl{
    text-align:center;
}
#DynamicLoad_ActiveResident tr td .div_valignmid a,
#DynamicLoad_PendingResident tr td .div_valignmid a,
#DynamicLoad_DisabledResident tr td .div_valignmid a,
#DynamicLoad_UnusedResident tr td .div_valignmid a{
    color:blue;
    cursor:pointer;
}
#DynamicLoad_ActiveResident tr td .div_valignmid a:hover,
#DynamicLoad_PendingResident tr td .div_valignmid a:hover,
#DynamicLoad_DisabledResident tr td .div_valignmid a:hover,
#DynamicLoad_UnusedResident tr td .div_valignmid a:hover{
    text-decoration:underline;
}

.resident_imgintable {
    width: 40px;
    /*margin: 0 10px 0 0;*/
    border-radius: 20px;
}
.ImportantContact_imgintable {
    width: 50px;
	min-height:50px;
    margin: 0 0px 0 0;
    border-radius: 20px;

}
.divsidebyside {
    display:inline-block;
}
.div_valignmid {
    vertical-align: middle;
}
.table_wrapperScroll {
    width:100%;
    /*overflow-x:hidden;*/
}
.btnsamesize_resTable {
    /*width:90px;*/
}


.btnviewtable {
    background-color:#4B5F71;
}
.btnviewtable:hover {
    background-color:#6f889e;
}
.btnviewtable:active {
    background-color:#3f464c !important;
}
.btnedittable {
    background-color:#12AFCB;
}
.btnedittable:hover {
    background-color:#4fcfe6;
}
.btnedittable:active {
    background-color:#548694 !important;
}
.btndeletetable {
    background-color:#f25656;
}
.btndeletetable:hover {
    background-color:#ef7373;
}
.btndeletetable:active {
    background-color:#d04b4b !important;
}
.btnapprovetable {
    /*background-color:#1ABB9C;*/
}

.btnapprovetable:active {
    /*background-color:#165f16 !important;*/
}
.btnrejecttable {
    /*background-color:red;*/
}
.btnrejecttable:hover {
    /*background-color:#ff6262;*/
}
.btnrejecttable:active {
    /*background-color:#ab2d2d !important;*/
}

.backtoOriLinkStyle {
    color: #337ab7;
    text-decoration: none;
    font-weight: 700;
}
.backtoOriLinkStyle:hover {
    color: blue;
    text-decoration: underline;
}

#ViewResident_ContentBox .userprofile > div > .item,
#ViewResident_ContentBox .itemUN {
    margin-bottom: 5px;
    background-color:#f7f7f7;
    padding-top:5px;
}

#ViewResident_ContentBox .itemUN {
    margin-top: 10px;
    text-align: left;
}

#ViewResident_ContentBox .itemOut {
    margin-bottom: 5px;
    padding-top:5px;
}

.modalTopBtn {
    margin:10px 10px 10px 5px;
}
#ViewResident_ContentBox > .modalTopBtn:nth-of-type(1)  {
    margin-right:20px;
}
.right {
    float:right !important;
}

.overwriteDTPick1 {
    padding:0;
    margin-bottom: 20px;
}
    .overwriteDTPick1 > input[type=text] {
        height:38px;
        padding-right: 10px;
    }

.overwriteDTPick2 {
    left:5px !important;
}

.daterangepicker > .calendar > .calendar-table > .table-condensed  th.month > .monthselect,
.daterangepicker > .calendar > .calendar-table > .table-condensed  th.month > .yearselect {
    color:grey;
}

.faicon_Control {
    color: #b3b3b3;
}
    .faicon_Control:hover {
        color: #000000;
        cursor: pointer;
    }
    .faicon_Control:active {
        color: grey;
        cursor:default;
    }

.faiconplus_Control {
    color: deepskyblue;
}
    .faiconplus_Control:hover {
        color: blue;
        cursor: pointer;
    }
    .faiconplus_Control:active {
        color: aliceblue;
        cursor: default;
    }
.emergcontact_p {
    color: #cc012f;
    font-weight: bold;
    text-decoration: underline;
    font-size: 14pt;
}
/*.nav-tabs { border-bottom: 2px solid #DDD; }
    .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { border-width: 0; }
    .nav-tabs > li > a { border: none; color: #ffffff;background: #5a4080; }
        .nav-tabs > li.active > a, .nav-tabs > li > a:hover { border: none;  color: #5a4080 !important; background: #fff; }
        .nav-tabs > li > a::after { content: ""; background: #5a4080; height: 2px; position: absolute; width: 100%; left: 0px; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); }
    .nav-tabs > li.active > a::after, .nav-tabs > li:hover > a::after { transform: scale(1); }
.tab-nav > li > a::after { background: #5a4080 none repeat scroll 0% 0%; color: #fff; }
.tab-pane { padding: 15px 0; }
.tab-content{padding:20px}
.nav-tabs > li  {width:20%; text-align:center;}
.card {background: #FFF none repeat scroll 0% 0%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); margin-bottom: 30px; }
body{ background: #EDECEC; padding:50px}

@media all and (max-width:724px){
.nav-tabs > li > a > span {display:none;}	
.nav-tabs > li > a {padding: 5px 5px;}
}*/

/*---------------- Manage Invoice Page --------------*/
#InvTemplate_DocumentState,
#Inv_DocumentState {
    font-weight: 700;
    color: red;
    text-transform: uppercase;
    padding: 10px 20px;
    border: 1px solid #c0f6ff;
    float: left;
    border-radius: 10px;
    background-color: aliceblue;
}

#payment-invoice_breadcrumb .breadcrumb-item.active {
    font-weight:bold;
    font-size:16px;
}

#tb_InvoiceTemplate .edit_Control {
    font-weight:700;
}
#tb_InvoiceList .edit_Control{
    font-weight:700;
    text-align:center
}

#tb_InvoiceTemplate .edit_Control .controldiv,
#tb_InvoiceList .edit_Control .controldiv {
    display:none;
    text-align:right;
    margin-top: 10px;
    /*background-color: #bef6ff;*/
	background-color: #dae5ef;
    padding: 10px;
    border-radius: 12px;
    transition: 0.5s;
}
#tb_InvoiceTemplate .edit_Control .controldiv {
    text-align: left;
}

#tb_InvoiceTemplate tr:hover .edit_Control .controldiv, 
#tb_InvoiceList tr:hover .edit_Control .controldiv {
    display:block;
}
#tb_InvoiceTemplate tr:hover .btnApproveInMaintenanceInv {
    display:block !important;
    margin: 10px auto;
}
#tb_InvoiceTemplate .seeInvList_a_btncls {
    padding:5px 10px;
    border:solid #bfbfbf 1px;
    color:blue;
    display: block;
    display:none;
}

#tb_InvoiceTemplate tr:hover .seeInvList_a_btncls {
    display:inline-block;
}
#tb_InvoiceTemplate tr:hover .seeInvList_a_btncls:hover {
    cursor:pointer;
    background-color:black;
    color:white;
}

.nopointer {
    cursor:default;
}

.invTemplateEditorTitle {
    text-align: center;
    font-size: 18pt;
    font-weight: 700;
    text-shadow: 2px 2px #cacaca;
}

#FinalTotalinTB_DynTableInvTemplate {
    font-size: 18px;
    font-weight: 700;
    text-align: right;
}

.editorLinkSty {
    cursor:pointer;
}

#DynamicTb_TemplateItem {
text-align:center;
}

#DynamicTb_TemplateItem tbody tr:hover {
    cursor:pointer;
    background-color:#d1f4ff;
}
#DynamicTb_TemplateItem tbody tr:hover.SetSelectedRow {
    cursor:default;
}

.SetSelectedRow {
    border:3px solid #bfbfbf;
     box-shadow: 4px -3px #edd5ff;
}
.SetFocusedField {
    background-color: #f7ffe5;
}

#DynamicTb_TemplateItem tfoot {
    background-color:#dde9ff;
}

.makeitlookasclickable_Link {
    text-decoration:underline;
}

.invoiceList_ImageSymbol {
    width:100%;
    max-height:500px;
}

.makeHorzoneline {
    display:inline-block;
}

#FinalTotal_inTB_DynTableInv {
    text-align:right;
    font-weight:bold;
}
.tableFooterGrandTotal {
    padding: 10px 0;
    float:right;
    font-weight:bold;
}

.sp_RedHover { color: #ff3636; }
.sp_RedHover:hover { color: red; cursor:pointer; }
.sp_UndoHover { color: #009fff; }
.sp_UndoHover:hover { color: blue; cursor:pointer; }
.cancelTempRow td {
    color: red;
}

.tableFooterCNClaimTax {
    float:right;
    font-size:12px;
    color:green;
    text-align:right;
}

.chooseblockICheck {
    display:inline-block; 
    margin-right:10px;
    padding:5px;
    margin-top: 0;
}
    .chooseblockICheck div {
        margin-right: 5px;
    }
    .chooseblockICheck:hover {
        font-weight:bold;
        background-color:aliceblue;
        cursor:default;
    }


#boxtabSelect_InvoiceList_Block.panel-white {
    background: #fff;
}

#boxtabSelect_InvoiceList_Block ul.panel_tabs li {
    padding-left: 8px;
}

#boxtabSelect_InvoiceList_Block .nav-tabs>li>a {
    border-radius: 0!important;
    color: #777;
    border-bottom: 1px solid #DDD;
}
#boxtabSelect_InvoiceList_Block ul.panel_tabs a {
    /* color: red !important; */
    font-size: 15px;
    font-weight: 700;
}
#boxtabSelect_InvoiceList_Block ul.panel_tabs a {
    padding: 5px;
}
#boxtabSelect_InvoiceList_Block .nav-tab, #boxtabSelect_InvoiceList_Block .nav-tabs a {
    background: none repeat scroll 0 0 #f1f4f9;
}

#boxtabSelect_InvoiceList_Block ul.panel_tabs li {
    padding-left: 8px;
}

#boxtabSelect_InvoiceList_Block .nav-tabs>li.active>a, #boxtabSelect_InvoiceList_Block .nav-tabs>li.active>a:focus, #boxtabSelect_InvoiceList_Block .nav-tabs>li.active>a:hover {
    color: #555;
    cursor: default;
    background-color: #fff;
    border-bottom-color: #fff;
}
#boxtabSelect_InvoiceList_Block .nav-tabs>li>a:hover {
    background: #f1f1f1;
}
#boxtabSelect_InvoiceList_Block ul.panel_tabs a:focus, #boxtabSelect_InvoiceList_Block ul.panel_tabs a:hover {
    background: #fff !important;
}

#boxtabSelect_InvoiceList_Block .nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}

.BatchPDFChooser_Box {
    padding: 15px 20px;
    background-color: #e9e9e9;
    margin-top: 10px;
    overflow-y:auto;
    max-height:500px;
    width: 100%;
}
.txt_BatchPDF_TickCount {
    font-weight:bold;
}
.BatchPDFChooser_ByBlock {
    width: 48%;
    display: inline-grid;
    margin-right:1.5%;
    margin-bottom:10px;
    padding:5px 5px 0;
}
@media only screen and (max-width: 600px) {
    .BatchPDFChooser_ByBlock {
        width: 100%;
        display: inline-grid;
        margin-right:0;
        margin-bottom:20px;
    }
}
.BatchPDFChooser_ByBlock:hover {
    background-color:#fefff2;
}
.BatchPDFChooser_BlockTitle {
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    text-decoration:underline;
    text-overflow:ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
    .BatchPDFChooser_BlockTitle:hover {
        white-space:normal;
    }
.BatchPDFChooser_MainUnitInvoiceAll {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    max-height: 400px; /* account for borders */
    min-height: 60px;
    padding: 0;
    margin: 0;
    overflow-x:auto;
}
.BatchPDFChooser_EachUnitInvoice {
    display:flex;
    margin:0px;
}
    .BatchPDFChooser_EachUnitInvoice:hover {
            background-color:aliceblue;
    }
        .BatchPDFChooser_EachUnitInvoice:hover .BatchPDFChooser_Child p {
            font-size:13px;
            text-decoration:underline;
            line-height: 10px;
            margin-top: 10px;
        }
        .BatchPDFChooser_EachUnitInvoice:hover .BatchPDFChooser_Child span {
            font-weight: bold;
            font-size:12px;
            color:blue;
        }
        .BatchPDFChooser_EachUnitInvoice.selected, .BatchPDFChooser_EachUnitInvoice.selected .BatchPDFChooser_Child span {
            color: #00b900 !important;
        }
        .BatchPDFChooser_EachUnitInvoice.noinvoiveunit, .BatchPDFChooser_EachUnitInvoice.noinvoiveunit .BatchPDFChooser_Child span {
            color: #adadad !important;
        }
    .BatchPDFChooser_EachUnitInvoice.noinvoiveunit {
         opacity: 0.7;
    }
        .BatchPDFChooser_EachUnitInvoice.noinvoiveunit:hover {
            cursor: not-allowed;
            opacity:1;
        }
        .BatchPDFChooser_EachUnitInvoice.noinvoiveunit:hover .IsTextCol {
            width:auto;
        }
        .BatchPDFChooser_EachUnitInvoice:hover .BatchPDFChooser_Child.IsTextCol {
        overflow-x:visible;
        text-overflow:initial;
    }
.BatchPDFChooser_TickAllBlock {
    margin:0;
    padding: 10px 0;
}
    .BatchPDFChooser_TickAllBlock:hover {
        background-color: #c7c7c7;
        padding: 10px 5px;
        cursor:pointer;
    }
.BatchPDFChooser_TickAllBlock p{
    display:inline-block;
    font-weight: bold;
    vertical-align: middle;
    margin:2px 0 0 10px;
}
.BatchPDFChooser_Child {
    float:left;
    min-height:40px;
    padding-bottom:5px;
}
    .BatchPDFChooser_Child .checkbox, .BatchPDFChooser_Child .nocheckbox {
        width:35px;
        text-align: center; 
        display:inline-block;
        margin-top:10px;
    }
    .BatchPDFChooser_Child.IsTextCol {
        padding-right: 10px;
        width: 110px;
        overflow-x:hidden;
        text-overflow:ellipsis;
        white-space: nowrap;
        min-width: 110px;
    }
    .BatchPDFChooser_Child p {
        font-weight: bold;
        font-size: 11px;
        margin-top: 12px;
        margin-bottom: 0;
        line-height: 5px;
    }
    .BatchPDFChooser_Child span {
        font-size:10px;
    }

.BatchPDFChooser_Box .errorText {
    text-align: center;
}
.BatchPDFChooser_Box .infoText {
    margin: 10px 5px 5px 15px;
    text-align: center;
}


/*-------------- manage utility page ------------------*/
.newTemplateBillDateTitle {
    font-weight:bold;
    text-align:center;
}
.newTemplateDescriptionClickable {
    color:black;
}
.newTemplateHiddenSelectionActionButton {
    color:#5A738E;
    margin-top: 0;
    background-color: #dae5ef;
    padding: 0;
    border-radius: 12px;
    transition: 0.6s ;
    font-weight:700;
    height:0;
    overflow:hidden;
}
    .newTemplateHiddenSelectionActionButton p:hover {
        cursor:pointer;
        color:#23527c;
    }

.SetOpenRow {
    background-color: #ffecd3 !important;
}
.SetOpenRow .newTemplateHiddenSelectionActionButton {
    /*display:block;*/
    height:auto;
    margin-top: 10px;
    padding: 10px;
}
.newTemplateHiddeninTableButtonHoverShow {
    display:none;
}
    .SetOpenRow .newTemplateHiddeninTableButtonHoverShow {
        display:block;
    }

.indicatorPreviousDataBoxLegend {
    display:inline-block;
    width:10px;
    height:10px;
    background-color:#0089ff;
}
.indicatorErrorDataBoxLegend {
    display:inline-block;
    width:10px;
    height:10px;
    background-color:red;
}
.indicatorTextBoxLegend {
    font-size:14px;
}

#tb_UtilityBills .seeInvList_a_btncls {
    padding:5px 10px;
    border:solid #bfbfbf 1px;
    color:blue;
    display: block;
}
#tb_UtilityBills tr:hover .seeInvList_a_btncls:hover {
    cursor:pointer;
    background-color:black;
    color:white;
}

#tb_UtilityBillUnitList .edit_Control .controldiv {
    margin-top: 10px;
	background-color: #dae5ef;
    padding: 10px;
    border-radius: 12px;
    transition: 0.5s;
    display:none;
}
#tb_UtilityBillUnitList tr.SetOpenRow .edit_Control .controldiv {
    background-color: #dae5ef;
    display:block;
}
#tb_UtilityBillUnitList tr.SetOpenRow .edit_Control .controldiv a{
    cursor: pointer;
    color:#000086;
}
#tb_UtilityBillUnitList tr.SetOpenRow .edit_Control .controldiv a:hover{
    color:blue;
}

.HiddenDetailsShowIfToSee {
    margin:0;
    padding:0;
    height:0;
    overflow:hidden;
    background-color:#e3e3e3;
    color:#0077ff;
    transition: 0.6s;
}
.SetOpenRow .HiddenDetailsShowIfToSee {
    height:auto;
    margin: 5px;
    padding: 5px;
}

.morebilltotaldetail {
    color:blue !important;
    opacity:0.6;
    transition:0.6s;
}
.morebilltotaldetail:hover {
    opacity:1;
}

.outdatedDataDisplayIndicator {
    padding: 2px 4px;
    background-color: #ff3e3e;
    border-radius: 4px;
    font-size: 10px;
    color: white;
    margin: 0 0 0 5px;
}
.updateprevreadingDataDisplayIndicator {
    padding: 2px 4px;
    background-color: #4caf50;
    border-radius: 4px;
    font-size: 10px;
    color: white;
    margin: 0 0 0 5px;
}
.tdcenter {
    text-align: center;
}

.seebillsingletotaltb {
    width:55%;
    float:right;
    font-size: 14px;

}

    .seebillsingletotaltb td {
        border:1px solid #cacaca;
    }
.normaltotalrow {
    background-color: #f8f8f8;
}
.finalotalrow,.outstandingrow, .sayspaidrow {
    font-size:16px;
    font-weight: bold;
    background-color: aliceblue;
}
.paidrow {
    background-color: #ffdd7d;
} 

.titlecol{
    text-align:right;
    padding-right:10px;
}
.amtcol {
    text-align:right;
    padding-right:10px;
}

.readingrow_title {
    text-align:center;
    font-weight: bold;
    font-size: 16px;
}
.readingrow_reading {
    text-align:center;
    font-weight: bold;
    font-size: 22px;
}

.ClickableButtonLinkExpandHideTriggerer {
    color: blue;
    cursor: pointer;
    display:block;
    text-decoration:underline;
}
    .ClickableButtonLinkExpandHideTriggerer:hover {
        color: cornflowerblue;
    }
    .ClickableButtonLinkExpandHideTriggerer:active {
        color: blue;
    }
#moreDetailsImportExportReadingNotesBox {
    border:1px solid #f2f2f2;
    background-color:aliceblue;
}

.card {
    width:100%;
    height: 100%;
    transition: transform 1s;
    transform-style: preserve-3d;
    position: relative;
    border-radius: 20px 20px 0 0;
    margin-bottom: 0;
}
#exportimport_utilityupdatertab .nav-tabs { border-bottom: 2px solid #DDD; }
    #exportimport_utilityupdatertab .nav-tabs > li.active > a, #exportimport_utilityupdatertab .nav-tabs > li.active > a:focus, #exportimport_utilityupdatertab .nav-tabs > li.active > a:hover { border-width: 0; }
    #exportimport_utilityupdatertab .nav-tabs > li > a { border: none; color: #bdbdbd; }
    #exportimport_utilityupdatertab .nav-tabs > li > a:hover { background-color:#f1f1f1; color: #5a4080; }
        #exportimport_utilityupdatertab .nav-tabs > li.active > a, #exportimport_utilityupdatertab .nav-tabs > li > a:hover { border: none;  color: #5a4080 !important; background: #fff; }
        #exportimport_utilityupdatertab .nav-tabs > li > a::after { content: ""; background: #5a4080; height: 2px; position: absolute; width: 100%; left: 0px; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); } 
    #exportimport_utilityupdatertab .nav-tabs > li.active > a::after, #exportimport_utilityupdatertab .nav-tabs > li:hover > a::after { transform: scale(1); }
    #exportimport_utilityupdatertab .nav-tabs > li.active > a::after { background: #00a7f9; }
#exportimport_utilityupdatertab .tab-pane { padding: 15px 0; }
#exportimport_utilityupdatertab .tab-content {padding:20px}

#exportimport_utilityupdatertab .nav-tabs > li  {width:50%; text-align:center;}
#exportimport_utilityupdatertab .nav-tabs > li > a > span {font-weight:300;}
#exportimport_utilityupdatertab .nav-tabs > li.active > a { background: linear-gradient(to bottom, #33ccff 10%, #000066 100%); }/*background: orange;*/
#exportimport_utilityupdatertab .nav-tabs > li.active > a > span { font-size:16px; color:white; text-shadow: 0px -1px 2px #000000; }
#exportimport_utilityupdatertab .nav-tabs > li.active > a > .fa { display:inline-block !important; color:white; text-shadow: 0px -1px 2px #000000; }
#exportimport_utilityupdatertab {background: #FFF none repeat scroll 0% 0%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); border-radius: 0.25rem; }

#exportimport_utilityupdatertab .nav-tabs > li:not(active):hover {cursor:pointer;}

li.active .green {
    color:#00d100 !important;
}
li.active .red {
    color:#ff2e2e !important;
}
#exportingutilityupdaterbox {
    padding-top: 30px;
    padding-bottom: 30px;
    background-color:#f3fff7;
}
#importingutilityupdaterbox {
    padding-top: 30px;
    padding-bottom: 30px;
    background-color:#ffeece;
}

.approveBtnGoCenter {
    margin:0 auto;
}

.showIsInactiveBlock {
    color:lightgray !important;
}


#exportimport_residentupdatertab .nav-tabs { border-bottom: 2px solid #DDD; }
    #exportimport_residentupdatertab .nav-tabs > li.active > a, #exportimport_residentupdatertab .nav-tabs > li.active > a:focus, #exportimport_residentupdatertab .nav-tabs > li.active > a:hover { border-width: 0; }
    #exportimport_residentupdatertab .nav-tabs > li > a { border: none; color: #bdbdbd; }
    #exportimport_residentupdatertab .nav-tabs > li > a:hover { background-color:#f1f1f1; color: #5a4080; }
        #exportimport_residentupdatertab .nav-tabs > li.active > a, #exportimport_residentupdatertab .nav-tabs > li > a:hover { border: none;  color: #5a4080 !important; background: #fff; }
        #exportimport_residentupdatertab .nav-tabs > li > a::after { content: ""; background: #5a4080; height: 2px; position: absolute; width: 100%; left: 0px; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); } 
    #exportimport_residentupdatertab .nav-tabs > li.active > a::after, #exportimport_residentupdatertab .nav-tabs > li:hover > a::after { transform: scale(1); }
    #exportimport_residentupdatertab .nav-tabs > li.active > a::after { background: #00a7f9; }
#exportimport_residentupdatertab .tab-pane { padding: 15px 0; }
#exportimport_residentupdatertab .tab-content {padding:20px}

#exportimport_residentupdatertab .nav-tabs > li  {width:50%; text-align:center;}
#exportimport_residentupdatertab .nav-tabs > li > a > span {font-weight:300;}
#exportimport_residentupdatertab .nav-tabs > li.active > a { background: linear-gradient(to bottom, #33ccff 10%, #000066 100%); }/*background: orange;*/
#exportimport_residentupdatertab .nav-tabs > li.active > a > span { font-size:16px; color:white; text-shadow: 0px -1px 2px #000000; }
#exportimport_residentupdatertab .nav-tabs > li.active > a > .fa { display:inline-block !important; color:white; text-shadow: 0px -1px 2px #000000; }
#exportimport_residentupdatertab {background: #FFF none repeat scroll 0% 0%; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); border-radius: 0.25rem; }

#exportimport_residentupdatertab .nav-tabs > li:not(active):hover {cursor:pointer;}

#exportingresidentupdaterbox {
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #f3fff7;
}

#importingresidentupdaterbox {
    padding-top: 30px;
    padding-bottom: 30px;
    background-color: #ffeece;
}
/*-------------- pay cash/cheque page ----------------*/
.PayPdfLinkInModal {
    text-decoration: underline;
    font-weight: bold;
    display: inline-block;
    margin: 25px 0 0 10px;
}

.FutureDateInvoiceFiltered {
    color: lightgrey;
    background-color: white;
}
    .FutureDateInvoiceFiltered .noeditindicator {
        font-size:20px;
        opacity: 0.5;
    }
        .FutureDateInvoiceFiltered .noeditindicatorc2 span {
            color: lightgrey !important;
        }

.DLChqAcknwBtn {
    border:1px solid transparent;
    padding:5px 10px;
    border-radius:5px;
}
.DLChqAcknwBtn:hover {
    border:1px solid #aeaeae;
    background-color:#99deff;
    color:#3f51b5;
    cursor:pointer;
}
.DLChqAcknwBtn:active {
    border-color: #686868;
    background-color: #4eb5e7;
    color: #000000;
}

/*-------------- payment list page ------------------*/
.closecursor {
    cursor:default;
}

.MyTable_HoverOrange tbody tr:hover {
    background-color: rgba(255, 152, 0, 0.2);
    -webkit-transition: background-color 1s ease-out;
    -moz-transition: background-color 1s ease-out;
    -o-transition: background-color 1s ease-out;
    transition: background-color 1s ease-out;
}

.QuickBarBtn {
    display: block;
    width: -webkit-fill-available;
}
@media only screen and (max-width: 768px) {
    .QuickBarBtn {
        display:inline-block;
        width: 48%;
    }
}
@media only screen and (max-width: 480px) {
    .QuickBarBtn {
        display:inline-block;
        width: 45%;
    }
}
.QuickBarTitle {
    font-size:16px;
    font-weight:bold;
    text-decoration:underline;
}
.NoBSPadding {
    padding-left:0;
}
.NoBSMarginSpace {
    margin-bottom:0;
}

/*-------------- Accounting settings page ------------------*/
.accSettingEachTitle {
    border-bottom:3px solid #f1f1f1;
    font-weight:bold!important;
    padding-bottom:10px;
}
.accSettingAutoSaveMsg {
    color:#00c1e0;
    margin-bottom: 20px;
    display: block;
}
.accSettingMoreInfoBtn {
    font-size:12px;
}
    .accSettingMoreInfoBtn:hover {
        color: blue;
        cursor:pointer;
    }
    .accSettingMoreInfoBtn:active {
        color: red;
    }
.accSettingSingleBody {
    margin:10px 20px 20px;
}
.accSettingSingleBodyExplainPart {
    display:none !important;
}
.accSettingDescTable tr th, .accSettingDescTable tr td{
    border:1px solid black;
    padding:5px 10px;
    text-align:center;
}

.iconInfoMy {
    color:#c5c5c5;
    cursor: help;
}
.iconInfoMyClick {
    color:#c5c5c5;
}
    .iconInfoMyClick:hover {
        color:#005ce8;
        cursor:pointer;
    }
    .iconInfoMyClick:active {
        color:#ff8200;
    }
/*----------------- SHARE->scroll to top ---------------*/
/*Ref:https://www.templatemonster.com/blog/back-to-top-button-css-jquery/, https://codepen.io/matthewcain/pen/ZepbeR*/
#btnScrollToTop {
  display: inline-block;
  /*background-color: #FF9800;*/
  background-color: #5dc6e6;
  width: 50px;
  height: 50px;
  text-align: center;
  border-radius: 4px;
  position: fixed;
  bottom: 30px;
  right: 30px;
  transition: background-color .3s, 
    opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1000;
}
#btnScrollToTop::after {
  content: "\f077";
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  font-size: 2em;
  line-height: 50px;
  color: #fff;
}
#btnScrollToTop:hover {
  cursor: pointer;
  background-color: #333;
  opacity: 1;
}
#btnScrollToTop:active {
  background-color: #555;
}
#btnScrollToTop.show {
  opacity: .8;
  visibility: visible;
}
@media (min-width: 500px) {
  #button {
    margin: 30px;
  }
}

/*--------------- Setting Page ------------------*/
.OtherSMTPSettingCol {
    font-weight: bold;
    margin-top: 10px;
    text-decoration: underline;
    color: darkblue;
}
#div_othercustomsmtp {
    background-color:#ffd78f;
}
.customsmtp1,
.customsmtp2 {
    padding:5px;
}
.customsmtp1 {
    width:60%;
}
.customsmtp2 {
    width:20%;
    min-width:70px;
    margin-left:5px;
}

.OnlyShowWhenRowHover{
    display:block;
    transition:  opacity .5s;
    opacity:0.3;
}
.OnlyShowWhenRowHover:hover{
    transition:  opacity .5s;
    opacity:1;
}

.bg-success_btstrp_progressbar {
    background-color: #28a745!important;
}
.bg-fail_btstrp_progressbar {
    background-color: #dc3545!important;
}

.SocietyProfile_NavSlash {
    font-size: 22px;
    font-weight: bold;
    float: left;
    margin-right: 8px;
    color: black !important;
}

/*--------------- Statement Reports of Invoice Page ---------------------*/
.smallTitle {
    text-decoration: underline;
    display: inline-block;
    margin-bottom: 5px;
}
.TypeButtonActive {
    background-color:orange;
    border-color:red;
    color:black;
    font-weight:bold;
    border-width:2px;
    text-decoration:underline;
}
.TypeButtonActive:hover, .TypeButtonActive:active, .TypeButtonActive:focus {
    background-color:orange !important;
    border-color:red !important;
    color:black !important;
    cursor:default;
    box-shadow:none;
    text-decoration:underline;
}
/*
#DynamicLoad_AgingReport tbody {
    display: block;
  max-height: 400px;
  overflow-y: scroll;
}
#DynamicLoad_AgingReport thead, #DynamicLoad_AgingReport tbody tr, #DynamicLoad_AgingReport tfoot {
    display: table;
  width: 100%;
  table-layout: fixed;
}
#DynamicLoad_AgingReport thead{
  width: calc( 100% - 1.3em );
}
#DynamicLoad_AgingReport tfoot {
  width: calc( 100% - 1.3em );
}*/

.tbTotalblue, .tbTotalorange, .tbTotalred, .tbTotalgreen {
    font-weight:bold;
}
.tbTotalblue {
    color:blue;
}
.tbTotalorange {
    color:#ff8100;
}
.tbTotalred {
    color:red;
}
.tbTotalgreen {
    color:green;
}

.filter_FieldSet {
    border: 1px black solid;
    margin-bottom: 10px;
}
.filter_Legend {
    background-color: antiquewhite;
    padding: 0 20px;
    position: relative;
    left: -1px;
    border: 1px solid #ff9200;
    margin: 0;
}
.fieldset_Content {
    margin:5px 10px;
}

#txtChooseReport_Title {
    font-size:14px;
    text-decoration:underline;
}

#ChooseReport_Box {
    max-height:500px;
}
    #ChooseReport_Box .choosereportItem {
        width:100%;
        height:40px;
        border-radius:20px;
        border:1px solid #c5c5c5;
        margin:10px 0;
        line-height: 30px;
        text-align:center;
        cursor:pointer;
    }
    #ChooseReport_Box .choosereportItem:hover {
        background-color:rgba(189, 189, 189, 0.2);
    }
    #ChooseReport_Box .choosereportItem.active {
        /*border:2px solid black;
        background-color:rgba(0, 193, 0, 0.6);
        font-weight:bold;
        font-size: 16px;
        color:white;
        text-decoration:underline;*/


        border: 1px solid black;
    background-color: rgba(0 ,58 ,227, 0.6);
    font-weight: bold;
    font-size: 16px;
    color: white;
    text-decoration: underline;

    }

.RowUnitIsInactive {
    color:#c8c8c8;
    background-color:#efefef !important;
}
    .RowUnitIsInactive:hover {
        background-color:#efefef !important;
    }

@media only screen and (max-width:768px) {
    #filter_summaryreport_DtD .spantochangeidentifier {
        line-height:10px !important;
        margin-left:20px;
    }
}
@media only screen and (min-width:785px) and (max-width:991px) {
    .helperpusher.yesactive {
        width:30%;
        float:left;
    }
    .designAdjusting.yesactive {
        height:40px;
    }
}
#filter_summaryreport_DtD .labeltochangeidentifier {
    margin:0;
}
.summaryreport_workaround_BoxNoMargin1 {
    margin-bottom:0 !important;
}

/*--------------- DEPRECHATED ---------------*/
/*.alert_badInputControl {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}
.alert_badInputControl {
    float: left;
    display:block;
    padding: 6px 10px;
    color: #FFF;
    border-radius: 3px 4px 4px 3px;
    background-color: #CE5454;
    white-space: pre;
    position: relative;
    left: -15px;
    opacity: 0;
    z-index: 1;
    transition: .15s ease-out;
}
.alert_badInputControl {
    left: 0;
    opacity: 1;
}

.item .alert::after {
    content: '';
    display: block;
    height: 0;
    width: 0;
    border-color: transparent #CE5454 transparent transparent;
    border-style: solid;
    border-width: 11px 7px;
    position: absolute;
    left: -13px;
    top: 1px;
}*/

.csoon {
    color: green;
    font-size:10px;
}

.smallSeperateDistance {
    margin:0 5px;
}

.buttonAsListShowBoxHolder {
    background-color: rgba(240, 248, 255, 0.8);
    padding: 10px 20px;
}

.EDITNEWINVMODALOUTTER {
    width:96%;
    margin: 0 auto;
}
.EDITNEWINVMODALINNER {
    width: 100%;
}

/*--------------------- Parcel ---------------------*/
.FilterLblStyle {
    width:100px;
}
 .FilterCtrlBoxStyle {
    display:inline-block;
    min-width:200px;
    width:20%;
}
.FilterLblStyle_col2 {
    min-width:50px;
    width:5%;
}
.cancelbutton {
    display: inline-block;
    width: 20px;
    height: 20px;
    text-align: center;
    margin: 0 10px;
    cursor: pointer;
    font-weight: bold;
    color: white;
    background-color: red;
    border-radius: 5px;
    box-shadow: rgba(62, 62, 62, 0.73) 0px 0px 4px 1px;
}
    .cancelbutton:hover {
        opacity:0.8;
    }
    .cancelbutton:active {
        top: -3px;
        position: relative;
    }
.searchbutton {
    display: inline-block;
    width: 20px;
    height: 20px;
    text-align: center;
    margin: 0 10px;
    cursor: pointer;
    font-weight: bold;
    color: white;
    background-color: #00c7ff;
    border-radius: 5px;
    box-shadow: rgba(62, 62, 62, 0.73) 0px 0px 4px 1px;
}
    .searchbutton:hover {
        opacity:0.8;
    }
    .searchbutton:active {
        top: -3px;
        position: relative;
    }

.viewimagebutton {
    display: inline-block;
    width: 25px;
    height: 25px;
    text-align: center;
    margin: 0 10px;
    cursor: pointer;
    font-weight: bold;
    color: white;
    background-color: #24bbff;
    border-radius: 5px;
    box-shadow: rgba(62, 62, 62, 0.73) 0px 0px 4px 1px;
    font-size: 18px;
}
    .viewimagebutton:hover {
        opacity:0.8;
    }
    .viewimagebutton:active {
        top: -3px;
        position: relative;
    }

.rewriteDTblBtnTxt span {
    color:#333;
}

/*.noheaderModalClose {
    margin-top: 15px;
    margin-right: 20px;
}*/
.defaultmodalviewimage {
    width: 80%;
    height: 500px;
    max-width: 500px;
    max-height: 500px;
    display: block;
    margin: 50px auto 20px;
}
.modalviewnamelabel {
    text-align: center;
    margin-bottom: 50px;
}
.viewerimage_downloadbutton {
    text-align:center;
    width:200px;
    background-color: #128d00;
    padding: 8px 16px;
    border-radius: 5px;
    border: 1px solid #b9b9b9;
    margin: 0px auto 20px;
    font-weight: bold;
    color: white;
}
    .viewerimage_downloadbutton:hover {
        cursor:pointer;
        background-color: #18c000;
        border-color: black;
    }
    .viewerimage_downloadbutton:active {
        background-color: #16ae00;
        border-color: #ffb200;
    }

.ImageModalDefaultMustHave {
    display: block;
    margin: 50px auto 20px;
}
.squareImage {
    height:80%;
    max-width:500px;
    max-height:500px;
}
.wLongImage {
    width:80%;
    max-width:500px;
}
.hLongImage {
    width: 95%;
    height:80%;
    max-height:500px;
}

/*----------------- DN/CN page ---------------------*/
.formNoControlLbl {
    display: block;
    height: 30px;
}
.formTopPushLbl {
    padding-top: 5px;
}

.tableFooterGrandTotal2 {
    text-align: right;
}
.TotalTitleCenter {
    text-align: center;
}
.TotalToRight {
    text-align: right;
}


/*------------------- NEW Invoice Template Manage Delete Maintenance Invoice -----------------------*/
.delM_OutsideBox {
    width:100%;
    background-color:aliceblue;
    display:inline-block;
}
.delM_ModalSocietyTitle {
    font-weight:700;
}

.delM_BlockSelection:not(.active):hover,
.delM_UnitEach:not(.s_Inactive):hover:not(.s_Published):hover:not(.s_NoInvoice):hover {
    cursor:pointer;
}

.delM_BlockGroup {
    width: 100%;
    background-color: #008cff;
    padding: 0px 10px;
    margin: 10px 0 0;
}
.delM_BlockSelection {
    padding:5px 10px;
    margin:5px;
    border: 1px solid black;
    background-color:white;
    display:inline-block;
}
    .delM_BlockSelection.active {
        text-decoration:underline;
        font-weight:700;
        background-color:#01009c;
        color:white;
        font-size:15px;
        border: 2px solid #00e81a;
    }
        .delM_BlockSelection.active:hover {
            cursor: default;
        }
    .delM_BlockSelection:not(.active):hover {
        background-color:#d0d0d0;
        color:#525252;
        border-color:white;
    }

.delM_EachLevelOutsideBox {
    padding: 5px 0;
    width:100%;
    min-height:200px;
    max-height:500px;
    overflow-y:scroll;
}
.delM_LevelGroup {
    
}
.delM_LevelTitle {
    font-weight:800;
    font-size:16px;
    margin:0;
}
.delM_UnitGroup {
   margin: 0 0 10px;
}
.delM_UnitEach {
    width:120px;
    padding: 0 10px;
    border:1px solid #dcdcdc;
    margin:5px;
    display:inline-block;
    background-color:#fbfbfb;

    text-overflow: ellipsis;

    /* Required for text-overflow to do anything */
    white-space: nowrap;
    overflow: hidden;
}
    .delM_UnitEach.s_Inactive:hover,
    .delM_UnitEach.s_Published:hover, 
    .delM_UnitEach.s_NoInvoice:hover {
        cursor:not-allowed;
    }
    .delM_UnitEach.s_Inactive {
        background-color:#c5c5c5;
    }
    .delM_UnitEach.s_Published, .delM_UnitEach.s_NoInvoice {
        opacity:0.7;
    }
    .delM_UnitEach:not(.s_Inactive):hover:not(.s_Published):hover:not(.s_NoInvoice):hover {
        opacity:0.7;
        background-color:#ffb07b;
        border-color:#000000;
        color:#0011ff;
    }
    .delM_UnitEach .checkbox {
        display: inline-block;
        padding-right: 5px;
        margin-top:8px;
        margin-bottom:8px;
    }
        .delM_UnitEach .checkbox .fas {
            width: 20px;
            height: 20px;
            line-height: 22px;
        }
    .delM_UnitEach span {
        
    }

.UsedAmountLabelStyle {
    display: block;
    line-height: 30px;
    padding: 0 12px;
    font-weight: bold;
    font-size: 15px;
}

.tbold {
    font-weight: bold;
}
.minimizeTxtLbl {
    line-height: 0; 
    font-size:10px;
}
.Pay_Tab2InnerTabPagePart {
    border-left: 2px solid #d0d3ff;
    background-color: #ffffff;
    padding-left:5px;
}

.TotalSeparateTop {
    margin-top:30px;
}
.formTopPushLbl_PayTotal1 {
    font-size:16px;
}
.formTopPushLbl_PayTotal1Right {
    margin-left: 12px;
    font-size: 18px;
}
.formTopPushLbl_PayCashTotal2 {
    margin-top: 5px;
    font-size: 16px;
}
.formTopPushLbl_PayCashTotal2Right {
    font-size: 18px;
    font-weight: bold;
}

.paycashTitle {
    font-size:22px;
    color:green;
    font-weight:bold;
    text-align:center;
}
.paycashDescription,
.paycashDescription2,
.paycashDescription3{
    font-size: 16px;
    text-align: center;
    margin-top: 30px;
    font-weight: bold;
}

.paycashTotal,
.paycashTotal2,
.paycashTotal3 {
    margin:10px auto;
    padding:10px;
    border:1px solid #e5e5e5;
    text-align:center;
    min-width:300px;
    max-width:800px;
    width: 50%;
    font-size:30px;
    font-weight:bold;
    overflow-wrap: break-word;
    color:#228b22;
    background-color:#f0fff0;
    box-shadow: 0px 0px 8px 2px #aaaaaa;
}
.paycashBtnBox {
    margin-top:30px;
    text-align:center;
}
    .paycashBtnBox button {
        font-size:20px;
        padding: 5px 20px;
        margin: 0 10px;
        min-width: 160px;
    }

.paycashResidentBox {
    margin-top:30px;
    text-align:center;
    font-weight:bold;
}

.paycashDate_RefNoBox {
    width: 52%;
    margin:10px auto;
    font-weight:bold;
    background-color: #e1f1ff;
    padding: 10px 1%;
}
    .paycashDate_RefNoBox h4 {
        text-decoration: underline;
    }
    .paycashDate_RefNoBox table {
         font-size:16px;
    }
        .paycashDate_RefNoBox table .col1 {
            padding-right: 10px;
        }
        .paycashDate_RefNoBox table .colm {
            padding: 0 10px;
        }

.itemListingBox {
     /*margin-top:30px;*/
}
.itemListingTriggerControl {
    text-align:center;
    color:blue;
}
    .itemListingTriggerControl:hover {
        color:lightskyblue;
        cursor:pointer;
    }
    .itemListingTriggerControl.on {
        color:#ff0000;
        font-weight:bold;
        text-decoration:underline;
    }
    .itemListingTriggerControl:hover.on {
        color:#ff7100;
    }

.itemListingInsideTitle {
    font-size:16px;
    font-weight:bold;
}



[data-title]:hover:after {
    opacity: 1;
    transition: all 0.1s ease 0.5s;
    visibility: visible;
}
[data-title]:after {
    content: attr(data-title);
    position: absolute;
    bottom: -1.6em;
    left: 100%;
    padding: 4px 4px 4px 8px;
    color:white;
    white-space: nowrap; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px;  
    border-radius: 5px;  
    -moz-box-shadow: 0px 0px 4px #222;  
    -webkit-box-shadow: 0px 0px 4px #222;  
    box-shadow: 0px 0px 4px #222;  
    background-image: -moz-linear-gradient(top, #f77176, #f97a7f);  
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #f77176),color-stop(1, #f97a7f));
    background-image: -webkit-linear-gradient(top, #f77176, #f97a7f);  
    background-image: -moz-linear-gradient(top, #f77176, #f97a7f);  
    background-image: -ms-linear-gradient(top, #f77176, #f97a7f);  
    background-image: -o-linear-gradient(top, #f77176, #f97a7f);
    opacity: 0;
    z-index: 99999;
    visibility: hidden;
}
[data-title] {
    position: relative;
}

.filterboxscroll {
    width:100%;
    overflow-x:auto;
}
.filterboxinnerPushBody {
    width: 850px;
}

.showingIsRepeat {
    background-color: purple;
    color: white;
    padding: 3px 10px;
    font-size: 10px;
    border-radius: 15px;
}

.btnApproveInMaintenanceInv {
    margin: 10px 10px 0;
}

.Disabled_BlockApprove_InactiveShow {
    opacity: 0.5;
}
    .Disabled_BlockApprove_InactiveShow:hover {
        opacity:0.9;
    }

/*-----Setting Configuration AppPage --------*/
.AppPageConfiguration_PerItemBox {
    padding:0;
    display:block;
    padding:10px 20px;
    margin-bottom:10px;
}
.AppPageConfiguration_ColLeft {
    display:inline-block;
}
.AppPageConfiguration_ItemTitle {
    font-size:18px;
    font-weight:bold;
    margin: 0;
}
.AppPageConfiguration_ItemDescription {
    color:grey;
    margin: 0;
}

.AppPageConfiguration_ItemBulletCheck {
    display:inline-block;
    padding: 15px 0;
    vertical-align: top;
}

.AppPageConfiguration_NewBatch {
    font-size: 10px;
    color: white;
    background: red;
    padding: 2px 4px;
    border-radius: 10px;
    margin-left: 10px;
}

.clsPageConfiguration_C {
    padding-left: 50px !important;
}
    .clsPageConfiguration_C .AppPageConfiguration_ItemTitle {
        color: grey;
    }

.AppPageConfiguration_Child_Left {
    display: table-cell;
    vertical-align: middle;
    padding-right: 15px;
    font-size: 16px;
    font-weight: bold;
}
.AppPageConfiguration_Child_Right {
    display:inline-block;
}
.sideLineGroup {
    border-left:2px solid black;
}
.colorForChildItem .AppPageConfiguration_Child_Left {
    color:#c4c4c4;
    text-align: center;
}
.colorForChildItem .AppPageConfiguration_ItemTitle {
    color:#8f8f8f;
}

/*-------- Application Facility ----------------*/
#TbAddApplicationDayOfOperatingHour {
    margin-bottom:10px;
    text-align:center;
}
    #TbAddApplicationDayOfOperatingHour th {
        background-color:#003699;
        padding:5px 20px;
        border:1px solid black;
    }
    #TbAddApplicationDayOfOperatingHour td {
        padding:5px 20px;
         border:1px solid black;
    }
        #TbAddApplicationDayOfOperatingHour td.NoTime {
            background-color:#d4d4d4;
        }
.applicationtbBox {
    margin-bottom:20px;
    overflow:hidden;
    overflow-x:auto;
}

.book_applViewMoreLbl {
    color: cornflowerblue;
    text-decoration: underline;
    padding:4px 10px;
    display: inline-block;
}
    .book_applViewMoreLbl:hover {
        color: blue;
        font-weight:bold;
        background-color:#fcffb5;
        text-decoration:none;
        border:1px solid #ff8800;
        cursor:pointer;
    }
#lblMoreDetails_Facility {
    font-size: 12px;
    margin-left: 15px;
}
#modalBodyShowingDescription {
    background-color: aliceblue;
    padding: 10px 10px 0;
}

/*------------- Deposit ----------------*/
.clickableLblSeeMoreOption {
    color:blue;
    text-decoration:underline;
    cursor:pointer;
}
    .clickableLblSeeMoreOption:hover {
        color:#00a0ff;
    }
    .clickableLblSeeMoreOption:active {
        color:#2900ff;
    }

/*-------- User Access ---------*/
.masterviewwithmanagement_prow {
    color: #b3b3b3;
    font-style: italic;
}
.iconButNoMore {
    color:rgba(0,0,0,0.3);
}
.nochild:hover {
    cursor:default;
}
.titleUALvl2 {
    color:#919191;
}

#UARightPanel {
    overflow-y:auto;
    min-height:600px;
}

/*-------- Misc Share Function Used Style--------*/
.redControlBorder {
    border-color:red;
}
.sblueControlBorder {
    border-color:#0089ff;
}
.form-control-plaintext {
    border: 0;
    box-shadow: none;
    width: auto;
    margin: auto;
    background-color: inherit;
}
.form-control-plaintext.select {
    background-color: white;
    border-radius: 5px;
    border: 2px solid grey;
    margin-right: 3px;
}
.form-control-plaintext.select:hover {
    background-color: white;
    border-radius: 5px;
    border: 2px solid grey;
}
.form-control-plaintext.select:focus {
    background-color: white;
    box-shadow: 2px 2px 5px #888888;
    border-radius: 5px;
    border: 2px solid grey;
}
.noinputiradioindicatorbox {
    opacity:0.5;
}
    .noinputiradioindicatorbox label, .noinputiradioindicatorbox ins {
        cursor:not-allowed;
    }

.tbBtmSpace {
    padding-bottom:10px;
}
.tbTitleTxt {
    font-weight:bold;
    width:80px;
    padding-left:10px;
    vertical-align: top;
    padding-top:12px;
}
.tbValueFillIn {
    padding-right:10px;
}
.tbNoNeedSelectText {
    text-align:center;
    background-color:#ffbbbb;
    font-style:italic;
    padding: 10px 0;
}
.tbChooseSectionStyle {
    background-color:#ffe75c;
    width:100%;
}
    .tbChooseSectionStyle .top {
        padding-top:5px;
    }

.boxMultiEntryNoUnit
{
	display: inline-block;
    font-size: 20px;
    color: cadetblue;
    padding: 0 8px;
    border: 1px solid #c5c5c5;
    margin: 5px;
}
	.boxMultiEntryNoUnit:hover
	{
		color: black;
		border: 1px solid #000000;
		background-color: #c1f5ff;
		cursor:pointer;
	}
	.boxMultiEntryNoUnit:active
	{
		border: 1px solid red;
		background-color: #73c1ff;
	}

.failvalidate .errindicator
{
	border-color: red;
}
.failvalidate .showerrmsg
{
	color: red;
}

/*-------- Auto complete textbox style ----------------*/

.autocomplete-items {
  position: absolute;
  /*border: 1px solid #d4d4d4;*/
  border-bottom: none;
  border-top: none;
  z-index: 99;
  /*position the autocomplete items to be the same width as the container:*/
  top: 100%;
  left: 0;
  right: 0;
  max-height:400px;
  overflow-y:auto;
  padding-left: 10px;
 
}

.autocomplete-items div {
  padding: 10px;
  cursor: pointer;
  background-color: #fff; 
  border: 1px solid #d4d4d4; 
}

/*when hovering an item:*/
.autocomplete-items div:hover {
  background-color: #428bca; 
    color: #ffffff; 
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
  background-color: DodgerBlue !important; 
  color: #ffffff; 
}
/*-------- Auto complete textbox style ----------------*/

.card_Datatable_MoreBtn {
    float: right;
    padding: 0 15px;
    font-weight: bold;
    border: none;
    background: none;
    font-size: 18px;
    line-height: 22px;
}
    .card_Datatable_MoreBtn.TriggeredMore {
        background-color :#ffd379;
    }
    .card_Datatable_MoreBtn:hover {
        border: 1px solid #989898;
        background-color: #d7d7d7;
    }

.disappear {
    display:none !important;
}

#gallery4 .Outer-wrap:hover .hoverdeleteUpload,
#gallery4 .Outer-wrap:hover .hoverdownloadUpload,
#gallery3 .Outer-wrap:hover .hoverdownloadUploadFromResi {
    opacity:1;
}
.hoverdeleteUpload, .hoverdownloadUpload, .hoverdownloadUploadFromResi {
    font-size:14px;
    opacity:0.2;
}
    .hoverdeleteUpload:hover {
        color: red;
        font-size: 18px;
        cursor: pointer;
    }
    .hoverdownloadUpload:hover {
        color:blue;
        font-size:18px;
        cursor:pointer;
    }
    .hoverdownloadUploadFromResi:hover {
        color:green;
        font-size:18px;
        cursor:pointer;
    }

.pendingToUploadNew {
    border-color:rgb(140, 218, 255) !important;
}
.pendingToUploadNew:hover {
    border-color:#ababff !important;
}
.newIndicator {
    font-weight:bold;
    color:red;
    background-color:yellow;
    padding: 5px 10px;
    margin: 0 5px;
}

#gallery3 .Outer-wrap:not(.pendingToUploadNew) img:hover,
#gallery4 .Outer-wrap:not(.pendingToUploadNew) img:hover {
    opacity:0.6;
    cursor:pointer;
}

.txtAreaAllowResize {
    resize: both !important;
}
.txtAreaHaveMax {
    max-width: 110% !important;
}

.canvasTopCatTitle {
   font-size: 14pt;
   white-space: nowrap;
}
.canvasTopValue {
    font-weight:bold;
    font-size:16pt;
    overflow-wrap: break-word;
}
@media (min-width: 992px) {
    .canvasTopCatTitle {
        font-size: 12pt;
    }

    .canvasTopValue {
        font-size: 14pt;
    }
}
@media (min-width: 1200px) {
    .canvasTopCatTitle {
        font-size: 10pt;
    }

    .canvasTopValue {
        font-size: 12pt;
    }
}
@media (min-width: 1199px) and (max-width: 1520px) {
    #AllReceivableByBlock .x_content .tile {
        width:50%;
    }
}
.canvasEmptyData {
    text-align: center;
    color: #ff8100;
    font-size: 14pt;
}
.canvasErrorData {
    text-align: center;
    color: red;
    font-size: 10pt;
    font-weight:bold;
    background-color:yellow;
    padding:8px 0;
    margin:0 auto 20px;
}
.canvasblocktitle {
    font-weight:bold;
    font-size:16pt;
    text-decoration:underline;
    color: #545456;
}
.canvasStandSupport {
    min-height:250px;
}

.canvasSelectionRegion {
    padding: 0 5px;
    display: flow-root;
    margin: 0 0 25px;
}
    .canvasSelectionRegion:hover {
        background-color:#f3f3f3;
    }
.canvasSelection_Item {
    float:right;
    padding:10px 15px;
    background-color:#4b7ba5;
	color:white;
    margin:5px 3px;
	border-radius:5px;
    border: 1px solid transparent;
}
    .canvasSelection_Item.active {
        font-weight:bold;
        /*border:1px solid #425efe;*/
        background-color: #c70a3a;
    }
    .canvasSelection_Item:not(.active):hover {
        font-weight:bold;
        background-color: #c70a3a;
        cursor:pointer;
    }
    .canvasSelection_Item:not(.active):active {
        border: 1px solid red;
    }

.canvasSelection_MostLeft {
    margin-left:0 !important;
}
.canvasSelection_MostRight {
    margin-right:0 !important;
}

.canvasTopMostTotalRow {
    margin-bottom:10px;
}
    .canvasTopMostTotalRow .eachitem {
        margin-bottom:10px;
    }
.canvasTopMostTotalTitle {
    font-size:14pt;
}
.canvasTopMostTotalValue {
    font-weight:bold;
    font-size:20pt;
    overflow-wrap: break-word;
}


.nav-sm .left_col .left_col .nav_title img{
    width: 38px;
    padding-left: 6px;
}
.nav_title span {
    margin-left:10px;
    white-space: nowrap;
    overflow: hidden;
    width: 164px;
    display: inline-flex;
}
#MstP_UserProfPic {
    width: 60px;
    height: 60px;
    object-fit: fill;
}
.ShrinkedNavBar_Selected {
    overflow:visible !important;
}
.MakeCanScroll_NavBar {
    position:relative;
}
.MakeCanScroll_NavBar #menu2 li:not(.active) {
    padding-right: 5px;
}
    .MakeCanScroll_NavBar #menu2 .active ul.child_menu {
        left:108%;
    }
.MakeCanScroll_NavBar .ShrinkSideMenuShowing {
    max-height: 350px;
    overflow: auto;
}

#top_right_UsernameLabel {
    display: inline-flex;
    max-width: 200px;
    white-space: nowrap;
    overflow: hidden;
}

.Theme_SideBar_ModalOpened {
    z-index:1020 !important;
}

.ResizableTextAreaLabel {
    vertical-align:top;
}
.ResizableTextArea {
    resize:both;
    min-width: 400px;
    max-width: 100%;
}
#DocumentEditorPreviewRegion {
    margin-top:20px;
    background-color: #ffffc5;
    padding: 10px 40px;
}

/*Not authorize New Button Style*/
.NotAuthorizeMsg {
    opacity:0.4;
}
    .NotAuthorizeMsg:hover, .NotAuthorizeMsg:hover > * {
        cursor:not-allowed;
    }
/*New fix Society Select Drop Down Select Style*/
ul.nav li.dropdown ul.dropdown-menu:not(.thisSocSelectIsLeft) {
    left: auto;
    right: 0!important;
    padding: 8px 0;
}
.nav[role="tablist"] .dropdown-menu li:not(.divider) a {
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.nav[role="tablist"] .dropdown-menu li:not(.divider):hover a {
    font-weight: 700;
}
.thisSocSelectIsLeft {
    left: 0;
    right: auto;
}
.nav[role="tablist"] .dropdown-menu {
    max-height: 390px;
    overflow-y: auto;
}
 /* width */
.nav[role="tablist"] .dropdown-menu::-webkit-scrollbar {
    width: 5px;
    border-radius:100px;
}
/* Track */
.nav[role="tablist"] .dropdown-menu::-webkit-scrollbar-track {
    background: #e8e8e8;/*#dedede;*//*#f1f1f1;*/
}
.nav[role="tablist"] .dropdown-menu::-webkit-scrollbar-track:hover{
    background: lightgrey;
    -webkit-box-shadow: inset 0 0 6px rgba(211,211,211,0.3);
}
/* Handle */
.nav[role="tablist"] .dropdown-menu::-webkit-scrollbar-thumb {
    background: #525679;/*#888;*/ 
    border-radius: 20px;
}
/* Handle on hover */
.nav[role="tablist"] .dropdown-menu::-webkit-scrollbar-thumb:hover {
    background: #000000;/*#555;*/ 
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

/*-------- RadCaptcha style ----------------*/
.RadCaptcha {

}
.RadCaptcha span {
    color: rgba(231,76,60,.88);
    font-weight: 900;
}
.rcRefreshImage {
    margin: .3em 0 .5em 0 !important;
    text-decoration:underline !important;
    color: rgb(17, 141, 234);
}
.rcInvalid
{
    border: 2px dotted Red;
    border-radius: 4px;
}
.rcValid
{
    border: 2px dotted Green;
    border-radius: 4px;
}
.captchaInput {
    margin-bottom:5px !important;
    margin-right:10px !important;
    width: 50% !important;
}
.captchaLabel {
    font-size:11px;
}
.captchaImage {
    margin:auto;
}