body,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'DroidKufi', helvetica, arial, sans-serif;
    color: #3c3c3c
}

a,
button {
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out
}

.nav.navbar-top-links > li > a.count-info:hover,
.nav.navbar-top-links > li > a.count-info:focus {
    background: none
}

.form-control {
    padding: 4px 12px;
}

.ibox-title h5 {
    font-size: 16px;
    font-weight: normal
}

.nav-header {
    text-align: right;
    background: url(../img/back.jpg) no-repeat;
    /* padding: 10px 20px; */
}

    .nav-header .text-muted {
        color: #ffffff;
    }

.input-lg,
select.input-lg,
.form-control[disabled] {
    color: #a59999;
    background: #f7f8fd;
}

.btn-file {
    position: relative;
    overflow: hidden;
}

    .btn-file input[type=file] {
        position: absolute;
        top: -9px;
        left: -11px;
        min-width: 100%;
        min-height: 100%;
        font-size: 100px;
        text-align: left;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }

.btn-simple.searches {
    background: #faac1b;
    border-color: #faac1b;
}

.form-horizontal .control-label {
    text-align: left
}

.ibox-title {
    border-style: none
}

.navbar-top-links li a.colore,
.buttt {
    background-color: #faac1b;
    padding-top: 0px;
    margin-left: 10px;
    border-width: 2px;
    border-style: solid;
    border-color: #faac1b;
    -o-border-image: initial;
    border-image: initial;
    border-radius: 33px;
    padding: 4px 28px;
    padding-bottom: 5px;
    margin-top: 15px;
    color: #fff !important;
    min-height: auto;
    box-shadow: 1px 4px 11px rgba(0, 0, 0, 0.4);
}

.btns-add {
    background-color: #faac1b;
    border-width: 2px;
    border-style: solid;
    border-color: #faac1b;
    border-radius: 33px;
    padding: 0 28px;
    color: #fff !important;
    height: 30px;
    line-height: 27px;
    margin-left: 4px;
}

@media(max-width: 767px) {
    .input-group[class*="col-"] {
        width: 100%
    }

    .col-sm-4.text-left,
    .tab-pane .col-sm-3.text-left {
        text-align: left
    }

    .navs.nav-tabs > li {
        margin-right: 0;
        width: 100%;
        display: block;
        margin-bottom: 2px
    }

    .nav-tabs > li > a {
        margin: 0;
    }
}

.navbar-default #side-menu.nav > li:hover,
.navbar-default #side-menu.nav > li:focus {
    border-color: #f48220;
    background-color: #54579d;
    border-left: 4px solid #f48220;
}

.navbar-default #side-menu.nav > li > a:hover,
.navbar-default #side-menu.nav > li > a:focus {
    border-color: #f48220;
    background-image: linear-gradient(to right, #2E1A80,#34A9FF );
}

#side-menu.nav > li {
    border-left: 4px solid transparent;
}

    #side-menu.nav > li.active {
        border-color: #f48220;
        background-image: linear-gradient(to right, #2E1A80,#34A9FF );
    }

#side-menu {
    background: #f5f5f5
}

.logo-element {
    text-align: center;
    font-size: 15px;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
    background-color: #faac1b;
    color: #fff;
}

h3.side-title {
    font-size: 16px !important;
    padding: 20px 0;
    background: #faac1b;
    margin: 0px;
    color: #fff;
    text-align: center
}

.sidebars h3 {
    font-size: 13px
}

.sidebars h4 {
    font-size: 12px;
    color: #faac1b
}

.sidebars {
    padding: 0;
    height: 100vh;
    background: #fcfbfb;
}

    .sidebars img {
        margin: auto
    }

    .sidebars .col-sm-3,
    .sidebars .col-sm-9 {
        padding: 0
    }

@media(max-width:991px) {
    .clearfi {
        clear: both
    }

    .sidebars,
    .sidebars .col-sm-3,
    .sidebars .col-sm-9 {
        padding-right: 15px;
        padding-left: 15px;
    }
}

.contact {
    margin-top: 20px;
    padding-left: 0
}

.btn:focus,
button:focus {
    outline: none
}

.main-news .items {
    margin-bottom: 22px;
}

.loading {
    position: fixed;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url(../img/logo.png) 50% 50% no-repeat;
    background-color: rgba(218, 218, 218, 0.7);
}

.chosen-container-single .chosen-single {
    padding: 0
}

.cancele {
    background-color: #ed1c24;
    border-color: #ed1c24;
    color: #FFFFFF;
}

.edit_user {
    display: inline-block;
    color: #fff;
    float: right;
    font-size: 23px
}

    .edit_user:hover {
        color: #ed1c24;
    }

.cols {
    position: relative;
}

    .cols .first {
        position: absolute;
        right: 18px;
        top: -10px;
        z-index: 2;
    }

    .cols .second {
        position: absolute;
        right: 18px;
        top: 8px;
    }

    .cols.offer .first {
        left: 18px;
        top: -20px
    }

    .cols.offer .second {
        left: 18px;
        top: -2px;
    }

.main_login {
    margin-top: 50px;
}

.main_login_inner {
    margin: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    max-width: 500px;
    margin-top: 10px;
}

    .main_login_inner .modal-header {
        background: #faac1b;
        color: #fff;
        border-radius: 4px 4px 0 0;
    }

.logo_profile {
    width: 250px
}

.main_login_inner .modal-body {
    padding: 50px 30px;
}

.logins,
.logins .loginPro {
    width: 100%;
    height: 100vh;
}

.lis .ibox-title {
    height: 85px;
}

.iboxx {
    border-top: 0 !important
}

.sec .ibox-title {
    border-color: #faac1b
}

.ibox .ibox-content p {
    margin-bottom: 0;
    color: #000
}

.star {
    color: #f9ab1b
}

.home .col-md-5,
.home .col-md-7 {
    padding-left: 5px;
    padding-right: 5px;
}

.typeInfo {
    position: relative;
}

    .typeInfo:before {
        content: '';
        position: absolute;
        width: 17px;
        height: 17px;
        background: #97d5c8;
        left: -22px;
    }

@media(max-width: 990px) {
    .mini-navbar .nav-second-level {
        position: static
    }
}

/* Start  buttons gradient */

.buttonGraCircle {
    background-color: transparent;
    background-image: none;
    margin-left: 10px;
    border: 0;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    padding: 0;
    color: #fff !important;
    box-shadow: transparent;
    width: 50px;
    height: 50px;
    font-size: 20px;
    display: inline-block;
    text-align: center;
    line-height: 50px;
}

.buttonGra {
    background-image: none;
    padding-top: 0px;
    margin-left: 10px;
    border: none;
    border-radius: 50px;
    padding: 0 28px;
    color: #fff !important;
    height: 40px;
    line-height: 40px;
    box-shadow: 1px 0px 15px 5px transparent;
    display: inline-block;
    font-size: 14px
}

    .buttonGra.buttonGraOrange {
        background-image: linear-gradient(to right, #f48020, #f48b1f, #f3961f, #f2a022, #f0aa26);
        box-shadow: 0px 4px 8px 2px rgba(244, 128, 32, 0.2);
    }

    .buttonGra:hover {
        background-image: linear-gradient(60deg, #f48220, #f49420, #efaa26);
    }

.buttonGraRed {
    background-image: linear-gradient(to bottom, #fa5a5d, #fa5a5e, #fa5a5f, #fa5a60, #fa5a61);
}

.buttonShadowRed {
    box-shadow: 0px 4px 8px 2px rgba(250, 90, 93, 0.2) !important;
}

.buttonGraRed:hover {
    background-image: linear-gradient(to bottom, #fa5a5d, #fa5a5f, #fa5a5e, #fa5a5d, #fa5a61);
}

.buttonGraPerp {
    background-image: linear-gradient(to right, #2E1A80,#34A9FF);
}

.buttonShadowPerp {
    box-shadow: 0px 4px 8px 2px rgba(41, 36, 136, 0.2) !important;
}

.buttonGraPerp:hover {
    background-image: linear-gradient(to right, #292488, #3a3397, #4942a6, #5851b6, #6761c5);
}

.buttonGraPerpRad {
    background-image: linear-gradient(to left, #252085, #352e93, #443da1, #524bb0, #605abe);
}

    .buttonGraPerpRad:hover {
        background-image: linear-gradient(to right, #252085, #352e93, #443da1, #524bb0, #605abe);
    }

.buttonGraOrange {
    background-image: linear-gradient(to right, #f48020, #f48b1f, #f3961f, #f2a022, #f0aa26);
}

    .buttonGraOrange:hover {
        background-image: linear-gradient(to left, #f48020, #f48b1f, #f3961f, #f2a022, #f0aa26);
    }

.buttonGraGreen {
    background-image: linear-gradient(to bottom, #12c679, #0fc57f, #0fc485, #12c38a, #18c28f);
}

.buttonShadowGreen {
    box-shadow: 0px 4px 8px 2px rgba(18, 198, 121, 0.2) !important;
}

.buttonGraGreen:hover {
    background-image: linear-gradient(to left, #19e0a4, #0fc57f, #25cb91, #11d480, #18c28f);
}

.buttonGraAmethyst {
    background-image: linear-gradient(to top, #8790e5, #67a3ed, #51b3ec, #52c0e6, #67cbdc);
}

.buttonShadowAmethyst {
    box-shadow: 0px 4px 8px 2px rgba(135, 144, 229, 0.2) !important;
}

.buttonGraAmethyst:hover {
    background-image: linear-gradient(to right, #8790e5, #67a3ed, #51b3ec, #52c0e6, #67cbdc);
}

.buttonGraGray {
    background-image: linear-gradient(to left, #98979b, #98979b, #98979b, #98979b, #98979b);
}

.buttonShadowGray {
    box-shadow: 0px 4px 8px 2px rgba(152, 151, 155, 0.2) !important;
}

.boxCircle {
    width: 25px;
    height: 25px;
    background-color: none;
    border: none;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    box-shadow: 1px 0px 15px 5px transparent;
    display: inline-block;
}

    .boxCircle.buttonGraOrange {
        background-color: #f8ac59
    }

    .boxCircle.buttonGraRed {
        background-color: #ef5352
    }

    .boxCircle.buttonGraPerp {
        background-color: #272287
    }

    .boxCircle.buttonGraGreen {
        background-color: #14c680
    }

    .boxCircle.buttonGraAmethyst {
        background-color: #8797e5
    }

.perColor {
    color: #3e427a !important
}

.orangeColor {
    color: #f5873c !important
}

.greenColor {
    color: #14c680 !important
}

.redColor {
    color: #ef5352 !important
}

.grayColor {
    color: #5d5d5d !important
}

.amethystColor {
    color: #67cbdc !important
}

.marBottom20 {
    margin-bottom: 20px
}

/* End buttons gradient */

/* Start general */

.page-heading {
    border-top: 0;
    box-shadow: 0 -2px 9px #3d35b3;
}

.paddLefRigh {
    padding-right: 5px;
    padding-left: 5px
}

ul {
    padding-left: 0;
}

li {
    list-style: none
}

.mainTitle {
    color: #3f3a9a;
    font-size: 18px;
    margin-bottom: 30px;
    position: relative;
}

/* End general */

/* Start  sideMenuRigh */

.sideMenuRigh {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
}

    .sideMenuRigh .nav-tabs {
        border: 0;
        margin-bottom: 20px
    }

.perMain {
    border-bottom: 1px dashed #ddd;
    padding-bottom: 30px;
}

.perBtn {
    background: transparent;
    border: 0;
    display: flex;
    padding: 0;
    align-items: center;
    margin-top: 20px;
}

.importantLabel {
    margin-left: 10px
}

.playMain .btn-default {
    background-color: #f3f3f4;
    border-color: transparent;
    color: #9b9ba2;
}

.playMain .btn {
    margin-bottom: 5px;
    min-width: 90px;
}

.playMain .buttonGraRed {
    color: #fff
}

/*.sideMenuRigh .nav-tabs > li {
    margin-right: 20px
}*/

    .sideMenuRigh .nav-tabs > li > a {
        color: #54579D;
        font-weight: 600;
        /*padding: 10px 0;*/
        border: 0;
        border-bottom: 1px solid transparent;
    }

    .sideMenuRigh .nav-tabs > li.active > a,
    .sideMenuRigh .nav-tabs li a.active {
        border: 0;
        border-bottom-color: currentcolor;
        border-bottom-style: none;
        border-bottom-width: 0px;
        border-bottom: 1px solid #fbac1c;
        color: #fbac1c;
    }

    .sideMenuRigh .nav-tabs > li > a:hover,
    .sideMenuRigh .nav-tabs > li > a:focus {
        background-color: transparent;
        color: #fbac1c;
        border: 0;
        border-bottom: 1px solid
    }

/* end sideMenuRigh */

/* Start Who list */

.orderMain {
    background: #fff;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0px 0px 10px #b4b0b0;
}

.orederHeaderName {
    display: flex;
    align-items: center;
    padding: 15px 5px;
}

@media(max-width: 767px) {
    .orederHeaderName {
        display: block;
    }

        .orederHeaderName .pull-right {
            float: none !important
        }
}

.orderFooter {
    padding: 15px 20px;
    border-top: 1px solid #ddd;
}

    .orderFooter .perBtn {
        margin-top: 0
    }

    .orderFooter .importantLabel {
        margin-left: 0;
        margin-right: 15px
    }

    .orderFooter i {
        font-size: 20px;
        margin-right: 5px
    }

.orederDetails {
    padding: 5px 15px;
}

    .orederDetails ul {
        display: flex;
        justify-content: space-between;
        flex: 1;
        flex-wrap: wrap;
    }

        .orederDetails ul li {
            margin-bottom: 5px
        }

.drop {
    position: absolute;
    right: 0;
    text-align: left;
    color: #fff;
    top: 0;
    text-align: center;
    width: 35px;
    height: 35px;
    line-height: 35px;
}

/* End Who list */

/* Start Smeh */

.loginClass i {
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    position: relative;
    top: 2px;
    right: -8px;
}

.nav.navbar-top-links > li > a:hover,
.nav.navbar-top-links > li > a:focus,
.btns-add:hover {
    background-color: #f47c20;
    border-color: #f47c20;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    background-color: #f47c20;
    border-color: #f47c20;
    color: #FFFFFF;
}

.breadcrumb > li a,
.breadcrumb > li,
.breadcrumb > li + li::before {
    color: #a8a8a8
}

/* End Smeh */

/* Start Clients */

.typeOreder button {
    background: transparent;
    border: 0;
    margin-bottom: 10px;
    color: #3f3a9a;
    transition: .3s ease-in-out;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -ms-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
}

    .typeOreder button i {
        margin-right: 8px
    }

    .typeOreder button.active,
    .typeOreder button:hover {
        color: #f47c20
    }

/* Start mainLine */

.createClints.wrapper-content {
    padding: 0 10px;
}

.typeOreder {
    padding-top: 40px;
    padding-bottom: 40px;
}

.mainCircle {
    position: relative;
    padding-left: 30px;
    padding-top: 40px;
    padding-bottom: 40px;
}

    .mainCircle:before {
        content: '';
        position: absolute;
        height: 100%;
        width: 1px;
        background: #c0c0c1;
        top: 0;
        bottom: 0;
        left: -15px
    }

.mainPanel.panel-group .panel {
    position: relative;
    overflow: visible;
    border-color: transparent;
    margin-bottom: 20px;
    box-shadow: 0px 0px 10px 5px rgba(221, 221, 221, 0.3);
}

.mainIcon {
    background: #fff;
    position: absolute;
    left: -67px;
    border-radius: 50%;
    padding: 4px;
    box-shadow: 0px 4px 8px 2px rgba(132, 132, 132, 0.2);
}

    .mainIcon img {
        width: 35px;
        height: 35px;
    }

    .mainIcon .completeImg,
    .completed .mainIcon .notCompleteImg {
        display: none
    }

.completed .mainIcon .completeImg {
    display: block
}

.completed .mainIcon {
    background-image: linear-gradient(to right, #f48020, #f48b1f, #f3961f, #f2a022, #f0aa26);
    box-shadow: 0px 4px 8px 2px rgba(244, 128, 32, 0.2);
}

.mainPanel .panel-default > .panel-heading {
    background-color: #fff;
    border-color: #fff;
    padding: 0;
}

.mainPanel .panel-title > a {
    position: relative;
    display: block;
    padding: 15px;
    color: #f47c20;
    font-weight: 100;
    box-shadow: 0px 2px 8px 2px rgba(132, 132, 132, 0.2);
}

    .mainPanel .panel-title > a i {
        position: absolute;
        right: 16px;
        font-size: 20px;
        top: 12px;
    }

.panel-default > .panel-heading + .panel-collapse .panel-body {
    border-top-color: rgba(221, 221, 221, 0.5);
}

.chooseBody {
    display: flex;
    flex: 1;
    justify-content: space-around;
    flex-wrap: wrap;
    align-items: center;
}

    .chooseBody .chooseHeader img {
        width: 50px;
        height: 50px;
    }

.chooseHeader {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 15px;
    width: 140px;
    height: 180px;
    margin-bottom: 10px;
    box-shadow: 0px 6px 7px 1px #ddd;
    transition: .3s ease-in-out;
    -webkit-transition: .3s ease-in-out;
    -moz-transition: .3s ease-in-out;
    -ms-transition: .3s ease-in-out;
    -o-transition: .3s ease-in-out;
    padding-top: 50px
}

    .chooseHeader:hover {
        /* background: url(../img/test.png) center top no-repeat; */
        background: url(../img/test.png) center bottom no-repeat;
    }

        .chooseHeader:hover h4 {
            color: #fff
        }

    .chooseHeader .active {
        display: none
    }

    .chooseHeader:hover .active {
        display: block;
        margin: auto;
    }

    .chooseHeader:hover .notActive {
        display: none
    }

    .chooseHeader h4 {
        color: #767676;
        font-size: 15px;
        margin-top: 15px
    }

.locationHeader .form-control {
    border: 0;
    border-bottom: 2px solid #e8e8e8;
    color: #4462a3;
    padding: 4px 0;
}

.locationHeader label {
    padding-top: 7px;
}

.attatchedBtn h4 {
    color: #676a6c;
    font-size: 13px;
    margin-bottom: 20px;
}

.attatchedBlock ul {
    display: inline-flex
}

    .attatchedBlock ul li {
        height: 130px;
        width: 130px;
        position: relative;
        padding: 15px;
        box-shadow: 0px 6px 7px 1px #ddd;
        text-align: center;
        margin-right: 10px;
        margin-bottom: 10px
    }

    .attatchedBlock ul i {
        color: #f47c20;
        border: 1px solid #f47c20;
        border-radius: 50%;
        font-size: 16px;
        width: 25px;
        height: 25px;
        text-align: center;
        line-height: 25px;
        position: absolute;
        left: 0px;
        top: 0;
        cursor: pointer;
    }

    .attatchedBlock ul li img {
        width: 85px;
        height: 95px;
    }

.uploads {
    position: relative;
    margin: 35px;
}

.attatchedBlock ul .uploads i {
    color: #4f549d;
    border-radius: 50%;
    height: 35px;
    width: 35px;
    line-height: 35px;
    text-align: center;
    border-color: #4f549d;
    font-size: 22px;
}

input#file {
    display: inline-block;
    width: 35px;
    padding: 30px 0 0 0;
    height: 30px;
    overflow: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    background: transparent;
    cursor: pointer;
    position: absolute;
    top: 3px;
    left: 0;
}

.buttonInLine li {
    display: inline-block;
    margin-right: 10px;
    background: #252085;
    border-radius: 33px;
    -webkit-border-radius: 33px;
    -moz-border-radius: 33px;
    -ms-border-radius: 33px;
    -o-border-radius: 33px;
    color: #fff;
    border-radius: 33px;
    padding: 0 28px;
    height: 40px;
    line-height: 40px;
    position: relative;
    margin-bottom: 10px
}

    .buttonInLine li span {
        border-bottom: 1px solid #fff;
        margin-right: 10px
    }

    .buttonInLine li i {
        position: absolute;
        right: 14px;
        top: 14px;
        cursor: pointer;
    }

.btnToggle label {
    border: 1px solid #ddd;
    border-radius: 33px;
    height: 40px;
    line-height: 40px;
    padding: 0 20px;
    text-align: center;
    min-width: 100px;
    color: #3f3a9a
}

@media (max-width: 424px) {
    .btnToggle label {
        min-width: 0;
        padding: 0 5px;
        font-size: 80%;
    }
}

    .btnToggle label.active {
        background: #3f3a9a;
        box-shadow: none;
        color: #fff
    }

.mainButtonFooter {
    margin-top: 20px;
}

/* End mainLine */

/* Start request list */

.perColor .grayColor {
    font-size: 14px
}

.dateProvider i {
    font-size: 14px
}

.orederDetails li i {
    margin-right: 5px
}

.orderMain .orangeColor {
    margin-left: 4px;
}

.requestTable {
    background: #fff;
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

    .requestTable .table > thead > tr > th,
    .requestTable .table > tbody > tr > th,
    .requestTable .table > tfoot > tr > th,
    .requestTable .table > thead > tr > td,
    .requestTable .table > tbody > tr > td,
    .requestTable .table > tfoot > tr > td {
        height: 80px;
        vertical-align: middle !important;
    }

    .requestTable .table > thead > tr > th {
        background: #fff;
        border-radius: 8px;
    }

.dateBlock {
    font-size: 14px;
    cursor: pointer;
}

/* End request list */

/* Start Request Claendar */

.calenderBlock {
    padding: 0
}

    .calenderBlock .calenderCollapse {
        padding: 20px;
        font-weight: 600;
        font-size: 16px
    }

.calenderCollapse button {
    background: transparent;
    border: 0;
    position: relative;
    top: -5px
}

    .calenderCollapse button img {
        width: 30px;
        height: 30px;
    }

.claenderList ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0
}

.claenderList {
    padding: 20px;
    background: #ebebf2;
}

    .claenderList:nth-child(even) {
        background: #fff;
    }

    .claenderList li {
        font-size: 16px
    }

.numberCalender {
    margin-top: 15px
}

.fc-state-active {
    background-color: #54579d;
    border-color: #54579d;
    color: #ffffff;
    background-image: linear-gradient(to left, #292488, #3a3397, #4942a6, #5851b6, #6761c5);
}

/* End Request Claendar */
/* start View Maintenance */
.buttonTop {
    border-top: 1px solid #ddd;
    padding-top: 15px;
    margin-top: 5px;
}

.sendMsg {
    background: #fff;
    position: relative;
    margin-bottom: 20px;
    box-shadow: 0px 2px 8px 2px rgba(132, 132, 132, 0.2);
    border-radius: 8px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -ms-border-radius: 8px;
    -o-border-radius: 8px;
}

.msgHeader {
    padding: 20px 40px 20px 20px;
    position: relative;
}

    .msgHeader:before {
        content: '';
        position: absolute;
        top: 12px;
        left: -30px;
        border-width: 15px;
        border-style: solid;
        border-color: transparent transparent transparent #fff;
    }

    .msgHeader h3 {
        margin-bottom: 20px
    }

    .msgHeader i {
        position: absolute;
        top: 50%;
        right: 20px;
        font-size: 22px;
        color: #3f3a9a;
    }

.msgFooter {
    padding: 20px 40px 20px 20px;
    border-top: 1px solid #ddd;
}

    .msgFooter h3 {
        font-size: 14px
    }

.sendMsg .mainIcon {
    background: transparent;
    box-shadow: none;
    left: -65px;
}

    .sendMsg .mainIcon h2 {
        position: absolute;
        top: 0;
        left: -65px;
        margin: 0;
        text-align: center;
        font-size: 22px;
    }

        .sendMsg .mainIcon h2 span {
            display: block;
            font-weight: bold;
            font-size: 34px;
        }

@media(max-width:767px) {
    .mainCircle {
        padding-left: 80px;
    }

        .mainCircle.logCircle {
            padding-left: 135px;
        }

        .mainCircle:before {
            left: 35px;
        }

        .mainCircle.logCircle:before {
            left: 90px;
        }
}

/* End View Maintenance */
/* End Clients */

/* Start Login */

.logins .title-header {
    margin-top: 110px;
}

.title-header h1 {
    display: inline-block;
    font-size: 22px;
    text-transform: uppercase;
}

    .title-header h1 span {
        color: #faac1b;
    }

.border {
    border-top: 1px solid #c1c1c1;
    height: 1px;
    margin: 15px auto 30px;
    position: relative;
    width: 210px;
}

    .border:before {
        background-color: #faac1b;
        content: "";
        height: 6px;
        right: 50%;
        margin-right: -20px;
        position: absolute;
        top: -3px;
        width: 40px;
    }

.logins .order-price {
    max-width: 500px;
    margin: 0 auto;
    background: #fff;
    margin-top: 24px;
    padding: 20px;
    box-shadow: 5px 4px 19px rgba(0, 0, 0, 0.175);
}

.logins .buttonGraOrange {
    margin-left: 0;
    margin-bottom: 10px
}

.register .title-header {
    margin-top: 40px
}

.register .order-price {
    max-width: 100%;
}

/* End Login */
/* Start WO */
.roleMedicta {
    display: flex;
    flex: 1;
}

    .roleMedicta li {
        display: flex;
        flex: 1;
    }

.span_pseudo,
.chiller_cb span:before,
.chiller_cb span:after {
    content: "";
    display: inline-block;
    background: #fff;
    width: 0;
    height: 0.2rem;
    position: absolute;
    transform-origin: 0% 0%;
}

.chiller_cb {
    position: relative;
    height: 2rem;
    display: flex;
    align-items: center;
}

    .chiller_cb input {
        display: none;
    }

        .chiller_cb input:checked ~ span {
            background: #f48720;
            border-color: #f48720;
        }

            .chiller_cb input:checked ~ span:before {
                width: 1rem;
                height: 0.15rem;
                transition: width 0.1s;
                transition-delay: 0.3s;
                -webkit-transition: width 0.1s;
                -moz-transition: width 0.1s;
                -ms-transition: width 0.1s;
                -o-transition: width 0.1s;
            }

            .chiller_cb input:checked ~ span:after {
                width: 0.4rem;
                height: 0.15rem;
                transition: width 0.1s;
                transition-delay: 0.2s;
            }

        .chiller_cb input:disabled ~ span {
            background: #ececec;
            border-color: #dcdcdc;
        }

        .chiller_cb input:disabled ~ label {
            color: #dcdcdc;
        }

            .chiller_cb input:disabled ~ label:hover {
                cursor: default;
            }

    .chiller_cb label {
        padding-left: 2rem;
        position: relative;
        z-index: 2;
        cursor: pointer;
        margin-bottom: 0;
    }

    .chiller_cb span {
        display: inline-block;
        width: 1.2rem;
        height: 1.2rem;
        border: 2px solid #f48720;
        position: absolute;
        left: 0;
        transition: all 0.2s;
        z-index: 1;
        top: 5px;
        box-sizing: content-box;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
        -ms-border-radius: 50%;
        -o-border-radius: 50%;
    }

       

.change_address .chiller_cb span {
    left: auto;
    right: 0;
}

.change_address .chiller_cb label {
    width: 100%
}

.change_address .chiller_cb {
    display: block
}

    .change_address .chiller_cb label {
        padding-left: 0;
        padding-right: 2rem;
    }

.trForms {
    position: relative;
    margin-bottom: 20px
}

    .trForms i {
        position: absolute;
        top: 8px;
        right: 5px;
        font-size: 20px;
        cursor: pointer;
    }

.change_address {
    padding: 5px 10px;
}

.showServices .modal-header {
    padding: 15px 10px;
    background: #54579d;
}

    .showServices .modal-header .close {
        margin-top: 7px;
        color: #fff;
        opacity: 1;
    }

    .showServices .modal-header h3 {
        color: #fff
    }

.listTitle {
    margin: 30px 0;
    position: relative;
}

    .listTitle::before {
        content: '';
        border-bottom: 1px solid #ddd;
        position: absolute;
        left: 0;
        right: 0;
        top: 15px;
        z-index: -1;
    }

    .listTitle h3 {
        background: #f3f3f4;
        display: inline-block;
        z-index: 1;
        padding-right: 20px
    }

.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
    vertical-align: middle
}

.mainButtonFooter h3 {
    font-size: 20px
}

.invoiceMain {
    padding-top: 40px;
    padding-bottom: 40px;
}

/*  */
.dropzone {
    min-height: 180px
}

/* End WO */
/* Start menu */
.menueAdmin {
    display: inline-block
}

    .menueAdmin a {
        color: #fff;
        display: inline-block;
        vertical-align: middle;
    }

    .menueAdmin img {
        display: inline-block
    }

.imge {
    max-width: 100%;
    padding: 25px;
    background: #fff;
    height: 94px;
    background: #fff !important;
    border: none !important;
    border-right: 1px solid #f5f5f5 !important;
}

.mainImg {
    height: 150px;
    padding: 20px;
    background: #f5f5f5 !important;
    border: none !important;
}


/* End menu */
/* tree CSS*/
.tree-children.tree-children-no-padding {
    padding-right: 0
}

.tree-children {
    padding-right: 20px;
    overflow: hidden
}

.node-drop-slot {
    display: block;
    height: 2px
}

    .node-drop-slot.is-dragging-over {
        background: #ddffee;
        height: 20px;
        border: 2px dotted #888;
    }

.toggle-children-wrapper-expanded .toggle-children {
    transform: rotate(90deg)
}

.toggle-children-wrapper-collapsed .toggle-children {
    transform: rotate(-180deg);
}

.toggle-children-wrapper {
    padding: 2px 3px 5px 1px;
}
/* tslint:disable */
.toggle-children {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAASCAYAAABSO15qAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAABAhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1wTU06T3JpZ2luYWxEb2N1bWVudElEPSJ1dWlkOjY1RTYzOTA2ODZDRjExREJBNkUyRDg4N0NFQUNCNDA3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkYzRkRFQjcxODUzNTExRTU4RTQwRkQwODFEOUZEMEE3IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkYzRkRFQjcwODUzNTExRTU4RTQwRkQwODFEOUZEMEE3IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDQyAyMDE1IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTk5NzA1OGEtZDI3OC00NDZkLWE4ODgtNGM4MGQ4YWI1NzNmIiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6YzRkZmQxMGMtY2NlNS0xMTc4LWE5OGQtY2NkZmM5ODk5YWYwIi8+IDxkYzp0aXRsZT4gPHJkZjpBbHQ+IDxyZGY6bGkgeG1sOmxhbmc9IngtZGVmYXVsdCI+Z2x5cGhpY29uczwvcmRmOmxpPiA8L3JkZjpBbHQ+IDwvZGM6dGl0bGU+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+5iogFwAAAGhJREFUeNpiYGBgKABigf///zOQg0EARH4A4gZyDIIZ8B/JoAJKDIDhB0CcQIkBRBtEyABkgxwoMQCGD6AbRKoBGAYxQgXIBRuZGKgAKPIC3QLxArnRSHZCIjspk52ZKMrOFBUoAAEGAKnq593MQAZtAAAAAElFTkSuQmCC');
    height: 8px;
    width: 9px;
    background-size: contain;
    display: inline-block;
    position: relative;
    top: 1px;
    background-repeat: no-repeat;
    background-position: center;
}

.toggle-children-placeholder {
    display: inline-block;
    height: 10px;
    width: 10px;
    position: relative;
    top: 1px;
    padding-left: 3px;
}

.node-content-wrapper {
    display: inline-block;
    padding: 2px 5px;
    border-radius: 2px;
    transition: background-color .15s,box-shadow .15s;
}

.node-wrapper {
    display: flex;
    align-items: flex-start;
}

.node-content-wrapper-active,
.node-content-wrapper.node-content-wrapper-active:hover,
.node-content-wrapper-active.node-content-wrapper-focused {
    background: #faac1b;
    color: #fff;
}

.node-content-wrapper-focused {
    background: #faac1b;
    color: #fff;
}

/*.node-content-wrapper:hover {
    background: #faac1b;
    color: #fff;
}
.node-content-wrapper-active, .node-content-wrapper-focused, .node-content-wrapper:hover {
    box-shadow: inset 0 0 1px #999;
}
*/
.node-content-wrapper.is-dragging-over {
    background: #ddffee;
    box-shadow: inset 0 0 1px #999;
}

.node-content-wrapper.is-dragging-over-disabled {
    opacity: 0.5
}

tree-viewport {
    -webkit-tap-highlight-color: transparent;
    height: 100%;
    overflow: auto;
    display: block;
}

.tree-children {
    padding-right: 20px
}

.empty-tree-drop-slot .node-drop-slot {
    height: 20px;
    min-width: 100px
}

.angular-tree-component {
    width: 100%;
    position: relative;
    display: inline-block;
    cursor: pointer;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
    -khtml-user-select: none; /* Konqueror */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE/Edge */
    user-select: none; /* non-prefixed version, currently not supported by any browser */
}

tree-root .angular-tree-component-rtl {
    direction: rtl;
}

    tree-root .angular-tree-component-rtl .toggle-children-wrapper-collapsed .toggle-children {
        transform: rotate(180deg) !important;
    }

    tree-root .angular-tree-component-rtl .tree-children {
        padding-left: 20px;
        padding-right: 0;
    }

tree-node-checkbox {
    padding: 1px;
}

div.tree div.tree-children::before,
div.tree::before {
    content: "";
    position: absolute;
    border-right: 1px dotted #23527c;
    height: 100%;
    top: -14px;
    right: 12px
}

div.tree {
    padding-right: 0;
    margin-right: -5px
}

    div.tree div.tree-children {
        position: relative;
        padding-right: 0;
        margin-right: 16px
    }

        div.tree div.tree-children::before {
            right: 5px
        }

    div.tree tree-node > div > .node-wrapper {
        margin-right: 24px
    }

        div.tree tree-node > div > .node-wrapper > .node-content-wrapper {
            margin-right: 4px
        }

    div.tree tree-node > div.tree-node-leaf > .node-wrapper {
        margin-right: 0
    }

    div.tree tree-node > div::before {
        content: "";
        position: absolute;
        border-bottom: 1px dotted #23527c;
        width: 7px;
        margin-top: 12px;
        right: 7px
    }

    div.tree tree-node > div .toggle-children-wrapper {
        width: 13px;
        height: 13px;
        border: 1px solid #23527c;
        position: absolute;
        right: 15px;
        margin-top: 5px;
        margin-right: 0;
        display: inline-block;
        background-color: #fff;
        z-index: 1
    }

        div.tree tree-node > div .toggle-children-wrapper::before {
            content: "";
            display: inline-block;
            width: 7px;
            border-top: 1px solid #23527c;
            position: absolute;
            top: 5px;
            right: 2px
        }

        div.tree tree-node > div .toggle-children-wrapper.toggle-children-wrapper-collapsed::after {
            content: "";
            display: inline-block;
            height: 7px;
            border-right: 1px solid #23527c;
            position: absolute;
            top: 2px;
            right: 5px
        }

        div.tree tree-node > div .toggle-children-wrapper .toggle-children {
            display: none
        }

    div.tree tree-node > div .node-content-wrapper {
        margin-right: 4px
    }

    div.tree > tree-node > div::before {
        right: 14px
    }

    div.tree > tree-node > div > .node-wrapper > tree-node-expander > .toggle-children-wrapper {
        right: 22px
    }


.tree-children {
    border-left: 1px solid #ddd;
    margin-left: 20px;
}

.btn-toolbar {
    display: inline-flex;
    align-items: center;
    margin-left:5px;
    display:none;
}
.show-btn-toolbar{
    display:inline-flex;
}
    .btn-toolbar button {
        background-color: transparent;
        border: 0;
        padding-top: 0;
    }

.arrowDragBtn label {
    max-width: initial !important
}


/*End tree CSS*/



.chiller_cb span:before {
    transform: rotate(-55deg);
    top: 1rem;
    left: 0.37rem;
}

.chiller_cb span:after {
    transform: rotate(35deg);
    bottom: 0.35rem;
    left: 0.2rem;
}
.arrowDragBtn label {
    max-width: initial !important
}


 
#taskSelctTableId{direction:initial !important;}


.mainTabPage .tab-page {
    display: block 
}

.scheduleItemTable table td {
    min-width: 100px
}

    .scheduleItemTable table td:nth-child(2) {
        width: 500px
    }

@media(min-width:991px) {
    .scheduleItemTable .col-md-4,
    .scheduleItemTable .col-md-8 {
        width: 100%
    }
}
.outer {

    position: relative;
    overflow-x: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

    .outer div {
        width: 24.5%;
        background-color: #eee;
        float: none;
        height: 90%;
        margin: 0 0.25%;
        display: inline-block;
        zoom: 1;
    }

.ScheduleheaderDetails {
    padding: 12px;
    background-color: #ddd;
    text-align: center;
    font-size: medium;
    border-radius:6px;
}


.SchmarginR {
    margin-left: 1px;
    margin-right: 1px;
}


.SchmarginL {
    margin-left: 1px;

}


.btn_AddAgentInLocation {
    padding-bottom: 13px;
    padding-left: 132px;
}

/*start new edit css*/
a.new__buttonGra__rifgr {
    border-radius: 0px 25px 25px 0px;
    margin: 0px;
    padding: 0px 10px;
    height: 30px;
    background: #54579d;
    margin-right: -5px;
    font-size: 12px;
    line-height: 30px;
    width: 42px;
    text-align: center;
}

a.new__buttonGra__left {
    border-radius: 25px 0px 0px 25px;
    margin: 0px;
    padding: 0px 10px;
    height: 30px;
    line-height: 30px;
    width: 42px;
    font-size: 14px;
    text-align: center;
}

nav.navbar-default.navbar-static-side #side-menu.nav li li {
    background-color: #F8F8FB;
    color: #999;
    border: none !important;
}

nav.navbar-default.navbar-static-side #side-menu .module-nav {
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
}

nav.navbar-default.navbar-static-side #side-menu.nav > li {
    border-left: 0px solid transparent;
}

nav.navbar-default.navbar-static-side #side-menu.nav li li a {
    color: #777;
    border-color: white;
    /* border-bottom: 1px solid #000; */
}

nav.navbar-default.navbar-static-side .navbar-default #side-menu.nav > li:hover, .navbar-default #side-menu.nav > li:focus {
    border-color: #54579d;
    background-image: linear-gradient(to right, #2E1A80,#34A9FF );
    border-left: 0px solid #f48220;
}

nav.navbar-default.navbar-static-side .navbar-default .nav > li > a:hover, .navbar-default .nav > li > a:focus {
    background-color: #f8f8fb;
    color: #F47C20 !important;
}

nav.navbar-default.navbar-static-side #side-menu.nav > li.active > a:hover, .navbar-default #side-menu.nav > li.active > a:focus {
    border-color: #f48220 !important;
    background-color: #54579d !important;
    color: #fff !important;
}
 
/*end edit css*/

/*Start Edit*/
.buttonGra-group .buttonGra-sm i {
    line-height: 29px
}

.table > thead > tr > th {
    font-size: 12px;
}

.table td {
    font-size: 13px;
}

.chiller_cb strong {
    font-weight: normal;
}

.nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
    background-color: #55589d !important;
    color: #fff !important;
}

.headBreadCrumb {
    font-size: 18px
}


/*End Edit*/
/**/


.buttonTopHeader {
    display: inline-flex;
    align-items: center;
    justify-content: center
}
/*.ui-datepicker-year {
    display: none;
}*/
.cursorPointer {
    cursor: pointer
}
.editBtnCheck i {
    line-height: 30px
}

@media(max-width : 767px) {
    .white-bg.page-heading.home .text-last {
        text-align: center;
    }

    .white-bg.page-heading.home .pull-first {
        float: none;
    }

    .white-bg.page-heading.home .pull-first {
        float: none;
    }
    .white-bg.page-heading.home .buttonGra-group {
        text-align: center;
        display: block !important;
        margin-bottom: 4px;
    }
}

/*Start Chart*/
.chart-container .col-md-4 {
    padding-right: 5px;
    padding-left: 5px;
}
.navbar-fixed-top,
.navbar-static-top {
    background-image: linear-gradient(to right, #2E1A80,#34A9FF );
}
.chart-container .chartjs-render-monitor,
.chart-container .gauge-chart-container {
    background: white;
    margin-bottom: 10px;
    padding: 5px;
}
/*End Chart*/

#side-menu .link-active {
    background-image: linear-gradient(to right, #2E1A80,#34A9FF );
    color: white;
}
/*End Chart*/
.itemsTable {
    display: block;
    overflow-x: auto;
    max-width: 120%;
    width: auto;
    white-space: nowrap;
}

.table-responsive {
    overflow-x: inherit;
}