:root {

  --promed-color: black;/*#0f2d77;/*#464775;/*#12356F;/*#075490; /*#598ce5;*/

  --promed-dark-color: #3b77dd;

  --promed-light-color: #dee2e6;

  --promed-left-color: #911916; /*#141C27 /*#33344A;*/

  --promed-left-select-color: #0f2d77; /*#141C27 /*#33344A;*/

  --promed-left-back-color: #101d6b; /*#141C27 /*#33344A;*/

  --promed-text-color: #0f2d77; /*#141C27 /*#33344A;*/

  --promed-select-color: #1c66cf;

  --promed-back-color: #f2f2f2;/*#e0e0e0;/*#ebe9f1; /*#b0a3d3;/*#ecf0f5;*/

  --promed-backsearch-color: #241b42; /*#b0a3d3;/*#ecf0f5;*/

}



/*margin and padding*/

.detail{

    padding: 8px 8px;

    font-size: 14px;

    background-color: #fafbfd;

    border: 1px solid #eaecf0;

    color: #68747f;

}

.m0{

    margin: 0;

}

.m5{

    margin: 5px;

}

.mt5 {

    margin-top: 5px;

}

.m10{

    margin: 10px;

}

.m15{

    margin: 15px;

}

.m20{

    margin: 20px;

}

.ml15 {

    margin-left: 15px !important;

}

.mt15 {

    margin-top: 15px;

}

.mt20 {

    margin-top: 20px;

}

.mr15 {

    margin-right: 15px !important;

}

.mb15 {

    margin-bottom: 15px;

}

.mb20 {

    margin-bottom: 20px;

}

.ml10 {

    margin-left: 10px;

}

.mr10 {

    margin-right: 10px;

}

.mr-1 {

    margin-right: -1px !important;

}

.ml-1 {

    margin-left: -1px !important;

}

.mb0{

    margin-bottom: 0 !important; 

}

.mt50{

    margin-top: 50px !important; 

}

.mt0{

    margin-top: 0 !important; 

}

.mt-5{

    margin-top: -5px;

}

.mt-50{

    margin-top: -50px;

}

.p0 {

    padding: 0 !important;

}

.p5 {

    padding: 5px;

}

.p10 {

    padding: 10px;

}

.p15 {

    padding: 15px;

}

.p20 {

    padding: 20px !important;

}

.p30 {

    padding: 30px;

}

.pb10{

    padding-bottom:10px; 

}

.pb5{

    padding-bottom:5px; 

}

.pb0{

    padding-bottom:0 !important; 

}

.pl10{

    padding-left:10px; 

}

.pl15{

    padding-left:15px; 

}

.pr10{

    padding-right:10px; 

}

.pr15{

    padding-right:15px; 

}

.pt10 {

    padding-top: 10px;

}

.pt5 {

    padding-top: 5px !important;

}

.pt0 {

    padding-top: 0px !important;

}

.w25 {

    width: 25px;

}

.w50 {

    width: 50px;

}

.w80 {

    width: 80px;

}

.w100 {

    width: 100px;

}

.w125 {

    width: 125px;

}

.w150 {

    width: 150px;

}

.w200 {

    width: 200px;

}

.w250 {

    width: 250px;

}

.w300 {

    width: 300px;

}

.w400 {

    width: 400px;

}



.min-w150{

    min-width: 150px;

}

.w5p{

    width:5%;

}

.w10p{

    width:10%;

}

.w15p{

    width:15%;

}

.w20p{

    width:20%;

}

.w25p{

    width:25%;

}

.w30p{

    width:30%;

}

.w50p{

    width:50%;

}

.w60p{

    width:60%;

}

.w70p{

    width:70%;

}

.w80p{

    width:80%;

}

.w90p{

    width:90%;

}

.w100p{

    width:100%;

}

.max-w500{

    max-width: 500px;

}

.h100p{

    height:100%;

}

/*avatar*/

.avatar {

    display: inline-block;

    white-space: nowrap;

}

.avatar-lg {

    width: 125px;

    height:125px;

}

.avatar-md {

    width: 80px;

    height: 80px;

}

.avatar-sm {

    width: 50px;

    height: 50px;

}

.avatar-xs {

    width: 30px;

    height: 30px;

}



.avatar img{

    height: auto;

    max-width: 100%;

    border-radius: 50%;

}



/*form*/

label{

    font-weight: normal;

     /*padding-top: 10px;*/

}

.general-form .form-group:before,

.general-form .form-group:after {

    content: "";

    display: table;

    line-height: 0;

}

.general-form .form-group:after {

    clear: both;

}

.general-form textarea {

    height: 75px;

}

.general-form .select2 {

    width: 100%;

}

.general-form .mini {

    max-width: 200px;

}



/*.general-form .form-control {

    border-radius: 2px;

    border-color: #f6f8f9;

    background-color: #f6f8f9;

    box-shadow: none;

    transition: background 0.5s;

}*/

hr  {

   margin-top: 5px;

   margin-bottom: 20px;

}



    /*border-top: 1px dotted black;

}

.general-form.white .form-control {

    border-color: #fff;

    background-color: #fff;

}

.general-form.white label {

    margin-top: 5px;

}

.general-form.white .select2-container .select2-choice{

    background-color: #fff !important;

}



.has-error .help-block,

.has-error .control-label,

.has-error .radio,

.has-error .checkbox,

.has-error .radio-inline,

.has-error .checkbox-inline,

.has-error.radio label,

.has-error.checkbox label,

.has-error.radio-inline label,

.has-error.checkbox-inline label{

    box-shadow: none;

    color: #ec5855;

}

.general-form .has-error .form-control{

    box-shadow: none;

    color: #ec5855;

}

.general-form .form-control.white {

    background-color: #fff;

}

.general-form.white .form-control:focus,

.general-form .form-control.white:focus{

    border-color: #ebeff2;

    background-color: #ebeff2;

}

.general-form .input-group-addon{

    border-color: #f6f8f9;

    background: #f7f9fa;

    border-radius: 2px;

}

.form-control:focus{

    box-shadow: none;

}



.file-upload {

    position: relative;

    overflow: hidden;

    margin: 10px;

}

.file-upload input.upload {

    position: absolute;

    top: 0;

    right: 0;

    margin: 0;

    padding: 0;

    font-size: 20px;

    cursor: pointer;

    opacity: 0;

    filter: alpha(opacity=0);

}





.dashed-row .form-group{

    border-bottom: 1px dashed #e2e4e8;

    padding-bottom: 15px;

} 

.dashed-row .form-group:last-child{

    border-bottom: none;

    padding-bottom: 0px;

}

.dashed-row .bd {

    border-bottom: 1px dotted #e2e4e8;

}

.select2-with-searchbox {

    padding-bottom: 5px;

}



/*x-editable*/

.editable-container .select2-container{

    min-width: 110px;

}



.editable-click, a.editable-click, a.editable-click:hover{

    border-bottom-color: transparent;

}



/*datatable*/

table.dataTable{

    border-collapse: collapse;

    box-sizing: border-box;

}



.dataTable td:hover{

    background: #f2f4f6;

}

.dataTable tbody tr:hover td{

    background:#f2f4f6 !important;

}



.dataTable.no-hover tr:hover td,

.dataTable.no-hover tbody tr:hover{

    background: transparent !important;

}



.dataTable tbody tr.active td,

.dataTable tbody tr.active:hover td{

    background: var(--promed-color) !important;

    color: #fff !important;

    cursor: default;

}

.dataTable tbody tr.active .label{

    color: #00b393;

    background: #fff;

}

.dataTable tbody tr.active a.link{

    color: black;

}

.dataTable tbody tr:hover td{

    background:#f2f4f6;

}

table.dataTable thead th{

    border: 1px solid #f2f2f2;

    padding: 15px 10px;

}

table.dataTable thead td{

    border: 1px solid #f2f2f2;

    padding: 10px;

}

table.dataTable.stripe tbody tr.odd,

table.dataTable.display tbody tr.odd{

    background-color: #fff;

}

table.dataTable.row-border tbody th, 

table.dataTable.row-border tbody td,

table.dataTable.display tbody th,

table.dataTable.display tbody td,

table.dataTable.display tfoot th,

table.dataTable.display tfoot td{

    border: 1px solid #f2f2f2;

    background-color: #fff;

}

table.dataTable.no-footer{

    border-bottom: 1px solid #f2f2f2;

}

table.dataTable.b-b-only tbody th, 

table.dataTable.b-b-only tbody td{

    border:none;

    border-bottom: 1px solid #f2f2f2;

}

.datatable-tools {

    margin: 15px 0;

}

.datatable-export a{

    box-shadow: none !important;

    border: 1px solid #ccc;

    font-size: 14px;

    margin: 0 -1px;

    padding: 6px 10px;

}



table.dataTable tfoot th,

table.dataTable tfoot td {

    padding: 10px;

}

button.DTTT_button,

div.DTTT_button,

a.DTTT_button,

a.DTTT_button:focus{

    background: #fff;

    border-color: #e2e7f1 !important;

    text-decoration: none;

}

a.DTTT_button:hover{

    background: #f2f2f2;

}

div.DTTT_container{

    margin-bottom: 15px;

}

table.dataTable thead .sorting{

    background-image: none;

}

.dataTables_empty{

    padding: 15px 10px !important;

}

.dataTables_filter {

    margin: 0 0px 10px 10px;

}

.dataTables_filter input,

.datatable-search,

.custom-filter-search{

    border-radius: 2px;

    border:1px solid #e2e7f1;

    box-shadow: none;

    padding: 7px 10px;

    outline: none;

    font-weight: normal;

    background: url('../images/search.png') no-repeat 96% 45% #fff; 

    width: 200px;

    transition: all 0.5s;

}

.dataTables_filter input:focus,

.datatable-search:focus,

.custom-filter-search:focus{

    border-color: #ebeff2;

    background-color: #ebeff2;

}



.dataTables_wrapper .dataTables_paginate .paginate_button {

    background: #fff !important;

    margin:0 0 0 -1px;

    /*border:1px solid #f2f2f2 !important;*/

    border-radius: 2px;

}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,

.dataTables_wrapper .dataTables_paginate .paginate_button:focus

{

    /*background: #f2f4f6 !important;*/

    /*border:1px solid #e2e7f1 !important;*/

    color: #414244 !important;

    outline: none;

    box-shadow: none;

}

.dataTables_wrapper .dataTables_paginate .paginate_button.current,

.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover{

   /* background: #f1f1f5 !important;*/

    color: #000 !important;

    border-color: #e2e4e7 !important;

    cursor: default;



    border-radius: 0;

}

.dataTables_info{

    color: #c1c4c6 !important;

}

.dataTables_wrapper .dataTables_processing{

    height: 60px;

}

.custom-toolbar .select2-container .select2-choice{

    background-color: #fff !important;

}

table.dataTable thead th:first-child,

table.dataTable tbody td:first-child{

    padding-left: 15px;

}



.no-thead thead{

    display: none;

}



td .progress {

    box-shadow:none !important;

    height: 8px;

    margin:10px 10px 10px 10px;

}

td:hover .progress{

    background-color: #fff;

}



table.dataTable.no-padding td{

    padding: 0;

}

.dataTable .label {

    display: inline-block;

    padding: 4px 5px;

    margin-bottom: 2px;

}



.filter-multi-select.open,

.filter-multi-select:focus,

.filter-multi-select:active,

.dropdown-toggle{

    border-color: #f2f4f6 !important;

}

.custom-toolbar .dropdown-toggle{

    background-color: #fff !important; 

}

.filter-multi-select .dropdown-menu{

    padding: 4px; 

}

.filter-multi-select .list-group-item{

    padding: 6px 10px;

    border-top: none !important;

    border-left: none !important;

    border-right: none !important;

    border-bottom: 2px solid #fff !important;

}

.filter-multi-select .list-group-item:not(.active):hover{

    background-color: #f2f2f2;

}

.filter-multi-select .caret{

    color: #888888;

}



html.print-peview, 

html.print-peview body,

div.print-peview{

    overflow:auto !important;

    height: auto !important;

}

html.print-peview #content{

    margin-top: 0 !important;

}

@media print {

    .print-peview {

        color: #000;

    }

    a[href]:after {

        content: none !important;

    }

    .no-print{

        display: none !important;

        height: 0;

    }

}



/*table*/

.table-responsive {

    width: 100%;

    max-width: 100%;

    border: none !important;

}

td.option a{

    cursor: pointer;

    min-width: 28px;

    background:#fff;

    color: #a1a3a5;

    border-radius: 50%;

    display: inline-block;

    position: relative;

    vertical-align: central;

    text-align: center;

    margin: 0 5px;

    padding: 4px 0px;

    border:1px solid #e2e7f1;

}

td.option a:hover{

    background:var(--promed-color);

    color: #fff;

    border:1px solid #2ac2d4;

}

td.option a.delete:hover{

    background:#d9534f;

    color: #fff;

    border:1px solid #d9534f;

}



.table-responsive th:first-child,

.table-responsive td:first-child{

    border-left: none !important;

}

.table-responsive th:last-child,

.table-responsive td:last-child{

    border-right: none !important;

}



/*check box*/

.checkbox-blank{

    background: url('../images/checkbox.png') no-repeat  center center;

    width:20px;

    height:20px;

    margin: 0 15px 0 0;

    display: inline-block;

    float: left;

}

.checkbox-blank:hover{

    background-color: #fff;

}

.checkbox-checked{

    background: url('../images/check_mark.png') no-repeat  center center;

    width:20px;

    height:20px;

    margin: 0 15px 0 0;

    display: inline-block;

    float: left;

}

.checkbox-un-checked{

    background: url('../images/checkbox-un-checked.png') no-repeat  center center;

    width:20px;

    height:20px;

    margin: 0 15px 0 0;

    display: inline-block;

    float: left;

}

/*bootstrap modal*/



.modal-content {

    border-radius: 0px;

    border: 1px solid #aaa;

    box-shadow: 0 5px 15px rgba(0,0,0,.2);

}

.modal-backdrop.in{

    filter: alpha(opacity=20);

    opacity: 0.2;

}

.modal-dialog {

    -webkit-transition:width 500ms ease;

    -moz-transition:width 500ms ease;

    -o-transition:width 500ms ease;

    transition:width 500ms ease;

}

.mini-modal {

    width: 300px !important;

}

body.modal-open, 

.modal-open .navbar-fixed-top, 

.modal-open .navbar-fixed-bottom {

    margin-right: 0px!important;

}

.modal-header{

    border-bottom: 1px solid #f6f8f9;

}

.modal-footer {

    border-top: 1px solid #f6f8f9;

    padding: 15px 30px;

}

.close{

    font-size: 25px;

    font-weight: normal;

}

.draggable {

    cursor: move;

}





/*bootstrap-timepicker*/

.bootstrap-timepicker-widget{

    z-index: 1050;

}



/*modal mask*/

.modal-mask {

    position: absolute;

    top: 0;

    left: 0;

    background-color:#fff;

}

.circle-done {

    margin:10px auto;

    width: 80px;

    height: 80px;

    border-radius: 40px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    border: solid 5px var(--promed-color);

    text-align: center;  

    font-size: 40px;

    padding: 10px;

    color:green;

}

.circle-done i{

    display: inline-block;

    max-width: 0%;

    overflow: hidden;



}

.circle-done.ok i{

    max-width: 80%;

    -webkit-transition:max-width 1000ms ease;

    -moz-transition:max-width 1000ms ease;

    -o-transition:max-width 1000ms ease;

    transition:max-width 1000ms ease;

}

/*social-link*/

.social-link{

    width:35px;

    height:35px;

    margin:0 10px 10px 0;

    padding:5px 0;

    text-align: center;

    font-size: 20px;

    border-radius: 50%;

    color: #fff;

    background-color: transparent;

    border:2px solid #fff;

    transition:all 300ms ease;

}

.social-link:focus{

    color: #fff;

}

.social-link, 

.social-link:hover,

.social-link:active,

.social-link:focus{

    text-decoration: none;

}



.social-link:hover{

    color: rgba(0,0,0,0.5);

    background-color: #fff;

}



/*alert*/

.alert {

    border: 0;

}

.alert .progress {

    background-color: transparent;

    box-shadow:none !important;

    height: 3px;

    border-radius: 0;

    margin:19px 0px -15px -15px;

}

.alert .progress-bar {

    box-shadow: none !important;

    background-color: rgba(0, 0, 0, 0.3);

}



.app-alert-message {

    display: inline-block;

    margin-right: 5px;

    max-width: 350px;

    min-width: 165px;

}



.app-alert.animate{

    bottom: 0;

    position: fixed;

    z-index: 10000;

    border-radius: 2px;

    box-shadow: 0 2px 1px rgba(0, 0, 0, 0.1);

    opacity: 0.25;

    right: -350px;

}

.app-alert.alert-info {

    background-color:  #20c5cb;

    color: #fff;

}

.app-alert.alert-success {

    background-color:  #00b393;

    color: #fff;

}

.app-alert.alert-danger {

    background-color:  #f06c71;

    color: #fff;

}

.app-alert.alert-warning {

    background-color:  #f0ad4e;

    color: #fff;

}

.app-alert a{

    color: #444;

}

.alert-warning{

    background-color: #fff2cc;

}



/*progress-bar*/

.progress.thin {

    height: 3px;

}



/* widget */

.form-widget {

    margin-bottom: 25px

}

.widget-title{

    padding:10px 0px;

}

.form-widget .progress{

    height: 5px;

}



/*color tag*/

.color-tag {

    display: inline-block;

    width: 15px;

    height: 15px;

    margin:2px 10px 0 0;

    transition:all 300ms ease;

    -moz-transition: all 0.1s;

    -webkit-transition: all 0.1s;

    transition: all 0.1s;

}

.color-tag.clickable:hover{

    -moz-transform: scale(1.5);

    -webkit-transform: scale(1.5);

    transform: scale(1.5);

}



.color-tag.active {

    border-radius: 50%;

}



/*text-color*/

.text-danger{

    color: #d9534f;

}



.text-warning{

    color: #f0ad4e;

}





/*message*/

.message-row{

    padding: 8px 15px;

}

.message-row.unread {

    border-left: 3px solid #337ab7;

}

.message-row.unread strong,

.message-row.unread span{

    color: #337ab7;

}



.message-button-list{

    width: 150px;

    padding-left: 10px;

}



.message-button-list .list-group .list-group-item{

    border-radius: 0 !important;

    border:none !important;

    background: transparent;

    color: #4e5e6a;

}



.message-button-list  .list-group-item:hover,

.message-button-list  .list-group-item.active{

    background: rgba(0, 0, 0, 0.02);

}



/*chart*/

.chart-circle canvas{

    border-radius: 50%;

    background: #fff;

}

.chart-circle .chart-label{

    position: absolute;

    z-index: 1;

    text-align: center;

}







/*log*/

del {



}

ins {

    color: #00b393;

    text-decoration: none;

}



/*dropzone*/

.dropzone {

    border:1px dashed #ccc !important;

}

.dropzone.dz-drag-hover{

    background-color: rgba(0,0,0,0.02);

}

.dropzone .dz-image{

    background: #eee ;

    border-radius: 2px !important;

}

.dz-started {

    padding: 0!important;

}

.upload-thumbnail-sm{

    height: 80px;

    width: 80px;

    border: none !important;

    background: url('../images/filepreview.jpg') #eee no-repeat center center;

    outline: none;

}

.upload-progress-sm{

    height: 80px;

    width: 80px;

    height: 10px;

    border-radius: 0px;

}

#pre-loader{

    position: fixed;

    width: 100%;

    height: 100%;

    background-color: #e5e9ec;

    z-index: 11000;

}





/*loader*/

.circle-loader {

    margin:10px auto;

    width: 80px;

    height: 80px;

    border-radius: 40px;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    border: solid 2px var(--promed-color);

    border-top-color: #25ccce;

    animation: spin 1s infinite linear;

    -webkit-animation: spin 1s infinite linear;

}

.app-loader {

    width: 70px;

    height: 70px;

    margin:30px auto;

    position:absolute;

    bottom: 10px;

    right: 20px;

    padding: 10px;

    border-radius: 50%;

    background: rgba(250, 250, 255, 0.6);

}

.app-loader .loading,

.table-loader .loading{

    width: 50px;

    height: 50px;

    border-radius:50%;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

    border: solid 2px var(--promed-color);

    border-top-color: #fff;

    animation: spin 1s infinite linear;

    -webkit-animation: spin 1s infinite linear;

    display: inline-block;

}

.form-group .app-loader{

    margin: -12px auto;

    width: 50px;

    height: 50px;

    left: 45%;

}

.form-group .app-loader .loading{

    width: 30px;

    height: 30px;

}

#pre-loader .app-loader{

    bottom: 50%;

    right: 53%;

}



.ani-width {

    transition:  width 50ms;

}



.ani-rotate-180:hover {

    transform: rotate(180deg); 

    transition:  all 300ms ease-out 0ms;

}



@keyframes spin {

    100% { transform: rotate(360deg); }

}



@-webkit-keyframes spin { 

    100% { 

        -webkit-transform: rotate(360deg); 

    } 

} 



.inline-loader{

    background-image: url('../images/loader.gif');

    background-repeat: no-repeat;

    background-position: center center;

    color: transparent !important;

    transition: none;

}

.inline-loader:hover{

    color: transparent !important;

}



/*post dropzone*/

.post-dropzone{

    background: #fff;

}

.post-dropzone.dz-drag-hover{

    border: 1px dashed #337ab7;

}

.post-dropzone.dz-drag-hover *{

    opacity: 0.2;

}

.post-dropzone .preview:hover img{

    opacity: 0.2;

}

.post-dropzone .delete{

    width: 24px;

    height: 33px;

    margin-left: -27px;

    font-size: 25px;

    cursor: pointer;

    color: #fff;

    position: relative;

    opacity: 0.8;

    display: inline-block;

    margin-top: -23px;

    text-align: center;

    line-height: 31px;

}

.post-dropzone .preview:hover img{

    opacity: 0.5;

}

.post-dropzone .preview:hover .delete{

    opacity: 1;

    background-color:#000;

}



/*note*/



.notepad{

    position:relative;

    background:-webkit-linear-gradient(top,#f0f0f0 0%,white 5%) 0 0;

    background:-moz-linear-gradient(top,#f0f0f0 0%,white 5%) 0 0;

    background:linear-gradient(top,#f0f0f0 0%,white 5%) 0 0;

    -webkit-background-size:100% 30px;

    -moz-background-size:100% 30px;

    -ms-background-size:100% 30px;

    background-size:100% 30px;

    font-size: 100%;

    line-height: 30px !important;

}

.notepad:before{

    content:'';

    position:absolute;

    width:0px;

    top:0;

    bottom:0;

}

.notepad textarea{

    border:none;

    background-color:transparent;

    height:100%;

    line-height:30px;

    min-height:200px;

    padding: 0 10px;

}

.notepad-title{

    border: none !important;

    border-radius: 0!important;

    padding-left: 7px;

    border-left: 5px solid #1ccacc !important;

}



.notepad .select2-choices{

    border-color:transparent;

}



/*details list*/

.details-list{

    list-style: none;

    margin: 0;

    padding: 0;

}

.details-list li{

    padding: 5px;

}

.details-list li span{

    display: inline-block;

    min-width: 120px;

}



/*label*/

.label.large{

    font-size: 85%;

    font-weight: normal;

}



.label-light{

    background-color: #dde6e9;

    color: #4E5E6A;

}

.label-success{

    background-color: #00b393;

    color: #fff;

}



/*.dropdown-menu*/

.dropdown-menu{

    border-radius: 2px;

    border: 1px solid rgba(0,0,0,.05)

}

.dropdown-user .dropdown-menu{

    margin-right: 15px;

}

.dropdown-menu>li>a{

    padding: 7px 20px;

    color:#7988A2;

}

.comment-dropdown, .reply-dropdown{

    position: absolute;

    right: 30px;

    display: none;

    margin-top: -20px;

}

.comment-container:hover .comment-dropdown{

    display: block;

}

.reply-container:hover .reply-dropdown{

    display: block;

}



.dropdown-left{

    left: auto;

    right: 0;

}





/*datepicker*/

.datepicker.dropdown-menu {

    border-radius: 2px;

    border: 1px solid #d3d8dc;

    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);

}

.datepicker table tr td,

.datepicker table tr th,

.datepicker table tr td span{

    border-radius: 0;

}



.week-view tr:hover .day:not(.active){

    background-color: #f2f4f6 !important;

}



.datepicker-custom-list{



}

.datepicker-custom-list .list-group-item{

    padding: 6px 15px;

    cursor: pointer !important;

    border: none !important;

}

.datepicker-custom-list .list-group-item:not(.active):hover{

    background-color: #f5f5f5;

}

.datepicker-custom-selector{

    background: #fff;

    border-color: #f2f4f6;

    color: #444;

}



/*timepicker*/

.bootstrap-timepicker-widget table td input{

    display: inline-block;

}



/*note-editor*/

.note-editor,

.note-editor .note-toolbar,

.note-editor .note-statusbar .note-resizebar,

.note-toolbar .btn

{

    border-color:#e2e7f1 !important;

}





.permission-list{

    margin: 0;

    padding: 0 15px;

}

.permission-list li{

    margin-bottom:  15px;

    border-bottom: 1px solid #eef6f9;

    list-style-type: none;

}

.permission-list> li:before {

    content: '\f084';

    font-family: 'FontAwesome';

    float: left;

    margin-left: -1.5em;

    color: #444 ;

}



.animated-clock {

    width: 45px;

    background: url('../images/clock.gif') no-repeat 50% 50%; 

}



.mCS-minimal-dark .mCSB_dragger .mCSB_dragger_bar{

    opacity: 0.5 !important;

}

.mCSB_outside+.mCS-minimal-dark.mCSB_scrollTools_vertical,

.mCSB_outside+.mCS-minimal.mCSB_scrollTools_vertical

{

    margin-right: -2px;

}

#sidebar .mCSB_2_scrollbar {

    margin-right: -6px;

}



/* magnificPopup */

.mfp-counter {

    top: 6px  !important;

    cursor: auto;

    right: 10px !important;

}

.mfp-bg{

    z-index: 1052 !important;

}

.mfp-wrap{

    z-index: 1053 !important;

}

.full-width-mfp-content{

    max-width: none !important;

}

/*crop-box*/

.crop-box {

    position: relative;

    height: 400px;

    width: 100%;

    background: #fff;

    overflow: hidden;

    background-repeat: no-repeat;

    background-position: center;

    cursor:move;

}

.crop-box .thumb-box{

    position: absolute;

    top: 50%;

    left: 50%;

    width: 200px;

    height: 200px;

    margin-top: -100px;

    margin-left: -100px;

    box-sizing: border-box;

    box-shadow: 0 0 0 1000px rgba(0, 0, 0, 0.5);

    background: none repeat scroll 0% 0% transparent;

}



.crop-box .spinner {

    position: absolute;

    top: 0;

    left: 0;

    bottom: 0;

    right: 0;

    text-align: center;

    line-height: 400px;

    background: rgba(0,0,0,0.7);

}



/*timeline*/

#timeline {

    list-style:none;

    width:100%;

    min-height: 100%;

    margin:0 auto;

    position: relative;

    overflow:hidden;

}



#timeline:before {

    background: #f2f4f6;

    content: "";

    height: 100%;

    left: 50%;

    position: absolute;

    z-index: 0;

    top: 0;

    margin-left: -5px;

    width: 10px;

    border-radius: 5px;



}

#timeline .post-content {

    display:block;

    width:50%;

    position:relative;

    padding-top:40px;

}

#timeline   .post-content:nth-child(odd) {

    float:left;

    clear:left;

    padding-right:20px;

}

#timeline .post-content:nth-child(even) {

    float:right;

    clear:right;

    padding-left:20px;

}

#timeline .post-content:nth-child(2n) {

    margin-top:10px;

}

#timeline  .post-content>.post> .media{

    background:#fff;

    padding: 15px;

}

#timeline  .post-content .media{

    background:#fff; 

}



#timeline .post-content .post-date span{

    background:#00b393; 

    color:#fff;

    padding: 3px 10px 5px;

    border-radius: 25px;

}

#timeline  .post-content .post-date:before{

    background:#f2f4f6;

    content: "";

    left: -20px;

    top:10px;

    position: relative;

    width: 20px;

    height: 2px;  

}



#timeline  .post-content:nth-child(odd) .post-date {

    text-align: right;

}

#timeline  .post-content:nth-child(odd) .post-date:before{

    background:#f2f4f6;

    content: "";

    margin-right: -40px;

    top:10px;

    position: relative;

    width: 20px;

    height: 2px; 

    float: right;

}



.media p, .media div {

    word-break: break-all;

    word-break: break-word;

    word-wrap: break-word;

    -webkit-hyphens: auto;

    -moz-hyphens: auto;

    hyphens: auto;

}



.comment-file p{

    max-width: 270px;

}



.timeline-images img{

    width:100%;

    -webkit-transition: all 500ms ease;

    -moz-transition: all 500ms ease;

    -o-transition: all 500ms ease;

    -ms-transition: all 500ms ease;

    transition: all 500ms ease;

}

.timeline-images img:hover{

    -webkit-filter: grayscale(100%);

}

.timeline-images span.more{

    padding: 5px 5px;

    background-color: #000;

    color: #fff;

    margin-top: 0px;

    position: absolute;

    margin-left: -80px;

    width: 80px;

    text-align: center;

    white-space: nowrap;

    overflow: hidden;

    text-overflow: ellipsis;

    border-left:5px solid #4cc5cd;

}



@media screen and (max-width: 1400px) {

    /* Timeline */

    #timeline:before {

        left: 0px;

        margin-left: 0;

        margin-top: 45px;

    }

    #timeline  .post-content {

        float:left;

        width:100%;

        padding:0 0 0 30px !important;

        margin:0 0 20px !important;

    }

    #timeline > .post-content:first-child {

        padding-top: 60px !important;

    }



    #timeline  .post-content:nth-child(odd) .post-date {

        text-align: left;

    }

    #timeline  .post-content:nth-child(odd) .post-date:before{

        left: -20px;

        top:8px;

        width: 20px;

        height: 2px;  

        float:left;

    }

}



.comment-image-box{

    width: 400px;

}



/* fs modal*/

.app-modal{

    position: absolute;

    top:0;

    left:0;

    width: 100%;

    height: 100%;

    background-color: rgba(0,0,0, 0.9);

    z-index: 5000;   

    animation: slidedown 300ms;

    -webkit-animation: slidedown 300ms;

}

.app-modal-fixed-close-button {

    position: absolute;

    z-index: 1;

    right: 20px;

    background: #fff;

}



@keyframes slidedown {

    from {top: -100%;}

    to {top: 0;}

}



@-webkit-keyframes slidedown { 

    from {top: -100%;}

    to {top: 0;}

} 

.app-modal-body{

    margin:1% 1% 2%;

    width: 98%;

    height: 97%;

    background-color: #fff;

    display: table;

    table-layout: fixed;

    border-spacing: 0;

}

.app-modal-close{

    font-size: 20px;

    text-align: right;

    padding: 0 7px;

    cursor: pointer;

}

.app-modal-content{

    display: table-cell;

    vertical-align: central;

    height: 100%;

    text-align: center;

}

.app-modal-sidebar{

    width: 350px;

    border-left: 1px solid #f2f2f2;

    height: 100%;

    display: table-cell;

    vertical-align: top;

}

.app-modal-content .app-modal-content-area{

    position: relative;

}



.app-modal-content img{

    max-width: 100%;

    max-height: 100%;

}



.app-modal.full-content .app-modal-sidebar{

    display: none;

}



.app-modal .compress, 

.app-modal .expand{

    position: absolute;

    right: 20px;

    top: 20px;

    cursor: pointer;

    padding: 10px;

    color: #000;

    z-index: 1;

    background-color: rgba(255,255,255,0.5)

}



.app-modal .compress:hover, 

.app-modal .expand:hover{

    background-color: rgba(0,0,0,0.2);

}



.app-modal .compress{

    display: none;

}



.app-modal.full-content .expand{

    display: none;

}

.app-modal.full-content .compress{

    display: block;

}

.app-modal .expand{

    display: block;

    right: 370px !important;

}



.app-modal.loading .app-modal-sidebar{

    border-color: #fff;

}

.app-modal.loading .expand{

    display:  none;

}



/* milestone */

.milestone{

    width: 100px;

    text-align: center;

    border:1px solid #dde6e9; 

    padding-bottom: 5px;

}

.milestone .label{

    width: 100%;

    display: inherit;

    padding: 10px 0;

    font-size: 13px;

    border-radius: 0

}

.milestone h1{

    margin: 0;

}



/*flot*/

.flotTip {

    padding: 5px;

    background-color: rgba(0,0,0,0.6);

    color: #fff;

}

.legendColorBox{

    padding: 5px;

}

.legendColorBox > div{

    border: none !important;

}



/*sticky note*/

.sticky-note{

    outline: none;  height: 267px; padding: 5px;

    border: none;

    color: #000;

    font-size: 110%;

    background: rgb(255, 246, 179);

    width: 100%;

}



/*notification*/

.list-group-item{

    border: 1px solid rgba(221, 221, 221, 0.41) !important;

}

.unread-notification{

    background-color:#edeff5 !important;



}



/*estimate form*/

#estimate-form-editable .sortable-ghost td {

    border-top: 2px dashed #7988a2 !important;

    border-bottom: 2px dashed #7988a2 !important;

}

#estimate-form-editable .sortable-ghost td *{

    opacity: 0;

}

#estimate-form-preview table.dataTable.b-b-only tbody td {

    border: none;

}



::-webkit-scrollbar {

    width: 8px;

}



::-webkit-scrollbar-thumb {

    background: rgba(0,0,0,0.1);

}



::-webkit-scrollbar-track {

    background: rgba(0,0,0,0.1);

}



.star-btn{

    padding: 5px 10px;

    cursor: pointer;

    font-size: 16px;

    color: #F9A52D;

}

.starred-icon{



    font-size: 14px;

}

.list-container .b-b:last-child{

    border-bottom:none; 

}











@media (max-width: 767px){

    /*mobile view menu*/

    #sidebar, #sidebar.collapsed{

        opacity: 0;

        width:0px;

    }



    .off-screen #sidebar,

    .off-screen #sidebar.collapsed{

        padding-top: 7px !important;

        display:table-cell;

        width: 75%;

        opacity: 1;

    }

    .off-screen #page-container{

        display: inline-table;

    }



    .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse{

        max-height: none !important;

    }



    .signin-box{

        width: 90%;

    }

    .box-content.avatar{

        display: none;

    }

    #page-content{

        padding: 10px !important;

    }

    .message-buttons .btn{

        margin-bottom: 10px;

    }

    .modal-body{

        padding: 0;    

    }

    .modal-footer{

        padding: 15px;

    }

    #help-left-panel{

        min-height: 0;

    }



    .message-button-list{

        width: 98%;

    }

    .message-button-list,

    .message-view{

        display: block;

    }



}



@media screen and (max-width: 300px) {

    .navbar-brand {

        width: 160px;

    }

    .navbar-brand img{

        max-width: 160px;

    }





    #notificaion-popup-list{

        max-height: 400px; 

        overflow-y: scroll;

    }







}





/*Now the CSS*/

/** {margin: 0; padding: 0;}*/



.otree ul {

    padding-top: 20px; position: relative;

    

    transition: all 0.5s;

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

}



.otree li {

    float: left; text-align: center;

    list-style-type: none;

    position: relative;

    padding: 20px 5px 0 5px;

    

    transition: all 0.5s;

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

}



/*We will use ::before and ::after to draw the connectors*/



.otree li::before, .otree li::after{

    content: '';

    position: absolute; top: 0; right: 50%;

    border-top: 1px solid #ccc;

    width: 50%; height: 20px;

}

.otree li::after{

    right: auto; left: 50%;

    border-left: 1px solid #ccc;

}



/*We need to remove left-right connectors from elements without 

any siblings*/

.otree li:only-child::after, .otree li:only-child::before {

    display: none;

}



/*Remove space from the top of single children*/

.otree li:only-child{ padding-top: 0;}



/*Remove left connector from first child and 

right connector from last child*/

.otree li:first-child::before, .otree li:last-child::after{

    border: 0 none;

}

/*Adding back the vertical connector to the last nodes*/

.otree li:last-child::before{

    border-right: 1px solid #ccc;

    border-radius: 0 5px 0 0;

    -webkit-border-radius: 0 5px 0 0;

    -moz-border-radius: 0 5px 0 0;

}

.otree li:first-child::after{

    border-radius: 5px 0 0 0;

    -webkit-border-radius: 5px 0 0 0;

    -moz-border-radius: 5px 0 0 0;

}



/*Time to add downward connectors from parents*/

.otree ul ul::before{

    content: '';

    position: absolute; top: 0; left: 50%;

    border-left: 1px solid #ccc;

    width: 0; height: 20px;

}



.otree li a{

    border: 1px solid #ccc;

    padding: 5px 10px;

    text-decoration: none;

    color: #666;

    font-family: arial, verdana, tahoma;

    font-size: 11px;

    display: inline-block;

    

    border-radius: 5px;

    -webkit-border-radius: 5px;

    -moz-border-radius: 5px;

    

    transition: all 0.5s;

    -webkit-transition: all 0.5s;

    -moz-transition: all 0.5s;

}



/*Time for some hover effects*/

/*We will apply the hover effect the the lineage of the element also*/

.otree li a:hover, .otree li a:hover+ul li a {

    background: #c8e4f8; color: #000; border: 1px solid #94a0b4;

}

/*Connector styles on hover*/

.otree li a:hover+ul li::after, 

.otree li a:hover+ul li::before, 

.otree li a:hover+ul::before, 

.otree li a:hover+ul ul::before{

    border-color:  #94a0b4;

}



/*Thats all. I hope you enjoyed it.

Thanks :)*/



.ms-container{

    margin-left:10px;

}

.ms-container ul {

    float:left;

    margin-left:20px;

    width:95%;

}      

.ms-container ul li{

    color:#333;

    padding:5px 0px 5px 10px;

    margin:0px;

    width:95%;

    float:left;

    list-style:url(../images/blockcontentbullets.png) !important;

}

    

.ms-container a{    

    color:#333;

}



.ms-container a:hover{

    color:#29A8F1;

    text-decoration:underline;

}



//

// Breadcrumbs

// --------------------------------------------------

/* ProMed Form Modification */



.select2 .select2-selection--single .select2-selection__rendered {

    color: var(--promed-color); 

    line-height: 1.8rem;

    height: 36px;

 }

 .air__menu--white .air__menuLeft__link {

    color: var(--promed-color);

}



.air__menuLeft__container > .air__menuLeft__list >.air__menuLeft__item--active > .air__menuLeft__link {

    background: var(--promed-color);

    color: #fff;

    border-left: 4px solid transparent;

    border-left-color:white;

}

 .air__menuLeft__link {

    color: white;

}

.air__utils__content {

    padding: 15px;

}



.table {

    color: var(--promed-color);

    font-weight: 200px;

}

body {

    font-size: 14px;

    line-height: 1.42857143;

    font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif;;

    color: var(--promed-color);

    overflow-x: hidden;

    position: relative;

}

select.form-control {

    color: var(--promed-color);

}



.air__layout--grayBackground {

    background: var(--promed-back-color);

    /*background: white;*/

}



input[placeholder], [placeholder], *[placeholder] {

    color: var(--promed-color) !important;

}



.text-muted {

    color: var(--promed-color) !important;

    opacity:60%;

}



.nav-tabs-line .nav-link.active {

    border-color: transparent;

    position: relative;

    color: var(--promed-color);

    font-weight: bold;

}







.dropdown .dropdown-menu .dropdown-item, .btn-group .dropdown-menu .dropdown-item {

    color: var(--promed-color);

}

.select2.select2-container--focus .select2-selection {

    border-color: var(--promed-color);

}

.select2-container--default .select2-selection--single, .select2-selection .select2-selection--single {

    border: 1px solid var(--promed-light-color);

    color: var(--promed-color);

}

.select2.select2-container--open .select2-selection {

    border-color:var(--promed-color);

    border-bottom-color: var(--promed-color);

}

.select2 .select2-selection--single .select2-selection__rendered {

    /*border: 1px solid var(--promed-light-color);*/

    color: var(--promed-color);

}

h1, h2, h3, h4, h5, h6 {

    color: var(--promed-color);

}



.air__menuLeft__user__role {

    color: white;

    font-size: 11px;

}



/*.air__menu--flyout .air__menuLeft__link:hover, .air__menu--compact .air__menuLeft__link:hover, .air__menu--toggled .air__menuLeft__link:hover, .air__menu--flyout .air__menuLeft__link:hover, .air__menuLeft__item--active > .air__menuLeft__link, .nav-tabs-line .nav-link.active:after, .nav-pills .nav-link.active, .nav-pills .show > .nav-link {

    background-color: var(--promed-left-select-color)!important;

}*/



.text-dark {

    color: var(--promed-color) !important;

}

.text-info {

    color: var(--promed-color) !important;

}



.air__menuLeft__link {

    font-size: 1.03rem;

}



.air__sidebar__select__item--black:after {

    background: var(--promed-color);

}



.air__menuFlyout .air__menuLeft__item--active .air__menuLeft__link {

    background: var(--promed-color);

}



.air__menuFlyout .air__menuLeft__link:hover {

    background: var(--promed-color);

}

.air__menuFlyout{

    background: var(--promed-left-back-color);

}

.air__menuLeft__submenu > .air__menuLeft__link:before, .air__menuLeft__submenu > .air__menuLeft__link:after {

    background: white;

}

.air__menuLeft__toggleButton span:before, .air__menuLeft__toggleButton span:after {

    background: white;

 }



.form-control::-webkit-input-placeholder {

  color: var(--promed-color) !important;

  opacity: 40%;

}



.form-control::-moz-placeholder {

  color: var(--promed-color) !important;

  opacity: 40%;

}



.form-control:-ms-input-placeholder {

  color: var(--promed-color) !important;

  opacity: 40%;

}





.form-control::placeholder {

  color: var(--promed-color) !important;

  opacity: 40%;

}





.form-control {

    font-family: "Source Sans Pro", sans-serif;

    color: var(--promed-color) !important;

    font-size: 14px !important;

}



.air_topbar{

    background-color: white;

    box-shadow: 0 2px 2px rgb(0 0 0 / 5%), 0 1px 0 rgb(0 0 0 / 5%);

    border-bottom: 0;

}

.air__utils__header{

    background-color: white;

    /*box-shadow: 0 2px 2px rgb(0 0 0 / 5%), 0 1px 0 rgb(0 0 0 / 5%);*/

    border-bottom: 1;

}

.air__menuLeft{

    /*box-shadow: 0 2px 2px rgb(0 0 0 / 5%), 0 1px 0 rgb(0 0 0 / 5%);*/

    background:var(--promed-left-back-color);

    

}

.air__topbar a {

    color:var(--promed-left-back-color);

}

.select2-container .select2-selection--single .select2-selection__rendered {

    margin-top: -8px;

}



.card {

    border-radius: 0px;

    /*box-shadow: 0 0.5mm 2mm rgb(0 0 0 / 30%);*/

}

.air__utils__content > .card {

    border-radius: 0px;

    /*box-shadow: 0 0.5mm 2mm rgb(0 0 0 / 30%);*/

}

.air__utils__content > .container-full .card {

    border-radius: 0px;

    /*box-shadow: 0 0.5mm 2mm rgb(0 0 0 / 30%);*/

}

.col-md-12 > .box {

    border-radius: 0px;

    box-shadow: 0 0mm 0mm rgb(0 0 0 / 30%);

}

.air__utils__content > .col-12 {

    padding-left: 0;

    padding-right: 0;

    padding-top: 0px;

    border-radius: 0px;

    /*box-shadow: 0 0.5mm 2mm rgb(0 0 0 / 30%);*/

}



.air__utils__content > .col-lg-12 {

    padding-left: 0;

    padding-right: 0;

    border-radius: 0px;

    box-shadow: 0 0.0mm 0mm rgb(0 0 0 / 30%);*/

}



.air__utils__content > .col-lg-11 {

    padding-left: 0;

    padding-right: 0;

    border-radius: 0px;

    box-shadow: 0 0.0mm 0mm rgb(0 0 0 / 30%);*/

}

.air__utils__content > .container-full > .col-12{

    padding-left: 0;

    padding-right: 0;

    border-radius: 0px;

   /* box-shadow: 0 0.5mm 2mm rgb(0 0 0 / 30%);*/

}



.content-header > .breadcrumb > li + li:before {

    content: '>\00a0';

}

.content-header > .breadcrumb > li > a {

    padding-right: 10px;

    padding-left: 10px;

}

.air__utils__content{

    padding-top: 0px;

}

.air__subbar{

    margin-bottom: 20px;

}

.container-full > .col-12 > form >  .box {

    border-radius: 3px;

    box-shadow: 0 0.0mm 0mm rgba(0,0,0,.3); */

}



.air__menuLeft__logo img {

    box-shadow: 0 0.5mm 2mm rgb(0 0 0 / 30%);

}

#clocktimer{

    color:white;

}



.dropdown .dropdown-menu .dropdown-item:hover, .dropdown .dropdown-menu .dropdown-item:active, .dropdown .dropdown-menu .dropdown-item:focus,

.btn-group .dropdown-menu .dropdown-item:hover,

.btn-group .dropdown-menu .dropdown-item:active,

.btn-group .dropdown-menu .dropdown-item:focus {

    background: none;

    color: var(--promed-select-color);

}



.item-action > a > i{

    font-weight: bold;

    font-size:18px;

}

.tooth{
width: 55px;
height:55px;
background: white;
position: absolute;
background-size: contain;
background-repeat: no-repeat;
}
.tooth-top{
width: 55px;
height:55px;
background: transparent;
position: absolute;
}
.tooth.big.current{
background: white;
position: absolute;
background-image: url("../dentalimg/tooth-big-current.png");
background-size: contain;
background-repeat: no-repeat;
}
.tooth.big.proposed{
background: white;
position: absolute;
background-image: url("../dentalimg/tooth-big-proposed.png");
background-size: contain;
background-repeat: no-repeat;
}
.tooth.small.current{
background: white;
position: absolute;
background-image: url("../dentalimg/tooth-small-current.png");
background-size: contain;
background-repeat: no-repeat;
}
.tooth.small.proposed{
background: white;
position: absolute;
background-image: url("../dentalimg/tooth-small-proposed.png");
background-size: contain;
background-repeat: no-repeat;
}
.work{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 180;
}
.discoloration{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 270;
}
.mobility{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 360;
}
.nonvital{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 450;
}
.impacted{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 540;
}
.bleeding{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 630;
}
.cavity{
width: 55px;
height:55px; 
background-size: contain;
background-repeat: no-repeat;
position: absolute;
z-index: 720;
}
.material-switch > input[type="checkbox"] {
display: none; 
}

.material-switch > label {
cursor: pointer;
height: 0px;
position: relative; 
width: 40px; 
}

.material-switch > label::before {
background: rgb(0, 0, 0);
box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
border-radius: 8px;
content: '';
height: 16px;
margin-top: -8px;
position:absolute;
opacity: 0.3;
transition: all 0.4s ease-in-out;
width: 40px;
}
.material-switch > label::after {
background: rgb(255, 255, 255);
border-radius: 16px;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
content: '';
height: 24px;
left: -4px;
margin-top: -8px;
position: absolute;
top: -4px;
transition: all 0.3s ease-in-out;
width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label::before {
background: inherit;
opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label::after {
background: inherit;
left: 20px;
}
#proclination_radio .notActive{
color: #3276b1;
background-color: #fff;
}