/** @format */

.apexcharts-legend {
    margin-right: -13px !important;
}

.header-img-size {
    width: 20px;
    height: 20px;
    margin-top: 5px;
    cursor: pointer;
}

input {
    outline: 0 !important;
}

.quick-responsive {
    display: block;
    /* width: 102%; */
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.container-header {
    padding: 25px 25px;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, 0);
    border-top: 1px solid rgba(0, 0, 0, 0.125);
}

.quickstart-label {
    margin-top: 9px;
    margin-left: 32%;
    font-size: 13px;
    color: #666666;
}

.setting-btn {
    /* background-color: #cccccc;
    border: #cccccc; */
    width: 110px;
    height: 32px;
    margin-left: 39px;
}

input[type="submit"]:disabled {
    background-color: #fff;
    color: #666666;
    border: 1px solid #666666;
}

.quickstart-span {
    font-size: 13px;
    font-weight: 500;
    margin-top: 9px;
    margin-bottom: 9px;
    color: #666666;
}

.quickstart-edit {
    height: 32px;
    margin-top: 4px;
    margin-bottom: 4px;
    margin-left: 11px;
}

.quickstart-save {
    margin-right: -14px;
    height: 32px;
    margin-top: 4px;
    margin-bottom: 4px;
    margin-right: 13px;
}

.quickstart-p {
    color: #666666;
    margin-left: -12px;
    font-size: 13px;
    margin-top: -2px;
}

.quickstart-workLbl {
    margin-left: -18px;
    color: #666666;
    font-size: 13px;
}

.quickstart-map {
    width: 451px;
    margin-top: -6px;
    margin-left: 22px;
    margin-right: 22px;
}

.Off-span {
    margin-right: 15px;
    margin-left: -25px;
}

.hd-add {
    margin-left: 10px;
    margin-right: 10px;
}

.addImage {
    cursor: pointer;
    margin-top: 5px;
    margin-left: -28px;
    height: 28px;
}

.emp-spn {
    font-size: 14px;
    font-weight: 500;
    padding-left: 7px;
    padding-right: 7px;
}

/***********verticle line after ul added by harsh**************/

.vl {
    border-left: 2px solid #9e9e9e40;
    height: 44px;
    margin-left: -3px;
    margin-top: 5px;
}

.rwbtm {
    border-bottom: 1px solid #cccccc ;
}

.btncustom {
    background-color: #009ccd;
    border-color: #009ccd;
    border-radius: 22px;
    color: #fff;
    outline: 0;
    /* width: 158px; */
}

.btncustom:hover {
    color: #009ccd;
    background-color: #fff;
    border-color: #009ccd;
}

.btncustom:focus,
.btncustom.focus {
    /* box-shadow: 0 0 0 0.2rem #ecededb2; */
    outline: 0;
}

.btncustom.disabled,
.btncustom:disabled {
    background-color: #ccc !important;
    color: #fff !important;
    border: 1px solid #ccc !important;
}

.btncustom:not(:disabled):not(.disabled):active,
.btncustom:not(:disabled):not(.disabled).active,
.show>.btncustom.dropdown-toggle {
    color: #fff;
    background-color: #009ccd;
    border-color: #009ccd;
    outline: 0;
}

.btncustom:not(:disabled):not(.disabled):active:focus,
.btncustom:not(:disabled):not(.disabled).active:focus,
.show>.btncustom.dropdown-toggle:focus {
    /* box-shadow: 0 0 0 0.2rem #009ccd; */
    outline: 0;
}

.btnsearch {
    background-color: #00aae0;
    border-color: #00aae0;
    border-radius: 22px;
    color: #fff;
}

.table td,
.table th {
    padding: 6px 7px;
}

.progress-circle {
    font-size: 20px;
    margin: 20px;
    position: relative;
    /* so that children can be absolutely positioned */
    padding: 0;
    width: 5em;
    height: 5em;
    background-color: #f2e9e1;
    border-radius: 50%;
    line-height: 5em;
}

.progress-circle:after {
    border: none;
    position: absolute;
    top: 0.35em;
    left: 0.35em;
    text-align: center;
    display: block;
    border-radius: 50%;
    width: 4.3em;
    height: 4.3em;
    background-color: white;
    content: " ";
}


/* Text inside the control */

.progress-circle span {
    position: absolute;
    line-height: 5em;
    width: 5em;
    text-align: center;
    display: block;
    color: #53777a;
    z-index: 2;
}

.left-half-clipper {
    /* a round circle */
    border-radius: 50%;
    width: 5em;
    height: 5em;
    position: absolute;
    /* needed for clipping */
    clip: rect(0, 5em, 5em, 2.5em);
    /* clips the whole left half*/
}


/* when p>50, don't clip left half*/

.progress-circle.over50 .left-half-clipper {
    clip: rect(auto, auto, auto, auto);
}

.value-bar {
    /*This is an overlayed square, that is made round with the border radius,
  then it is cut to display only the left half, then rotated clockwise
  to escape the outer clipping path.*/
    position: absolute;
    /*needed for clipping*/
    clip: rect(0, 2.5em, 5em, 0);
    width: 5em;
    height: 5em;
    border-radius: 50%;
    border: 0.45em solid #53777a;
    /*The border is 0.35 but making it larger removes visual artifacts */
    /*background-color: #4D642D;*/
    /* for debug */
    box-sizing: border-box;
}


/* Progress bar filling the whole right half for values above 50% */

.progress-circle.over50 .first50-bar {
    /*Progress bar for the first 50%, filling the whole right half*/
    position: absolute;
    /*needed for clipping*/
    clip: rect(0, 5em, 5em, 2.5em);
    background-color: #53777a;
    border-radius: 50%;
    width: 5em;
    height: 5em;
}

.progress-circle:not(.over50) .first50-bar {
    display: none;
}


/* Progress bar rotation position */

.progress-circle.p0 .value-bar {
    display: none;
}

.progress-circle.p1 .value-bar {
    transform: rotate(4deg);
}

.progress-circle.p2 .value-bar {
    transform: rotate(7deg);
}

.progress-circle.p3 .value-bar {
    transform: rotate(11deg);
}

.progress-circle.p4 .value-bar {
    transform: rotate(14deg);
}

.progress-circle.p5 .value-bar {
    transform: rotate(18deg);
}

.progress-circle.p6 .value-bar {
    transform: rotate(22deg);
}

.progress-circle.p7 .value-bar {
    transform: rotate(25deg);
}

.progress-circle.p8 .value-bar {
    transform: rotate(29deg);
}

.progress-circle.p9 .value-bar {
    transform: rotate(32deg);
}

.progress-circle.p10 .value-bar {
    transform: rotate(36deg);
}

.progress-circle.p11 .value-bar {
    transform: rotate(40deg);
}

.progress-circle.p12 .value-bar {
    transform: rotate(43deg);
}

.progress-circle.p13 .value-bar {
    transform: rotate(47deg);
}

.progress-circle.p14 .value-bar {
    transform: rotate(50deg);
}

.progress-circle.p15 .value-bar {
    transform: rotate(54deg);
}

.progress-circle.p16 .value-bar {
    transform: rotate(58deg);
}

.progress-circle.p17 .value-bar {
    transform: rotate(61deg);
}

.progress-circle.p18 .value-bar {
    transform: rotate(65deg);
}

.progress-circle.p19 .value-bar {
    transform: rotate(68deg);
}

.progress-circle.p20 .value-bar {
    transform: rotate(72deg);
}

.progress-circle.p21 .value-bar {
    transform: rotate(76deg);
}

.progress-circle.p22 .value-bar {
    transform: rotate(79deg);
}

.progress-circle.p23 .value-bar {
    transform: rotate(83deg);
}

.progress-circle.p24 .value-bar {
    transform: rotate(86deg);
}

.progress-circle.p25 .value-bar {
    transform: rotate(90deg);
}

.progress-circle.p26 .value-bar {
    transform: rotate(94deg);
}

.progress-circle.p27 .value-bar {
    transform: rotate(97deg);
}

.progress-circle.p28 .value-bar {
    transform: rotate(101deg);
}

.progress-circle.p29 .value-bar {
    transform: rotate(104deg);
}

.progress-circle.p30 .value-bar {
    transform: rotate(108deg);
}

.progress-circle.p31 .value-bar {
    transform: rotate(112deg);
}

.progress-circle.p32 .value-bar {
    transform: rotate(115deg);
}

.progress-circle.p33 .value-bar {
    transform: rotate(119deg);
}

.progress-circle.p34 .value-bar {
    transform: rotate(122deg);
}

.progress-circle.p35 .value-bar {
    transform: rotate(126deg);
}

.progress-circle.p36 .value-bar {
    transform: rotate(130deg);
}

.progress-circle.p37 .value-bar {
    transform: rotate(133deg);
}

.progress-circle.p38 .value-bar {
    transform: rotate(137deg);
}

.progress-circle.p39 .value-bar {
    transform: rotate(140deg);
}

.progress-circle.p40 .value-bar {
    transform: rotate(144deg);
}

.progress-circle.p41 .value-bar {
    transform: rotate(148deg);
}

.progress-circle.p42 .value-bar {
    transform: rotate(151deg);
}

.progress-circle.p43 .value-bar {
    transform: rotate(155deg);
}

.progress-circle.p44 .value-bar {
    transform: rotate(158deg);
}

.progress-circle.p45 .value-bar {
    transform: rotate(162deg);
}

.progress-circle.p46 .value-bar {
    transform: rotate(166deg);
}

.progress-circle.p47 .value-bar {
    transform: rotate(169deg);
}

.progress-circle.p48 .value-bar {
    transform: rotate(173deg);
}

.progress-circle.p49 .value-bar {
    transform: rotate(176deg);
}

.progress-circle.p50 .value-bar {
    transform: rotate(180deg);
}

.progress-circle.p51 .value-bar {
    transform: rotate(184deg);
}

.progress-circle.p52 .value-bar {
    transform: rotate(187deg);
}

.progress-circle.p53 .value-bar {
    transform: rotate(191deg);
}

.progress-circle.p54 .value-bar {
    transform: rotate(194deg);
}

.progress-circle.p55 .value-bar {
    transform: rotate(198deg);
}

.progress-circle.p56 .value-bar {
    transform: rotate(202deg);
}

.progress-circle.p57 .value-bar {
    transform: rotate(205deg);
}

.progress-circle.p58 .value-bar {
    transform: rotate(209deg);
}

.progress-circle.p59 .value-bar {
    transform: rotate(212deg);
}

.progress-circle.p60 .value-bar {
    transform: rotate(216deg);
}

.progress-circle.p61 .value-bar {
    transform: rotate(220deg);
}

.progress-circle.p62 .value-bar {
    transform: rotate(223deg);
}

.progress-circle.p63 .value-bar {
    transform: rotate(227deg);
}

.progress-circle.p64 .value-bar {
    transform: rotate(230deg);
}

.progress-circle.p65 .value-bar {
    transform: rotate(234deg);
}

.progress-circle.p66 .value-bar {
    transform: rotate(238deg);
}

.progress-circle.p67 .value-bar {
    transform: rotate(241deg);
}

.progress-circle.p68 .value-bar {
    transform: rotate(245deg);
}

.progress-circle.p69 .value-bar {
    transform: rotate(248deg);
}

.progress-circle.p70 .value-bar {
    transform: rotate(252deg);
}

.progress-circle.p71 .value-bar {
    transform: rotate(256deg);
}

.progress-circle.p72 .value-bar {
    transform: rotate(259deg);
}

.progress-circle.p73 .value-bar {
    transform: rotate(263deg);
}

.progress-circle.p74 .value-bar {
    transform: rotate(266deg);
}

.progress-circle.p75 .value-bar {
    transform: rotate(270deg);
}

.progress-circle.p76 .value-bar {
    transform: rotate(274deg);
}

.progress-circle.p77 .value-bar {
    transform: rotate(277deg);
}

.progress-circle.p78 .value-bar {
    transform: rotate(281deg);
}

.progress-circle.p79 .value-bar {
    transform: rotate(284deg);
}

.progress-circle.p80 .value-bar {
    transform: rotate(288deg);
}

.progress-circle.p81 .value-bar {
    transform: rotate(292deg);
}

.progress-circle.p82 .value-bar {
    transform: rotate(295deg);
}

.progress-circle.p83 .value-bar {
    transform: rotate(299deg);
}

.progress-circle.p84 .value-bar {
    transform: rotate(302deg);
}

.progress-circle.p85 .value-bar {
    transform: rotate(306deg);
}

.progress-circle.p86 .value-bar {
    transform: rotate(310deg);
}

.progress-circle.p87 .value-bar {
    transform: rotate(313deg);
}

.progress-circle.p88 .value-bar {
    transform: rotate(317deg);
}

.progress-circle.p89 .value-bar {
    transform: rotate(320deg);
}

.progress-circle.p90 .value-bar {
    transform: rotate(324deg);
}

.progress-circle.p91 .value-bar {
    transform: rotate(328deg);
}

.progress-circle.p92 .value-bar {
    transform: rotate(331deg);
}

.progress-circle.p93 .value-bar {
    transform: rotate(335deg);
}

.progress-circle.p94 .value-bar {
    transform: rotate(338deg);
}

.progress-circle.p95 .value-bar {
    transform: rotate(342deg);
}

.progress-circle.p96 .value-bar {
    transform: rotate(346deg);
}

.progress-circle.p97 .value-bar {
    transform: rotate(349deg);
}

.progress-circle.p98 .value-bar {
    transform: rotate(353deg);
}

.progress-circle.p99 .value-bar {
    transform: rotate(356deg);
}

.progress-circle.p100 .value-bar {
    transform: rotate(360deg);
}

/***************Extra fa icon css*********************************/

.fa {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.fa-dashboard:before,
.fa-tachometer:before {
    content: "\f0e4";
    font-size: 40px;
}
.in-highlights .Vst_ul::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
/****************Scroller for responsive******************/

/*for firefox*/
/*/ width /*/
::-webkit-scrollbar {
  width: 7px;
}

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

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

/*/ Handle on hover /*/
::-webkit-scrollbar-thumb:hover {
  background: #1591ce !important;
  border-radius: 10px;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.44, rgb(21, 145, 206)),
    color-stop(0.72, rgb(112, 195, 236)),
    color-stop(0.86, rgb(55, 161, 214))
  );
}
body::-webkit-scrollbar-thumb {
  background: #1591ce !important;
  border-radius: 10px;
}
/* :root {
  scrollbar-color: #1591ce #f1f1f1 !important;
  scrollbar-width: thin !important;
} */

/* 

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}


::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #999999;
  max-height: 20% !important;
  height: 20% !important;
}


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

/* width */

.tbleffcny {
    font-size: 40px;
    font-weight: 200;
    font-family: "Open Sans";
}

/************Donut css**************/

.c3-chart-arcs-title {
    font-size: 28px;
}

/**************Vertical TAB css***************/

/*  bhoechie tab */

div.bhoechie-tab-container {
    z-index: 10;
    background-color: #ffffff;
    padding: 0 !important;
    border-radius: 4px;
    -moz-border-radius: 4px;
    /* border: 1px solid #ddd; */
    margin-top: 20px;
    margin-left: 50px;
    /* -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  -moz-box-shadow: 0 6px 12px rgba(0, 0, 0, .175); */
    background-clip: padding-box;
    opacity: 0.97;
    filter: alpha(opacity=97);
}

div.bhoechie-tab-menu {
    padding-right: 0;
    padding-left: 0;
    padding-bottom: 0;
}

div.bhoechie-tab-menu div.list-group {
    margin-bottom: 0;
}

div.bhoechie-tab-menu div.list-group>a {
    margin-bottom: 0;
}

div.bhoechie-tab-menu div.list-group>a .glyphicon,
div.bhoechie-tab-menu div.list-group>a .fa {
    color: #a1a1a1;
}

div.bhoechie-tab-menu div.list-group>a:first-child {
    border-top-right-radius: 0;
    -moz-border-top-right-radius: 0;
}

div.bhoechie-tab-menu div.list-group>a:last-child {
    border-bottom-right-radius: 0;
    -moz-border-bottom-right-radius: 0;
}

div.bhoechie-tab-menu div.list-group>a.active,
div.bhoechie-tab-menu div.list-group>a.active .glyphicon,
div.bhoechie-tab-menu div.list-group>a.active .fa {
    background-color: #fff;
    color: #1591ce;
    /* font-weight: 600; */
}

div.bhoechie-tab-menu div.list-group>a.active:after {
    content: "";
    position: absolute;
    right: 0;
    top: 50%;
    margin-top: -13px;
    border-left: 0;
    border-bottom: 13px solid transparent;
    border-top: 13px solid transparent;
    border-right: 10px solid #9e9e9e;
}

div.bhoechie-tab-content {
    background-color: #ffffff;
    /* border: 1px solid #eeeeee; */
    /* padding-left: 20px; */
    /* padding-top: 10px; */
}

div.bhoechie-tab div.bhoechie-tab-content:not(.active) {
    display: none;
}

.list-group {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    border-right: 1px solid darkgray !important;
}

/********collaps ccard*************/

.accordion .card-header:after {
    font-family: "Open Sans";
    /* content: url("../images/icon/arrow.png"); */
    float: right;
    margin-top: -9px;
}

.accordion .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    content: " ";
}

.vlright {
    border-right: 1px solid #9e9e9e40;
    height: 44px;
}

/****************header logo*****************************/

#floatdiv {
    display: none;
}

/* if screen size gets wider than 1024 */

@media screen and (min-width: 1024px) {
    #floatdiv {
        display: block;
    }
}

.navlist {
    border-left: 2px solid #9e9e9e40;
    height: 44px;
    /* margin-left: -3px; */
    margin-top: 5px;
}

#tabs {
    /* background: #007b5e; */
    color: #eee;
}

#tabs h6.section-title {
    color: #eee;
}

#tabs .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: #1591ce;
    background-color: transparent;
    border-color: transparent transparent #f3f3f3;
    /* border-bottom: 4px solid !important; */
    font-size: 18px;
    font-weight: bold;
}

#tabs .nav-tabs .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    color: #eee;
    font-size: 20px;
}

.progress {
    width: 35px;
    height: 35px;
    background-color: #ffffff;
    font-size: 28px;
}

.progress .track,
.progress .fill {
    fill: rgba(0, 0, 0, 0);
    stroke-width: 8;
    transform: rotate(90deg) translate(0px, -80px);
}

.progress .track {
    stroke: #c5c5c549;
}

.progress .fill {
    stroke: #ffffff;
    stroke-dasharray: 219.99078369140625;
    stroke-dashoffset: -219.99078369140625;
    transition: stroke-dashoffset 1s;
}

.progress.blue .fill {
    stroke: rgb(104, 214, 198);
}

.progress.green .fill {
    stroke: #76d20b;
}

.progress .value,
.progress .text {
    font-family: "Open Sans";
    fill: #666666eb;
    text-anchor: middle;
}

.progress .text {
    font-size: 12px;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}


/************Settings tab css**************/

#tabs {
    /* background: #007b5e; */
    color: #eee;
}

#tabs h6.section-title {
    color: #eee;
}

#tabs .nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
    color: #1591ce;
    background-color: transparent;
    border-color: transparent transparent #f3f3f3;
    /* border-bottom: 4px solid !important; */
    font-size: 18px;
    font-weight: bold;
}

#tabs .nav-tabs .nav-link {
    border: 1px solid transparent;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
    color: #eee;
    font-size: 20px;
}

.progress {
    width: 35px;
    height: 35px;
    background-color: #ffffff;
    font-size: 28px;
}

.progress .track,
.progress .fill {
    fill: rgba(0, 0, 0, 0);
    stroke-width: 8;
    transform: rotate(90deg) translate(0px, -80px);
}

.progress .track {
    stroke: #c5c5c549;
}

.progress .fill {
    stroke: #ffffff;
    stroke-dasharray: 219.99078369140625;
    stroke-dashoffset: -219.99078369140625;
    transition: stroke-dashoffset 1s;
}

.progress.blue .fill {
    stroke: rgb(104, 214, 198);
}

.progress.green .fill {
    stroke: #76d20b;
}

.progress .value,
.progress .text {
    font-family: "Open Sans";
    fill: #666666eb;
    text-anchor: middle;
}

.progress .text {
    font-size: 12px;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
}


/************Settings tab css**************/

.progress-1 {
    height: 12px;
    font-size: 8px;
    background-color: #e6e6e6;
    margin-top: 1px;
    border-radius: 11px;
}

.pcolor {
    color: #666666;
    font-size: 14px;
}

@media (min-width: 768px) {
    .col-1-5 {
        width: 20%;
        float: left;
        position: relative;
        min-height: 1px;
        padding-right: 15px;
        padding-left: 15px;
    }
}

.holidaycolor {
    color: #cccccc;
    font-size: 14px;
}

a:hover {
    color: #1591ce;
    text-decoration: none;
}

.settingh4 {
    font-weight: 400;
    color: #009ccd;
    font-size: 26px;
}

/*** Form wizard ***/

.wizardnav {
    margin-right: 40px;
}

.form-wizard .progress {
    /*  margin-bottom: 30px;*/
}

.form-wizard .steps {
    padding: 10px 0;
    margin-bottom: 0px;
}

.form-wizard .steps {
    background-color: #fff;
    background-image: none;
    filter: none;
    border: 0px;
    box-shadow: none;
}

.form-wizard .steps li a {
    background-color: #fff;
    background-image: none;
    filter: none;
    border: 0px;
    box-shadow: none;
}

.form-wizard .steps li a:hover {
    background: none;
}

.form-wizard .step:hover {
    text-decoration: none;
}

.form-wizard .step .number {
    background-color: #eee;
    display: inline-block;
    text-align: center !important;
    font-size: 16px;
    font-weight: 400;
    padding: 6px;
    margin-right: 10px;
    height: 35px;
    width: 35px;
    -webkit-border-radius: 50% !important;
    -moz-border-radius: 50% !important;
    border-radius: 50% !important;
}

.form-wizard .step .desc {
    display: inline-block;
    font-size: 16px;
    font-weight: 300;
}

.form-wizard .active .step .number {
    background-color: #16a6df;
    color: #fff;
}

.form-wizard .active .step .desc {
    color: #333;
    font-weight: 400;
}

.form-wizard .step i {
    display: none;
}

.form-wizard .done .step .number {
    background-color: #2abc73;
    color: #fff;
}

.form-wizard .done .step .desc {
    font-weight: 400;
}

.form-wizard .done .step i {
    font-size: 14px;
    font-weight: normal;
    color: #2abc73;
    display: inline-block;
}

@media (min-width: 768px) and (max-width: 1280px) {
    .form-wizard .step .desc {
        margin-top: 10px;
        display: block;
    }
}

@media (max-width: 768px) {
    .form-wizard .steps>li>a {
        text-align: left;
    }
    .form-wizard .step .desc {
        display: inline-block;
        font-size: 14px;
        font-weight: 300;
    }
    .form-wizard .step .number {
        background-color: #eee;
        display: inline-block;
        text-align: center !important;
        font-size: 14px;
        font-weight: 300;
        padding: 4px;
        height: 30px;
        width: 30px;
    }
    .nav-justified>li>a {
        margin-bottom: 0px;
    }
    .nav>li>a {
        position: relative;
        display: block;
        padding: 7px 15px;
    }
}

.sidebar-label {
    font-size: 1.3em;
    font-weight: 300;
    color: #ffffff;
}

.sidebar-label-logo {
    font-size: 22px;
    margin-left: 18px;
    margin-top: 10px;
    font-weight: 600;
    color: #ffffff;
    line-height: 54px;
    vertical-align: middle;
}

/* enable absolute positioning */

.inner-addon {
    position: relative;
}

/* style glyph */

.inner-addon .fa {
    position: absolute;
    padding: 10px;
    pointer-events: none;
}

/* align glyph */

.left-addon .fa {
    left: 0px;
}

.right-addon .fa {
    right: 0px;
}

.leavesdiv {
    margin-left: -24px;
    width: 49px;
}

/* add padding  */

.finishingup {
    font-size: 14px;
    margin-top: 15px;
    margin-top: 15px;
    font-style: italic;
    font-weight: 400;
    color: #666666;
}

.checkbox input[type="checkbox"]:checked+.cr2:before {
    /* / background: #1dd5d2; / */
    border-color: #cccccc;
    color: #cccccc;
    font-weight: bold;
}

.checkbox input[type="checkbox"]+.cr2:before {
    content: "\e83f";
    width: 22px;
    height: 22px;
    display: inline-block;
    margin-right: 10px;
    border: 1px solid #e9eaec;
    border-radius: 5px;
    font-size: 15px;
    font-family: "feather";
    font-weight: 400;
    line-height: 19px;
    vertical-align: bottom;
    text-align: center;
    background: #ffffff;
    color: transparent;
    cursor: pointer;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

/* Custom Radio Button Start*/

.radiotextsty {
    color: #666666;
    font-size: 13px;
    vertical-align: middle;
}

.customradio {
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 5px;
    cursor: pointer;
    font-size: 18px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.qckradio {
    margin-bottom: 15px;
}

/* Hide the browser's default radio button */

.customradio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}


/* Create a custom radio button */

.checkmark {
    position: absolute;
    top: 5px;
    left: 0;
    height: 22px;
    width: 22px;
    background-color: white;
    border-radius: 50%;
    border: 1px solid #bebebe;
}


/* On mouse-over, add a grey background color */

.customradio:hover input~.checkmark {
    background-color: transparent;
}


/* When the radio button is checked, add a blue background */

.customradio input:checked~.checkmark {
    background-color: white;
    border: 1px solid #bebebe;
}


/* Create the indicator (the dot/circle - hidden when not checked) */

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}


/* Show the indicator (dot/circle) when checked */

.customradio input:checked~.checkmark:after {
    display: block;
}


/* Style the indicator (dot/circle) */

.customradio .checkmark:after {
    top: 5px;
    left: 5px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #009ccd;
}


/* Custom Radio Button End*/

.customerform {
    margin-left: 0px;
    margin-top: -14px;
}

.footerlabel {
    margin-top: 4px;
    float: right;
    font-size: 13px;
    color: #4c4c4c;
    font-weight: 400;
}

.officelocation {
    margin-bottom: 1rem;
}

.holidayfooter {
    margin-top: 4px;
    margin-left: 50%;
    font-size: 15px;
    color: #4c4c4c;
    font-weight: 400;
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #555;
    border-left: none !important;
    text-align: center;
    border: 1px solid #ccc;
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
}

.workdate {
    margin-bottom: 1rem;
}

.workdays {
    margin-bottom: 9px;
}

.workfaicon {
    vertical-align: -webkit-baseline-middle;
}

.datepickerform {
    border-right: none !important;
    cursor: pointer;
}

.leavestextdiv {
    width: 85%;
}

.leavesicon {
    margin-right: -2px;
}

.placeholder {
    margin-left: -60px;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type="number"]::-moz-inner-spin-button,
input[type="number"]::-moz-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/*the container must be positioned relative:*/

.custom-select {
    position: relative;
    font-family: "Open Sans";
}

.custom-select select {
    display: none;
    /*hide original SELECT element:*/
}


/*style the arrow inside the select element:*/

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


/*point the arrow upwards when the select box is open (active):*/

.select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    top: 7px;
}


/*style the items (options), including the selected item:*/

.select-items div,
.select-selected {
    color: #ffffff;
    padding: 8px 16px;
    border: 1px solid transparent;
    border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
    cursor: pointer;
    user-select: none;
}


/*style items (options):*/

.select-items {
    position: absolute;
    background-color: DodgerBlue;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 99;
}


/*hide the items when the select box is closed:*/

.select-hide {
    display: none;
}

.select-items div:hover,
.same-as-selected {
    background-color: rgba(0, 0, 0, 0.1);
}

.step2frstcol {
    color: #4c4c4c;
    margin-left: -2px;
    font-size: 14px;
    margin-top: -2px;
}

.stepannual {
    color: #666;
    margin-left: -14px;
    margin-right: 14px;
    padding-bottom: 20px;
    padding-top: 20px;
    margin-bottom: 0px;
    font-weight: normal;
}

.stepannualcol {
    color: #4c4c4c;
    padding: 20px 0px;
    font-size: 13px;
    margin-top: -16px;
}

.stepanualspan {
    font-size: 13px;
    margin-left: 14px;
}

.workschedule {
    padding: 0px 39px 0px 39px;
    width: 260px;
}

.workdepartment {
    padding: 0px 39px 0px 39px;
    width: 235px;
}

.sidebar-label {
    font-size: 1.3em;
    font-weight: 300;
    color: #ffffff;
}

.sidebar-label-logo {
    font-size: 23px;
    font-weight: 600;
    color: #ffffff;
    line-height: 45px;
    vertical-align: middle;
}

.sidebar-img-size {
    height: 46px;
    width: 46px;
}
#left-nav-submenu.showmenu{
    width: 220px;
    z-index: 9999 !important;
}
.sidebar-submenu {
    position: fixed;
    height: 100%;
    left: 76px;
    top: 0px;
    overflow-y: scroll;
    z-index: 99999999 !important;
    width: 220px;
    height: auto;
    background-color: #e2e2e2;
}

.sidebar-submenu ul.submenu {
    list-style-type: none;
    margin-left: 0px;
    padding-left: 0px;
}

.sidebar-submenu li.submenu-header {
    font-size: 11px;
    font-weight: 400;
    padding: 4px 10px 4px 30px;
    color: #999999;
}

.sidebar-submenu li.submenu-item {
    font-size: 14px;
    padding: 4px 30px;
    color: #666666;
}

.sidebar-submenu span.menu-header {
    color: #0099cc;
    font-size: 1.4em;
    font-weight: 600;
    margin: 30px 30px 15px 30px;
    display: block;
}

.sidebar-submenu li.submenu-item:hover {
    background-color: #eeeeee;
    color: #0099cc;
    cursor: pointer;
}

.sidebar-submenu li.submenu-item a {
    color: #666666;
    cursor: pointer;
    display: block;
    text-decoration: none;
}

.sidebar-submenu li.submenu-item a:hover {
    background-color: #eeeeee;
    color: #0099cc;
    cursor: pointer;
}

.sidebar-submenu li.submenu-item a:active {
    background-color: #eeeeee;
    color: #0099cc;
    cursor: pointer;
}

.has-success .checkbox,
.has-success .checkbox-inline,
.has-success .control-label,
.has-success .help-block,
.has-success .radio,
.has-success .radio-inline,
.has-success.checkbox label,
.has-success.checkbox-inline label,
.has-success.radio label,
.has-success.radio-inline label {
    color: #3c763d;
}

.has-success .form-control {
    border-color: #3c763d;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.has-success .form-control:focus {
    border-color: #2b542c;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
}

.has-success .input-group-addon {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #3c763d;
}

.has-success .form-control-feedback {
    color: #3c763d;
}

.has-warning .checkbox,
.has-warning .checkbox-inline,
.has-warning .control-label,
.has-warning .help-block,
.has-warning .radio,
.has-warning .radio-inline,
.has-warning.checkbox label,
.has-warning.checkbox-inline label,
.has-warning.radio label,
.has-warning.radio-inline label {
    color: #8a6d3b;
}

.has-warning .form-control {
    border-color: #8a6d3b;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.has-warning .form-control:focus {
    border-color: #66512c;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
}

.has-warning .input-group-addon {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #8a6d3b;
}

.has-warning .form-control-feedback {
    color: #8a6d3b;
}

.has-error .checkbox,
.has-error .checkbox-inline,
.has-error .control-label,
.has-error .help-block,
.has-error .radio,
.has-error .radio-inline,
.has-error.checkbox label,
.has-error.checkbox-inline label,
.has-error.radio label,
.has-error.radio-inline label {
    color: #c61d19;
}

.has-error .form-control {
    border-color: #c61d19;
    /* -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075) */
}

.has-error .form-control:focus {
    border-color: #c61d19;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #ce8483;
}

.has-error .input-group-addon {
    color: #c61d19;
    border-color: #c61d19;
}

.has-error .form-control-feedback {
    color: #c61d19;
}

.has-feedback label~.form-control-feedback {
    top: 25px;
}

.has-feedback label.sr-only~.form-control-feedback {
    top: 0;
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373;
}

.has-feedback {
    position: relative;
}

.has-feedback .form-control {
    padding-right: 42.5px;
}


/**********User profile pic *****/

.imagePreview {
    width: 100%;
    height: 180px;
    background-position: center center;
    background: center;
    background-image: url(http://cliquecities.com/assets/no-image-e3699ae23f866f6cbdf8ba2443ee5c4e.jpg);
    background-color: #fff;
    background-size: cover;
    background-repeat: no-repeat;
    display: inline-block;
    box-shadow: 0px -3px 6px 2px rgba(0, 0, 0, 0.2);
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.imgUp {
    margin-bottom: 15px;
}

.userimg {
    margin-left: 35px;
    margin-top: 10px;
}

.del {
    position: absolute;
    top: 0px;
    right: 15px;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    background-color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
}

.imgAdd {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #4bd7ef;
    color: #fff;
    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.2);
    text-align: center;
    line-height: 30px;
    margin-top: 0px;
    cursor: pointer;
    font-size: 15px;
}

.insightsDate {
    background: #fff;
    cursor: pointer;
    font-size: 13px;
    padding: 7px 10px;
    border: 1px solid #ccc;
}

.half-header-section {
    color: #00a2d0;
}

.m-font-med {
    font-size: 1.2em;
}

.half-header-breadcrum {
    height: 20px;
}

.m-font-small {
    color: #999999;
    font-size: 12px;
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    color: #009ccd;
    background-color: #ffffff;
    font-weight: 700;
    border-bottom: 3px solid #009ccd;
}

.nav-pills .nav-link {
    border-radius: 0px;
}

.navborder-bottom {
    border-bottom: 1px solid #36a7deab !important;
}

.insightsnav-link {
    color: #cccccc;
    font-weight: 600;
    font-size: 14px;
}

.insightsnav-link {
    display: block;
    padding: 3px 4px;
}

.insightsnav-link.active {
    color: #1591ce;
    background-color: transparent;
    border-color: transparent transparent #f3f3f3;
    /* border-bottom: 4px solid !important; */
    width: fit-content;
    font-size: 14px;
    font-weight: bold;
}

.insightsnav-link.active,
.nav-pills .show>.insightsnav-link {
    color: #009ccd;
    background-color: #ffffff;
    font-weight: 700;
    border-bottom: 3px solid #009ccd;
}

.btn-circle.btn-sm {
    width: 37px;
    height: 37px;
    /* padding: 6px 0px; */
    border-radius: 22px;
    font-size: 15px;
    text-align: center;
}

.attrow {
    color: #00aae0;
    font-weight: lighter;
    font-size: 30px;
    margin-top: -9px;
}

.attborder-right {
    border-right: 1px solid #cccccc !important;
    margin-top: 8px;
    height: 33px;
    margin-left: 28px;
}

.attlabel {
    margin-top: 4px;
    font-size: 14px;
    color: #a89898;
}

.grid-row-actions {
    display: none;
}

.text-color-blue {
    color: #00aae0 !important;
}

.alert-success {
    color: #666666;
    background-color: #e5f5fa;
    border-color: #e5f5fa;
    font-size: 15px;
    border-radius: 25px;
}

.rightarrow {
    float: right;
    font-size: 15px;
    font-weight: 400 !important;
    margin-right: 10px;
    margin-left: 11px;
    margin-top: 2px;
    line-height: 1;
    color: #666666;
}

.alert {
    position: relative;
    padding: 8px 8px;
    margin-bottom: 1rem;
}

.teamnoti {
    font-size: 12px;
    margin-left: 35px;
    margin-bottom: 0px;
}

.attdate {
    height: 6px;
    float: right;
    margin-right: 11px;
    margin-top: -20px;
}

.atalert {
    position: absolute;
    top: -25px;
    right: 0px;
    height: 40px;
    display: block;
}

.blankdashmodal {
    border-radius: 8px;
    /* height: 90px; */
    font-weight: 100;
    color: #ffffff;
    background-image: linear-gradient(25deg, #2670af 0%, #299fd4 100%);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.dashmodal {
    border-radius: 10px;
    /* margin-top: -12px; */
}

.column {
    float: left;
    width: 50%;
}

.img2 {
    position: absolute;
    right: 5px;
    bottom: 8px;
    z-index: 1;
}

.img3 {
    position: absolute;
    right: 3px;
    bottom: 3px;
    z-index: 1;
}

.p1 {
    font-size: 13px;
    margin-bottom: 10px;
}

.blanckdashboard {
    width: fit-content !important;
    width: -webkit-max-content !important;
    width: -o-max-content !important;
    width: -ms-max-content !important;
    border: none !important;
    padding: 0px 7px;
    background: url(/assets/images/icon/blank-dash-arrow.png) no-repeat right 15px center/11px 6px;
}

.blandasharrow {
    float: right;
    margin-top: -3rem !important;
}

.blankdashdop {
    background: url(/assets/images/icon/blank-dash-arrow.png) no-repeat right 10px center/11px 6px;
}

.cardbackground {
    background: -moz-linear-gradient( 138deg, rgba(255, 255, 255, 1) 83%, rgba(73, 184, 229) 94%, rgba(17, 122, 191, 1) 100%);
    background: -webkit-linear-gradient( 138deg, rgba(255, 255, 255, 1) 83%, rgba(73, 184, 229) 94%, rgba(17, 122, 191, 1) 100%);
    background: linear-gradient( 138deg, rgba(255, 255, 255, 1) 83%, rgb(73, 184, 229) 105%, rgba(17, 122, 191, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#117abf", GradientType=1);
}

.cardbackground1 {
    background: -moz-linear-gradient( 138deg, rgba(255, 255, 255, 1) 83%, rgba(73, 184, 229) 94%, rgba(17, 122, 191, 1) 100%);
    background: -webkit-linear-gradient( 138deg, rgba(255, 255, 255, 1) 83%, rgba(73, 184, 229) 94%, rgba(17, 122, 191, 1) 100%);
    background: linear-gradient( 138deg, rgba(255, 255, 255, 1) 88%, rgba(73, 184, 229) 105%, rgba(17, 122, 191, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#117abf", GradientType=1);
}

.mob-container-fluid {
    width: 100%;
    padding-right: 23px;
    padding-left: 23px;
    margin-right: auto;
    margin-left: auto;
    padding-top: 20px;
}

.workschedlabel {
    font-size: 13px;
    color: #666666;
}

.m-l-97 {
    margin-left: 97px;
}

.checkbox input[type="checkbox"]:checked+.cr:before {
    /* background: #1dd5d2; */
    border: 1px solid #cccccc;
    border-color: #cccccc;
    color: #009ccd;
    font-weight: bold;
}

.shrfttabletd {
    text-align: left !important;
}

.siftadd {
    font-size: 15px;
    margin-left: 10px;
    color: #666666;
}

.circle {
    width: 20px;
    height: auto;
    border-radius: 50%;
    /* font-size: 14px; */
    color: #fff;
    /* line-height: 500px; */
    text-align: center;
    background: #c1c1c1;
}

.customborder {
    padding: 20px 15px !important;
}

.circle-tile {
    margin-bottom: -8px;
    text-align: center;
}

.circle-tile-heading {
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50%;
    color: #ffffff;
    height: 20px;
    width: 20px;
    /* margin: 0 auto -40px; */
    position: relative;
    transition: all 0.3s ease-in-out 0s;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.circle-tile-number {
    font-size: 11px;
    line-height: 1;
    padding: 3px 3px 4px;
}

.circle-tile-span {
    color: #989898;
    font-size: 13px;
    margin-left: 9px;
    padding-top: 4px;
}

.light-gray {
    background-color: #c1c1c1;
}

.light-red {
    background-color: #fc0d1b;
}

.light-orange {
    background-color: #fd9827;
}

.custommodal {
    color: #0fa8e1;
    font-weight: 500;
    font-size: 14px;
    margin-bottom: none;
}

.active-dot {
    background-color: #1fca23;
    color: #1fca23;
    height: 6px;
    width: 6px;
    left: 0px;
    top: 0px;
    border-width: 0px;
    border-color: #1fca23;
    border-radius: 12px;
}

.inactive-dot {
    background-color: #ed4738;
    color: #ed4738;
    height: 6px;
    width: 6px;
    left: 0px;
    top: 0px;
    border-width: 0px;
    border-color: #ed4738;
    border-radius: 12px;
}

div#MyTeam,
#Activity {
    height: 356px;
}

div.mousescroll {
    overflow: auto;
    z-index: 1;
    /* background: #fff; */
}

div.mousescroll:hover {
    overflow: auto;
}

ul {
    list-style-type: square;
    list-style-image: url(../images/icon/list-icon.png);
    list-style-position: inside;
}

.modal-h6 {
    color: #0fa8e1;
    font-weight: 500;
    font-size: 14px;
    margin-bottom: none;
}

.w-10 {
    width: 11px;
    height: 6px;
}

.teamlable {
    font-size: 13px;
    color: #9f9c9c;
    display: block ruby;
    white-space: nowrap;
}

.head-border {
    border-bottom: 1px solid #cccccc;
    margin-left: 97px;
    width: 78em;
}

.dot {
    border-radius: 50%;
    display: inline-block;
}


/* .arrow_box {
  position: relative;
  background: #555;
  border: 2px solid #000000;
}

.arrow_box:after,
.arrow_box:before {
  right: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}

.arrow_box:after {
  border-color: rgba(85, 85, 85, 0);
  border-right-color: #555;
  border-width: 10px;
  margin-top: -10px;
}

.arrow_box:before {
  border-color: rgba(0, 0, 0, 0);
  border-right-color: #000000;
  border-width: 13px;
  margin-top: -13px;
} */

.productivity-label {
    margin-top: 4px;
    font-size: 15px;
    color: #666666;
}

.productivity-count {
    color: #00aae0;
    font-weight: lighter;
    font-size: 30px;
    margin-top: -9px;
}

.productivity-infobar {
    height: 50px;
    margin-left: 27px;
    margin-right: 23px;
}

.WS-tablist {
    margin-left: -25px;
    margin-right: -29px;
}

.quickstart-label2 {
    margin-top: 9px;
    margin-left: 26% !important;
    font-size: 13px;
    color: #666666;
}

.annualhld {
    padding-top: 4px;
    padding-bottom: 4px;
    font-size: 14px;
}

.ofcaddss {
    float: right;
    margin-bottom: 15px;
}

.officemap {
    border-radius: 4px;
    height: 328px;
    margin-right: -14%;
}

.leavesummary {
    margin-left: 24px;
    margin-top: 14px;
    color: #009ccd;
    font-weight: 700;
}

.leavetxt {
    margin: -5px;
    font-weight: 400;
}

.leavesumttl {
    font-size: large;
    color: #666666;
    font-weight: 400;
    margin: 6px;
}

.leavemodal {
    font-size: 12px;
    color: #666666;
    margin-left: 100px;
    margin-top: 8px;
}

.leaveMyteam {
    margin-left: 44px;
    margin-top: 14px;
    color: #009ccd;
    font-weight: 700;
}

.myteam {
    margin: -5px;
    font-weight: 400;
    margin-left: 1px;
}

.MyTeamsll {
    font-size: large;
    color: #666666;
    font-weight: 400;
    margin-left: 2px;
}

.nav_icon {
    height: 34px;
    width: 34px;
}

.m-t-12 {
    margin-top: 12px;
}

.head-border2 {
    /* border-bottom: 1px solid #cccccc; */

    /* width: calc(100% - 77px) !important; */
    padding-left: 77px!important;

    color: #cccccc;
    display: inline-block;
    /* height: 50px; */
}
.lineweb {
    border-bottom: 1px solid #ccc;
    left: 100px;
    right: 25px;
    top: 80px;
    position: fixed;
    z-index: 99 !important;
}
.cmpyProfile {
    font-size: 13px;
    text-align: center;
    color: #333333;
}

.cmpPrfl {
    padding-left: 53px;
    padding-right: 20px;
}

.cmppfrlModal {
    margin-top: -11px;
    margin-right: -23px;
}

.PofileHR {
    margin-left: 50px;
    width: 66%;
}

.offh5 {
    color: #666666;
    margin-top: 13px;
    margin-bottom: 13px;
    font-size: 14px;
    margin-left: 2px;
}

.Off-span2 {
    margin-right: 15px;
    margin-left: 12px;
}

.DownImg {
    float: right;
    height: 6px;
    margin-top: 8px;
}

.ofcLoctn {
    color: #666666;
    /* margin-top: 13px; */
    /* margin-bottom: 13px; */
    font-size: 14px;
    font-weight: 600;
}

.offmodal {
    font-size: 14px;
    text-align: center;
    color: #666666;
}

.productCross {
    height: 17px;
    width: 18px;
    margin-top: 5px;
    margin-left: -21px;
    cursor: pointer;
}

.offcrow {
    padding: 12px;
    margin-left: -4px;
    margin-right: -10px;
}

.offcRowAdd {
    margin-left: 25px;
    margin-right: 15px;
}

.offAdd {
    margin-left: 17px;
    flex: 0 0 37.66667%;
}

.offlcnCollps {
    margin-left: 23px;
    margin-right: 11px;
}

.AddLcn {
    color: #696969;
    font-size: 13px;
    font-weight: 500;
}

.vieMem {
    color: #666666;
    font-size: 15px;
    margin-top: 5px;
}

.offcRowAdd {
    margin-left: 29px;
    margin-bottom: -13px;
}

.offc-col3 {
    flex: 0 0 27% !important;
    max-width: 28% !important;
}

.AddDeflt {
    margin-left: 44px;
    font-style: italic;
}

.offChk {
    margin-left: -5px;
}
.ExtCls{
    max-width: 22.66%;
    flex: 0 0 22.66%;
}
#navName .classOne{ background-color: transparent;}
.dropdownStyle .nice-select{
    border: 0px;
    margin-top: -5px;
}

@media only screen and (max-width: 992px) {
    .pcoded-navbar{
        width: 235px;
    }
    .newMenuRtext {
        opacity: 1 !important;
    }
    .pcoded-mtext {
        opacity: 1 !important;
    }
    .pcoded-navbar .pcoded-inner-navbar li {
        min-height: auto !important;
    }
    .pcoded-navbar .pcoded-inner-navbar li>a>.pcoded-micon+.pcoded-mtext {
        top: -12px;
    }
}
@media only screen and (max-width: 992px) {
    .lineweb{
        display: none;
    }
    .head-border2 {
        box-shadow: 0 25px 0 -24px #cccccc !important;
    }

}

.col-set-h3{
  min-width: 74px;
}
.col-set-h5{
  min-width: 130px;
  margin-right: 10px;
}

/*#responsivechangepwd.modal .modal-dialog {
max-width: 480px;
margin: 0 auto;
top: 50%;
transform: translate(0%,-50%);
}
#responsivechangepwd .modal-header{
padding-left: 20px;
padding-right: 20px;
}
#responsivechangepwd .modal-body{
padding-left: 20px;
padding-right: 20px;
}
#responsivechangepwd .form-body .form-group{
display: flex;
}
#responsivechangepwd .form-body .control-label{
padding-left: 0px;
font-size: 14px;
padding-top: 5px;
}*/
.modal-body {
    /*padding: 10px 20px 0 20px !important;*/
}

.datepicker-days {
    font-size: 12px;
}

datepicker-dropdown.datepicker-orient-bottom:before,.datepicker-dropdown.datepicker-orient-bottom:after{
    display: none;
}
.clockface.dropdown-menu{
    z-index: 99999 !important;
}
.datepicker.dropdown-menu {
    z-index: 99991 !important;
}
.datepicker {
    font-size: 0.6em;
}
/* solution 2: the original datepicker use 20px so replace with the following:*/

.datepicker td,
.datepicker th {
    width: 1em;
    height: 1em;
}


.col-set-h3{
    min-width: 74px;
}
.col-set-h5{
    min-width: 130px;
    margin-right: 10px;
}
.popupprogress{
    z-index: 99999;
}

.bootstrap-datetimepicker-widget .btn.btn-primary{
    text-transform: lowercase;
}

.weekDays-selector input {
    display: none!important;
}

.weekDays-selector input[type=checkbox] + label {
    display: inline-block;
    border-radius: 50%;
    background: #f1f3f4;
    color: #80868b;
    height: 27px;
    width: 28px;
    margin-right: 5px;
    line-height: 29px;
    text-align: center;
    cursor: pointer;
    margin-top: 13px;

}

.weekDays-selector input[type=checkbox]:checked + label {
    background:#1a73e8;
    color:white ;
}
.onRepeat{
    display: flex;
    content: inline;
    padding-right: 10px;
}

.repeatEvery{
    display: flex;
    line-height: 25px;

}

.space{
    margin-right: 10px;
}
/* ended By Nikhil.b
*/
.modal-md {
    max-width: 350px;
}


.pcoded-header .dropdown .profile-notification #loginuser.pro-body{
padding: 7px 0px;
background-image: linear-gradient(15deg, #117abf 0%, #1fa8e1 100%);
background-color: #009ccd;
color: #fff;
}
.pcoded-header .dropdown .profile-notification #loginuser.pro-body li{
margin-left: 0px;
margin-right: 0px;
}

.pcoded-header .dropdown .profile-notification #loginuser.pro-body li:hover{
box-shadow: none;
background-image: linear-gradient(15deg, #147bb6 0%, #147bb6 100%);
background-color: #147bb6;
color: #fff;

}
.pcoded-header .dropdown .profile-notification #loginuser li a{
color: #fff;
display: flex;
align-items: center;
}
.pcoded-header .dropdown .profile-notification #loginuser li a
.menushowR01 {
width: 18px;
height: 18px;
margin-right: 10px;
}

.pcoded-header.headerpos-fixed{ z-index: 991;}

.lineweb {
  border-bottom: 1px solid #ccc;
  left: 100px;
  right: 25px;
  top: 80px;
  position: fixed;
  z-index: 99 !important;
}


.pcoded-header .ml-auto .dropdown-menu {
    margin-right: -10px !important ;
}