header{
    position: fixed;
    width: 100%;
    top: 0;
    background-color: white;
    z-index: 6;
}
.footer{
    /* background-color: black; */
    padding: 10px 0;
}

thead, tbody, tfoot, tr, td, th{
}
.footer-info{
    padding: 20px;
    color: #ffffff;
    background-color: rgba(255,255,255,0);
    font-size: 14px;
    text-align: center;
    display: block;
}
.footer-inside-info{
    max-width: 1680px;
    padding-left: 0;
    padding-right: 0;
    margin-left: auto;
    margin-right: auto;
    color: black;
}
.footer-info:before {
    content: ".";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
}
.footer-info:after {
    content: ".";
    display: block;
    overflow: hidden;
    visibility: hidden;
    font-size: 0;
    line-height: 0;
    width: 0;
    height: 0;
    clear: both;
}
.containers {
    padding: 84px 10px 40px 260px;
    transition: margin 0.2s;
    height: 100%;
    display: table;
    width: 100%;
}
.containerSmol {
    padding: 80px 10px 40px 86px;
    transition: margint 0.2s;
}
.statusDot {
    display: inline-block;
    width: .2rem;
    height: 2.7rem;
    background-color: #bdc5d1;
}
.dashboard_panel,.dashboard_panel2{
    display:flex;
    justify-content: space-evenly;
    margin-bottom: 20px;
}
.dashboard_panel2{
    border-radius: .6875rem .6875rem 0px 0px;
}
.panelItemMid{
    display: inline-block;
}
.drop-options{

}
.dshbpan{
    border-radius: 1.25rem;
}
.tabLinks{
    text-decoration: none;
    color: black;
}
.login-button {
    width: 150px;
    background-color: orange;
    color: white !important;
    font-size: 18px;
    padding: 10px 15px;
    border: 1px solid #ffa500;
    /* border-style: none; */
    border-radius: 50px;
    -moz-border-style: none;
    -moz-border-radius: 10px;
    -webkit-border-radius: 5px;
    -webkit-appearance: none;
}

html,body{
    height:100%;
}

.headerimg{
    font-size: .875rem;
    width: 36px;
    height: 36px;
}
.bi {
    vertical-align: -.125em;
    pointer-events: none;
    fill: currentColor;
    margin-right: 12px;
}

.sidelinks,.sidelinksdrop{
    text-decoration: none;
}

#accordionSideDrop ul{
    list-style-type: none;
}

#flush-collapseSideOne,#flush-collapseSideTwo,
#flush-collapseSideThree,#flush-collapseSideFour{
    margin-top: -7px;
}

.profpic{
    text-align: -ms-right;
    text-align: -moz-right;
    text-align: -o-right;
    text-align: -webkit-right;
}
.sideSmol{
    width: 72px !important;
    overflow-x: hidden;
    white-space: nowrap;
    transition: width 0.5s !important;
}
.sidePad{
    padding: 1rem 0rem 0rem 1rem !important;
    
}
#sideBarb{
    background-color: #0086FF;
    width: 250px;
    top:0px;
    height:100%;
    position:fixed;
    overflow-y: auto;
    overflow-x: hidden;
    white-space: nowrap;
    transition: width 0.5s;
    z-index: 999;
}
.sideArrow{
    display: inline-block;
    margin-left: 260px;
    cursor: pointer;
    transition: margin-left 0.2s;
    vertical-align: -webkit-baseline-middle;
    vertical-align: -ms-baseline-middle;
    vertical-align: -moz-baseline-middle;
    vertical-align: -o-baseline-middle;
}
.sideArrow2{
    margin-left: 70px;
    transition: margin-left 0.2s;
    -webkit-transform: scaleX(-1);
     transform: scaleX(-1);
}
.addcircle{
    display: none;
}
.circbut{
    color:white;
    background-color: #f79f03;
    width: 50px;
    height: 50px;
    border: 0px;
}
.addcircle .bi{
    margin-right: 0px;
}
.normaddbut{
    display: block;
}
.form-floating > label {
    left: 10px;
}
.badgey:hover{
    mix-blend-mode: darken !important;
    color: white !important;
    opacity: 1.0 !important;
}
.botBord{
    border: 0px !important;
    border-bottom: 1px solid #ced4da !important;
    border-radius: 0px !important;
}
.filterDrop{
    position:absolute;
    inset:auto auto;
    margin:0px;
    transform:translate(-208px, 16px);
    padding-top:20px
}
.pagRows{
    display: inline-block;
    font-size:large;
}
.pagDrop{
    display: inline-block;
}
.showPagRows{
    font-size:initial;
    bottom:30px;
    display: flex;
}
.dashboard_panel2, .inditb, .indiTBTH, .tabFoot {
    border: 1px solid #d9dee2;
}
.sideaccordspan::after {
    position: absolute;
    right: 30px;
    content: "";
    border-bottom: 0;
    border-top: .3em solid;
    border-right: .3em solid transparent;
    border-left: .3em solid transparent;
    margin-top: 12px;
}

.sideaccordspan[aria-expanded="true"]::after {
    content: "";
    border-top: 0;
    border-bottom: .3em solid;
}
.sideSmol .sideaccordspan::after{
    right: 50px;
}
.tabFoot{
    background-color: #fff;
    padding: 1.3125rem 1.3125rem;
    border-top: .0625rem solid rgba(231,234,243,.7);
    border-radius: 0 0 .6875rem .6875rem;
    padding-top: 1rem;
}

.td-urgency {
    text-align: center;
    width:45px;
}

.td-client{
   width: 150px; 
   padding-left: 10px;
}

.td-id-date{
   width: 110px; 
}

.td-assigned {
    Width:140px;
}

.td-status {
    Width:75px;
}

.pagHowMny:focus {
    outline: none !important;
}
.pghwmny {

  }
.pagTab-sm .page-link{
    border: 1px solid white;
}
.page-item.active .page-link {
    border-radius: 5px;
}
input[type=date]{
    /* display:block; */
    -webkit-appearance: textfield;
    -moz-appearance: textfield;
    padding: 0.375rem 0.75rem !important;
}
.two_column_div input[type=text] ,.two_column_div select,.two_column_div input[type=date],
.two_column_div input[type=email],.two_column_div input[type=password]{
    width: 210px;
    height: 36px;
    padding: 0rem 2.25rem 0rem 0.75rem;
    border-radius: 0.25rem;
    border: 1px solid #ced4da;
}
.show-hide{
    background-image: url("../images/eye-slash.svg");
    background-size: 30px 30px;
    background-repeat: no-repeat;
    padding: 2px 36px 6px 0px;
    vertical-align: super;
}
.show-hide-active{
    background-image: url("../images/eye.svg");
    background-size: 30px 30px;
    background-repeat: no-repeat;
    padding: 2px 36px 6px 0px;
    vertical-align: super;
}
.popimage {
    display: none;
    position: fixed;
    z-index: 3;
    padding-top: 100px;
    /* left: 0; */
    left: 18px;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.9);
}
.notes-list {
    border-top: 1px solid rgb(182, 182, 182);
    width: 100%;
    padding: 10px;
    text-align: left;
    font-size: small;
}
.notactstd{
    width: 60%;
    height: 60%;
    display: block;
    position: fixed;
    background-color: white;
    z-index: 10;
    border-radius: 2%;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.notactstd2{
    width: 60%;
    height: 10%;
    display: block;
    position: fixed;
    background-color: beige;
    z-index: 10;
    border-radius: 2%;
    top: 5%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.ovlay{
    position: absolute;
    top: 0%;
    width: 100%;
    height: 135%;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.6);
}
#overlay2{
    position: absolute;
    top: 353px;
    width: 94%;
    display: none;
    height: 22%;
    z-index: 10;
    background-color: rgba(0, 0, 0, 0.6);
}

.overlay2span{
    color:yellow;
    font-size: xx-large;
    vertical-align: middle;
    line-height:4;
}
.radio_buttons2{
    text-align: end;
}
.inpopov{
    padding-top:2%;
}
.button2 {
    padding: 6px 44px;
    font: inherit;
    background-color: orange;
    border: 1px solid rgb(179, 124, 24);
    font-size: 14px;
    color: white;
    border-radius: 5px;
    text-decoration: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -webkit-appearance: none;
}

.w3-show {
    display: table-row !important;
  }
  .tablefrig{
    left:275px;
    right:32px;
    position: initial;
    width: 640px;
}
table.tab2 td {
    transition: all 0.3s;
}

.maintabs{
    /* margin: 0px 20px; */
    margin: 0px 4px;
    padding-bottom: 50px;
    display: table-row;
}
.tabshadow{
    box-shadow: 0 6px 12px rgb(140 152 164 / 8%);
    border: 1px solid #d9dee2;
    border-radius: 0.6875rem 0.6875rem 0.6875rem 0.6875rem;
}
.dropend:nth-child(1) .d2{
    transform: translate(71px, 247px) !important;
}
.dropend:nth-child(2) .d2{
    transform: translate(71px, 309px) !important;
}
.dropend:nth-child(3) .d2{
    transform: translate(71px, 371px) !important;
}
.dropend:nth-child(4) .d2{
    transform: translate(71px, 433px) !important;
}
.dropend2:nth-child(1) .d2{
    transform: translate(71px, 185px) !important;
}
.dropend2:nth-child(2) .d2{
    transform: translate(71px, 247px) !important;
}
.threebuts{
    cursor: pointer;
    font-size: 40px;
    text-align: end;
}
.dropfont{
    font-size: 20px;
    font-weight: 600;
    vertical-align: middle;
}
.dropspace{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.showmobog{ display: block;}
.showmobog2{ display: none;}
.showmobbut{ display: none;}
.showmobbut2{ display: block;}
.showmobbut3{ display: inline-block;}
.showmobbut4{ display: initial;}
.showmobbut5{ display: table-cell;}
.show3but{
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.fixedrop{
    z-index: 4;
    inset: 0px auto auto 0px !important;
    transform: translate3d(-182px, -18px, 0px) !important;
}
@media only screen and (max-width: 1000px) {
    .fixedrop{
        inset: -10px 1px auto auto !important;
        transform: translate3d(0px, 47px, 0px) !important;
        z-index: 0;
    }
    .td-assigned {
        Width:100%;
    }
    .showmobog{ display: none !important;}
    .showmobog2{ display: block;}
    .showmobbut{ display: block;}
    .showmobbut2{ display: none;}
    .showmobbut3{ display: none;}
    .showmobbut4{ display: none;}
    .showmobbut5{display: none;}
    .show3but{
        display: none;
    }
    .removpad{
        padding: 0px !important;
    }
    .maintabs{
        margin: 0px 0px;
        padding-bottom: 50px;
    }
    .ntlab{
        text-align: left;
    }
    header{
        width: 100%;
        margin: 0px 20px 0px 0px;
    }
    .circbut{
        height: 70px;
        width: 70px;
        border-radius: 999px;
        position: relative;
        font-size: 22px;
        padding: 0px 0px;
    }
    .two_column_div input[type=text], .two_column_div select, .two_column_div input[type=date], .two_column_div input[type=email], .two_column_div input[type=password] {
        width: 100%;
    }
    input[type=date]{
        -webkit-appearance: none;
        -moz-appearance: none;
    }
    #sideBarb{
        width: 0px;
    }
    .sideSmol {
        width: 250px !important;
    }
    .sideArrow{
        margin-left: 30px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
    }
    .sideArrow2{
        margin-left: 310px;
        -webkit-transform: scaleX(-1);
        transform: scaleX(1);
    }
    .addcircle{
        display: block;
        text-align: right;
        margin: 10px;
        border-radius: 1em;
        position: fixed;
        bottom: 36px;
        right: 36px;
        z-index: 3;
    }
    .normaddbut{
        display: none;
    }
    .inditb{
        height: 591px;
        width: 100%;
    }
    .dashboard_panel,.dashboard_panel2{
        display:block;
    }
    .containers {
        /* margin: 16px 4px 40px 74000px; */
        /* margin: 80px 4px 40px 4px; */
        padding: 80px 4px 40px 4px;
        /* margin: 80px 10px 40px 86px;; */
        transition: margint 0.2s;
    }
    .containerSmol {
        /* margin: 16px 20px 40px 250px; */
        /* background-color: white; */
        transition: margin 0.2s;
    }
    .dshbpan{
        font-size: 0.75rem;
    }
    .filterDrop{
        transform: translate(0px, 14px);
    }
    .pagRows{
        font-size:small;
        margin-bottom: 8px;
    }
    .pagDrop{
        font-size: medium;
        margin-top: 2px;
    }
    .pagTab-sm .page-link{
        padding: 0.45rem .6rem;
        font-size: 0.875rem;
        margin-top: 3px;
    }
    .pagTab-sm{
        justify-content: center;
    }
    .showPagRows{
        display: block;
        text-align: center;
    }
    .dotty{
        font-size: 15px
    }
    .sideSmol .sideaccordspan::after {
        right: 40px;
    }
    .sideaccordspan::after {
        right: 48px;
    }
    .inpopov{
        margin-right: 0%;
    }
    .popimage {
        left: 0px;
    }
    .indextab thead,.clienttab thead,.usertab thead,.knowtab thead,.passtab thead,.doctab thead,
    .servtab thead,.reptab thead,.biltab thead,.timetab thead {
        display: none;
    }
    .indextab tbody,.clienttab tbody,.usertab tbody,.knowtab tbody,.passtab tbody,.doctab tbody,
    .servtab tbody,.reptab tbody,.biltab tbody,.timetab tbody{
        display: block;
    }
    .indextab tbody tr,.clienttab tbody tr,.usertab tbody tr,.knowtab tbody tr,.passtab tbody tr,
    .doctab tbody tr,.servtab tbody tr,.reptab tbody tr,.biltab tbody tr,.timetab tbody tr {
        margin: 2%;
        display: block;
        border: 1px solid #d9dee2;
        border-radius: 1em;
        border-spacing: 0;
    }
    .indextab tbody tr td,.clienttab tbody tr td,.usertab tbody tr td,.knowtab tbody tr td,.passtab tbody tr td,
    .doctab tbody tr td,.servtab tbody tr td,.reptab tbody tr td,.biltab tbody tr td,.timetab tbody tr td{
        white-space: normal;
        border-bottom: 0px;
    }
    .indextab tbody tr,.clienttab tbody tr,.usertab tbody tr,.knowtab tbody tr,.passtab tbody tr,.doctab tbody tr,
    .servtab tbody tr,.biltab tbody tr,.timetab tbody tr{
        padding: 0px 10px;
    }
    .reptab tbody tr{
        padding: 10px;
    }
    .indextab tbody tr td:nth-child(4),.clienttab tbody tr td:nth-child(3),/* .usertab tbody tr td:nth-child(4), */
    .knowtab tbody tr td:nth-child(3),.usertab tbody tr td:nth-child(6),
    .doctab tbody tr td:nth-child(3),.servtab tbody tr td:nth-child(3),.reptab tbody tr td:nth-child(3),
    .biltab tbody tr td:nth-child(3),.timetab tbody tr td:nth-child(3) {
        display: block;
    }
    .indextab tbody tr td:nth-child(6),.clienttab tbody tr td:nth-child(8),.usertab tbody tr td:nth-child(5),
    .passtab tbody tr td:nth-child(4),.passtab tbody tr td:nth-child(6),.passtab tbody tr td:nth-child(3){
        /* text-align: right; */
        display: block;
    }
    /* .indextab tbody tr td:nth-child(1), */.clienttab tbody tr td:nth-child(4),.usertab tbody tr td:nth-child(4) {
        display: inline-block;
    }
    /* .indextab tbody tr td:nth-child(2), */.clienttab tbody tr td:nth-child(2),.usertab tbody tr td:nth-child(4) {
        float: right;
    }
    /* .passtab tbody tr td:nth-child(6) {
        text-align: right;
    } */
    .indextab tbody tr td:nth-child(1),.indextab tbody tr td:nth-child(7),.clienttab tbody tr td:nth-child(7),
    .usertab tbody tr td:nth-child(7),.doctab tbody tr td:nth-child(2),.reptab tbody tr td:nth-child(5) {
        width: 1%;
    }
    .passtab tbody tr td:nth-child(5) {
        width: 1%;
    }
    .indextab tr td::before,.clienttab tr td::before,.usertab tr td::before,.knowtab tr td::before,.passtab tr td::before,
    .doctab tr td::before,.servtab tr td::before,.reptab tr td::before,.biltab tr td::before,.timetab tr td::before {
        content: attr(data-header);
        display: block;
    }

    .indextab tbody tr td:nth-of-type(3){text-align: right;}
    .indextab tbody tr td:nth-of-type(4):before{content: "Client";color: #66737E;}
    .indextab tbody tr td:nth-of-type(5):before{content: "Task";color: #66737E;}
    .indextab tbody tr td:nth-of-type(6):before{content: "Assigned";color: #66737E;}
    .indextab tbody tr td:nth-of-type(7){text-align: left;width: 20%;}
    .indextab tbody tr td:nth-of-type(7):before{content: "Tag";color: #66737E;}
    .indextab tbody tr td:nth-of-type(8){text-align: right;}

    .clienttab tbody tr td:nth-of-type(1):before{content: "Client";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(2):before{content: "Phone";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(3):before{content: "Fax";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(4):before{content: "Street";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(5):before{content: "City";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(6):before{content: "State";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(7):before{content: "Zip";color: #66737E;}
    .clienttab tbody tr td:nth-of-type(8){display: block;text-align: center;}
    .clienttab tbody tr td:nth-of-type(8){float: right;position: relative;bottom:255px;text-align: end;}

    .usertab tbody tr td:nth-of-type(1):before{content: "";}
    .usertab tbody tr td:nth-of-type(2):before{content: "Name";color: #66737E;}
    .usertab tbody tr td:nth-of-type(2){width: 100%;} 
    .usertab tbody tr td:nth-of-type(3):before{content: "";color: #66737E;}
    .usertab tbody tr td:nth-of-type(3){width: 100%;text-align: end;}
    .usertab tbody tr td:nth-of-type(4):before{content: "Phone";color: #66737E;}
    .usertab tbody tr td:nth-of-type(5):before{content: "Status";color: #66737E;}
    .usertab tbody tr td:nth-of-type(6):before{content: "Job Title";color: #66737E;}

    .knowtab tbody tr td:nth-of-type(1):before{content: "Customer";color: #66737E;}
    .knowtab tbody tr td:nth-of-type(2):before{content: "";color: #66737E;}
    .knowtab tbody tr td:nth-of-type(2){width: 100%;text-align: end;}
    .knowtab tbody tr td:nth-of-type(3):before{content: "Note";color: #66737E;}
    .knowtab tbody tr td:nth-of-type(4):before{content: "Tag";color: #66737E;}
    
    .passtab tbody tr td:nth-of-type(1):before{content: "Customer";color: #66737E;}
    .passtab tbody tr td:nth-of-type(2):before{content: "";color: #66737E;}
    .passtab tbody tr td:nth-of-type(2){width: 100%;text-align: end;}
    .passtab tbody tr td:nth-of-type(3):before{content: "Description";color: #66737E;}
    .passtab tbody tr td:nth-of-type(4):before{content: "URL";color: #66737E;}
    .passtab tbody tr td:nth-of-type(5):before{content: "Username";color: #66737E;}
    .passtab tbody tr td:nth-of-type(6):before{content: "Password";color: #66737E;}
    .passtab tbody tr td:nth-of-type(7){display: block;text-align: center;}
    
    .doctab tbody tr td:nth-of-type(1):before{content: "Customer";color: #66737E;}
    .doctab tbody tr td:nth-of-type(2):before{content: "";color: #66737E;}
    .doctab tbody tr td:nth-of-type(3):before{content: "Description";color: #66737E;}
    .doctab tbody tr td:nth-of-type(4):before{content: "File";color: #66737E;}
    .doctab tbody tr td:nth-of-type(5):before{content: "Tag";color: #66737E;}

    .servtab tbody tr td:nth-of-type(1):before{content: "Item";color: #66737E;}
    .servtab tbody tr td:nth-of-type(2):before{content: "";color: #66737E;}
    .servtab tbody tr td:nth-of-type(2){width: 100%;text-align: end;}
    .servtab tbody tr td:nth-of-type(3):before{content: "Billable";color: #66737E;}
    .servtab tbody tr td:nth-of-type(4):before{content: "Description";color: #66737E;}
    
    .billtab tbody tr td:nth-of-type(1):before{content: "Task #";color: #66737E;}
    .billtab tbody tr td:nth-of-type(2):before{content: "Task";color: #66737E;}
    .billtab tbody tr td:nth-of-type(3):before{content: "Assigned";color: #66737E;}
    .billtab tbody tr td:nth-of-type(4):before{content: "Client";color: #66737E;}
    .billtab tbody tr td:nth-of-type(5):before{content: "Total";color: #66737E;}

    .reptab tbody tr td:nth-of-type(1):before{content: "Task #";color: #66737E;}
    .reptab tbody tr td:nth-of-type(2):before{content: "Close Date";color: #66737E;}
    .reptab tbody tr td:nth-of-type(2){width: 100%;text-align: end;}
    .reptab tbody tr td:nth-of-type(3):before{content: "Task";color: #66737E;}
    .reptab tbody tr td:nth-of-type(4):before{content: "Client";color: #66737E;}
    .reptab tbody tr td:nth-of-type(5):before{content: "Tag";color: #66737E;}
    .reptab tbody tr td:nth-of-type(5){text-align: center;width: 70%;}
    .reptab tbody tr td:nth-of-type(6):before{content: "Assigned";color: #66737E;}
    .reptab tbody tr td:nth-of-type(6){text-align: end;width: 60%;}
}
@media only screen and (min-width: 480px) and (max-width: 1000px) {
    #sideBarb {
        width: 72px !important;
    }
    .sideArrow{
        display: none;
    }
    .removpad{
        padding: 1rem 0rem 0rem 1rem !important;
    }
    .containers {
        padding: 80px 4px 40px 80px !important;
    }
    .dropend:nth-child(1) .d2{
        transform: translate(71px, 244px) !important;
    }
    .dropend:nth-child(2) .d2{
        transform: translate(71px, 304px) !important;
    }
    .dropend:nth-child(3) .d2{
        transform: translate(71px, 364px) !important;
    }
    .dropend:nth-child(4) .d2{
        transform: translate(71px, 425px) !important;
    }
    .dropend2:nth-child(1) .d2{
        transform: translate(71px, 185px) !important;
    }
    .dropend2:nth-child(2) .d2{
        transform: translate(71px, 247px) !important;
    }
}
@media only screen and (max-width: 760px) {
    .sideSmol {
        width: 70% !important;
    }
    .sideArrow2{
        margin-left: 76%;
    }
}

.dashbbox{
    justify-content: flex-start;
}
.dashbbox1{
    padding: 13px 20px;
}
.dashbbox2{
    padding: 10px 0px 16px;
}
.d-flexy{
    justify-content:center;
    padding-bottom: 16px;
}
.tileflex{
    display: flex;
}


@media only screen and (max-width: 1024px) {
    .dashbbox{
        display: flex;
        justify-content: space-evenly;
    }
    .d-flexy{
        justify-content:space-evenly;
    }
    .tileflex{
        display: block;
    }
}

@media only screen and (max-width: 480px) {
    .dashbbox{
        display: flex;
        align-items: center;
        flex-flow: column;
    }
    .subheads {
        padding: 6px 1px 0px 15px !important;
    }
    .tileflex {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .d-flexy {
        justify-content: space-evenly;
        flex-direction: column;
    }
}