/* Dental chart */
.icon {
    font: 12px/125% "courier new",courier,monospace;
}

.dental_chart_table_outside {

    /*border: 1px solid #dedcd0;*/
    /*padding: 0px 30px 0px 30px;*/
    /*width: 806px;*/
    margin-left:0px;
    margin-right:auto;
}

.dental_chart_table {
    border-collapse: collapse;
    margin-left:auto;
    margin-right:auto;
}

.dental_chart_table acronym {
    font-size: 11px
}

.dental_chart_table td {
    width: 45px;
    height: 25px;
}

.dental_chart_table.advanced_view td {
    height: 10px;
}

.dental_chart_table.simple_square_view td {
    border: 1px solid #000000;
}

.dental_chart_table.advanced_view td,
.dental_chart_table.simple_round_view td {
    padding-right: 1px;
}

.dental_chart_table.simple_square_view td.tooth {
    background: url(/~dentalc/images/tooth_bg.gif);
}

.dental_chart_table.simple_square_view td.tooth2 {
    background: url(/~dentalc/images/tooth2_bg.gif);
}

.dental_chart_table td.spacing {
    border: 0;
    background: 0;
}

.dental_chart_table td.spacing_top {
    border: 0;
    border-bottom:2px solid #FF0000;
    background: 0;
    height: 12px;
}

.dental_chart_table td.spacing_bottom {
    border: 0;
    border-top:2px solid #FF0000;
    background: 0;
    height: 12px;
}

.dental_chart_table td.mid-left {
    border-right: 2px solid #FF0000;
}

.dental_chart_table td.mid-right {
    border-left: 2px solid #FF0000;
}

.dental_chart_table.advanced_view .real_teeth .mid-left {
    padding-right: 2px;
}

.dental_chart_table.advanced_view .real_teeth .mid-right {
    padding-left: 3px;
}

.dental_chart_table.advanced_view td.mid-right,
.dental_chart_table.simple_round_view td.mid-right {
    padding-left: 1px;
}

.dental_chart_table tr.numbers td {
    border: 0;
    text-align: center;
    background: 0;
}

.dental_chart_table td.tooth .tooth_procedure_thumb_top {
    width: 45px;
    height: 10px;
}

.dental_chart_table td.tooth .tooth_procedure_thumb_left {
    width: 10px;
    height: 45px;
    margin-top: -10px;
    float:left;
}

.dental_chart_table td.tooth .tooth_procedure_thumb_center {
    width: 25px;
    height: 25px;
    float:left;
}

.dental_chart_table td.tooth .tooth_procedure_thumb_right {
    width: 10px;
    height: 45px;
    margin-left: 35px;
    margin-top: -45px;
    float:right;
}

.dental_chart_table td.tooth .tooth_procedure_thumb_bottom {
    width: 45px;
    height: 10px;
    margin-top: -10px;
    float:right;
}

.dental_chart_table td.tooth2 .tooth_procedure_thumb_top {
    width: 45px;
    height: 17px;
}

.dental_chart_table td.tooth2 .tooth_procedure_thumb_left {
    width: 10px;
    height: 45px;
    margin-top: -17px;
    float:left;
}

.dental_chart_table td.tooth2 .tooth_procedure_thumb_center {
    width: 25px;
    height: 11px;
    float:left;
}

.dental_chart_table td.tooth2 .tooth_procedure_thumb_right {
    width: 10px;
    height: 45px;
    margin-left: 35px;
    margin-top: -45px;
    float:right;
}

.dental_chart_table td.tooth2 .tooth_procedure_thumb_bottom {
    width: 45px;
    height: 17px;
    float:right;
    margin-top: -17px;
}

/* Advanced chart */
.dental_chart_table .real_teeth img {
    padding: 0 1px 0 1px;
}

.dental_chart_table acronym {
    border: 0;
    cursor: help;
    text-decoration: none;
}

.field_options_new_row {
    margin-left: 11px;
}

/* Periodontal chart */
.gingival_margin_title {
    color: #FF6347;
}

.probing_dept_title {
    color: #009FE3;
}

.periodontal_inputs input {
    border: 1px dotted #DDDDDD;
    width: 12px !important;
    box-shadow: none;
    padding-left: 0;
    padding-right: 0;
    text-align: center;
/*    width: 15px;*/
}

.periodontic_chart_input.periodontic_gingival_margin
{
    border: 1px dotted #FF6347;
}

.periodontic_chart_input.periodontic_probing_depth
{
    border: 1px dotted #009FE3;
}

.dental_chart_table tr.periodontal_inputs td {
/*    border-right: 1px solid #CFCFCE;*/
    border-right: 1px solid #BBBBBB;
    padding: 0;
}

.dental_chart_table tr.periodontal_inputs td:last-child {
    border-right: 0 none;
}

/* Drag and drop statuses */
.status_drag_container ul {
    list-style-type: none;
}

.status_drag_container .group {
    width: 100%;
    clear: both;
}

.status_drag_container .group_to_toggle li {
    float: left;
}

.status_draggable_container {
/*    width: 217px;*/
    width: 108px;
/*    margin-bottom: 2px;*/
    float: left;
    z-index: 100;
}

.status_draggable_container_col1 {
    border-right: 1px solid #e2e2e2;
    border-bottom: 1px solid #e2e2e2;
}

.status_draggable_container_col2 {
    border-bottom: 1px solid #e2e2e2;
}

.status_draggable {
    cursor: move;
}

.noselect.status_draggable {
    cursor: move;
}

.drag_drop_surface_selection {
    cursor: default;
    position: absolute;
    width: 140px;
/*    height: 180px;*/
    background-color: #FFFFFF;
    box-shadow: 1px 1px 3px #333333;
    z-index: 10;
    padding: 5px;
    margin-top: 18px;
    margin-left: 22px;
}

.drag_drop_surface_selection_cancel {
    float: right;
}

.drag_drop_surface_selection_surface_options {
    cursor: default;
    position: absolute;
    width: 230px;
    margin-left: 130px;
    margin-top: -55px;
    background-color: #FFFFFF;
    box-shadow: 1px 1px 3px #333333;
    z-index: 10;
    padding: 5px;
}

.drag_drop_surface_selection_surface_options::before {
    border-color: transparent #DADADA;
    border-style: solid;
    border-width: 14px 14px 14px 0;
    content: "";
    display: block;
    left: -14px;
    position: absolute;
    top: 49px;
    width: 0;
    z-index: 1;
}

.drag_drop_surface_selection_surface_options::after {
    border-color: transparent #FFFFFF;
    border-style: solid;
    border-width: 12px 13px 12px 0;
    content: "";
    display: block;
    left: -13px;
    position: absolute;
    top: 51px;
    width: 0;
    z-index: 1;
}


/* Maintenance */
.maintenance_table_add_edit {
    background-color: #F1EEDF;
    border: 1px solid #E4DEC1;
    padding: 0px 3px 0px 3px;
}

.maintenance_table_add_edit2 {
    width: 110px;
    background-color: #F1EEDF;
    border: 1px solid #E4DEC1;
    padding: 0px 3px 0px 3px;
    text-align: center;
}

.maintenance_table_add_edit3 {
    text-align: center;
}

.maintenance_procedures_step4 {
    display: none;
}

.maintenance_materials_step4 {
    display: none;
}

#cat2 optgroup, #cat3 optgroup, #cat4 optgroup {
    font-weight: normal;
    color: #999999;
}

.maintenance_items_already_exist {
    font-style: normal;
}

#total_string {
    font-weight: bold;
}

/* Footer */
#footer
{
    text-align:center;
    font-size:10px;
}

#footer a{
    color: #333333;
    font-size:10px;
}

#footer a:hover{
    color: #333333;
}

/* Auto select styling*/
.autocomplete-w1 { /*background:url(img/shadow.png) no-repeat bottom right;*/ position:absolute; top:0px; left:0px; margin:6px 0 0 6px; /* IE6 fix: */ _background:none; _margin:1px 0 0 0; }
.autocomplete { border:1px solid #999; background:#FFF; cursor:default; text-align:left; max-height:350px; overflow:scroll; overflow-x: auto; overflow-y: scroll; margin:-6px 6px 6px -6px; /* IE6 specific: */ _height:350px;  _margin:0; _overflow-x:hidden; }
.autocomplete .selected { background:#F0F0F0; }
.autocomplete div { padding:2px 5px; white-space:nowrap; overflow:hidden; }
.autocomplete strong { font-weight:normal; color:#3399FF; }

/* Expand collpase list */
.expand_collapse_list .group {
    border: 1px solid #999999;
    overflow: hidden;
    margin-bottom: 3px;
}

.group_toggle.table_header {
    border-width: 0 0 1px 0;
    padding: 0 10px 0 10px;
}

.expand_collapse_list .group_toggle {
    cursor: pointer;
    height: 40px;
    line-height: 40px;
}

.expand_collapse_list .group_toggle .group_toggle_icon {
    float: left;
    margin-top: 12px;
    margin-right: 5px;
}

.expand_collapse_list .group_toggle .group_toggle_text {
    float: right;
    font-size: 10px;
    font-weight: normal;
}

.expand_collapse_list .group_toggle .group_toggle_text span {
    font-size: 10px;
    font-weight: normal;
}

.expand_collapse_list .group .group_toggle .group_toggle_icon .collapse,
.expand_collapse_list .group .group_toggle .group_toggle_title .collapse {
    display: none;
}

.expand_collapse_list .group_expanded .group_toggle .group_toggle_icon .collapse,
.expand_collapse_list .group_expanded .group_toggle .group_toggle_title .collapse {
    display: inline;
}

.expand_collapse_list .group_expanded .group_toggle .group_toggle_icon .expand,
.expand_collapse_list .group_expanded .group_toggle .group_toggle_title .expand {
    display: none;
}

.expand_collapse_list .group_to_toggle {
    width: 100%;
}


/* ============================================================================================================================
== BUBBLE WITH A BORDER AND TRIANGLE
** ============================================================================================================================ */

/* THE SPEECH BUBBLE
------------------------------------------------------------------------------------------------------------------------------- */

.triangle-border {
  position:relative;
  padding:12px;
  margin:1em 0 3em;
  border:2px solid #038CBF;
  color:#333;
  background:#fff;
  /* css3 */
  -webkit-border-radius:10px;
  -moz-border-radius:10px;
  border-radius:10px;
}

/* Variant : for left positioned triangle
------------------------------------------ */

.triangle-border.left {
  margin-left:30px;
}

/* Variant : for right positioned triangle
------------------------------------------ */

.triangle-border.right {
  margin-right:30px;
}

/* THE TRIANGLE
------------------------------------------------------------------------------------------------------------------------------- */

.triangle-border:before {
  content:"";
  position:absolute;
  bottom:-20px; /* value = - border-top-width - border-bottom-width */
  left:40px; /* controls horizontal position */
  border-width:20px 20px 0;
  border-style:solid;
  border-color:#038CBF transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

/* creates the smaller  triangle */
.triangle-border:after {
  content:"";
  position:absolute;
  bottom:-13px; /* value = - border-top-width - border-bottom-width */
  left:47px; /* value = (:before left) + (:before border-left) - (:after border-left) */
  border-width:13px 13px 0;
  border-style:solid;
  border-color:#fff transparent;
  /* reduce the damage in FF3.0 */
  display:block;
  width:0;
}

/* Variant : top
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.top:before {
  top:-20px; /* value = - border-top-width - border-bottom-width */
  bottom:auto;
  left:auto;
  right:40px; /* controls horizontal position */
  border-width:0 20px 20px;
}

/* creates the smaller  triangle */
.triangle-border.top:after {
  top:-13px; /* value = - border-top-width - border-bottom-width */
  bottom:auto;
  left:auto;
  right:47px; /* value = (:before right) + (:before border-right) - (:after border-right) */
  border-width:0 13px 13px;
}

/* Variant : left
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.left:before {
  top:13px; /* controls vertical position */
  bottom:auto;
  left:-25px; /* value = - border-left-width - border-right-width */
  border-width:12px 25px 12px 0;
  border-color:transparent #038CBF;
}

/* creates the smaller  triangle */
.triangle-border.left:after {
  top:16px; /* value = (:before top) + (:before border-top) - (:after border-top) */
  bottom:auto;
  left:-21px; /* value = - border-left-width - border-right-width */
  border-width:9px 21px 9px 0;
  border-color:transparent #fff;
}

/* Variant : right
------------------------------------------ */

/* creates the larger triangle */
.triangle-border.right:before {
  top:10px; /* controls vertical position */
  bottom:auto;
  left:auto;
  right:-30px; /* value = - border-left-width - border-right-width */
  border-width:15px 0 15px 30px;
  border-color:transparent #038CBF;
}

/* creates the smaller  triangle */
.triangle-border.right:after {
  top:16px; /* value = (:before top) + (:before border-top) - (:after border-top) */
  bottom:auto;
  left:auto;
  right:-21px; /* value = - border-left-width - border-right-width */
  border-width:9px 0 9px 21px;
  border-color:transparent #fff;
}

/* Misc */
.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;
}

input::-webkit-contacts-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
    position: absolute;
    right: 0;
}