.adjustLogin {
    background: none repeat scroll 0 0 #456B8C;
    border: 2px solid #416585;
    box-shadow: 0 6px 41px 10px #416585;
    font-weight: normal;
    margin-left: 8px;
    padding: 26px 24px 46px;
    width: 352px;
}
  .btn.red {
        color: #FFFFFF;
        background-color: #cb5a5e;
    }

    .btn.blue {
        color: #FFFFFF;
        background-color: #3598dc;
    }
#adjustLogin .modal-header {
    margin: -20px 0px 23px 0px;
    padding: 0px;
    border: 0px;
}

#div_Login .input {
    border: 1px solid #2C4459;
    box-shadow: 1px 1px 2px rgba(200, 200, 200, 0.2) inset;
    color: #555;
    font-size: 16px;
    font-weight: 200;
    line-height: 1;
    margin-bottom: 16px;
    margin-right: 6px;
    margin-top: 2px;
    outline: 0 none;
    padding: 3px 3px 3px 25px;
    width: 100%;
    height: 38px;
}

#login {
    margin: 0 auto;
    width: 370px;
}

h1.logo {
    margin: 60px 0 0 0;
}


#login .logo a {
    margin: auto;
}

#div_Login .input:focus {
    border: 1px solid #000;
}

#div_Login p {
    float: left;
}


#div_Login .remember {
    display: block;
    clear: both;
    width: 145px;
    margin: 0;
    padding: 0;
}

    #div_Login .remember label {
        float: left;
        margin: 0;
        padding: 0;
        width: 100px;
        color: #fff;
        font-weight: normal;
    }





#div_Login .forgot_pw {
    display: block;
    float: left;
    font-size: 12px;
    margin-left: 14px;
    padding: 4px;
    width: 116px;
    color: #fff;
}

    #div_Login .forgot_pw a:hover {
        color: #0088CC;
        text-decoration: underline;
    }

#div_Login #RememberMe {
    float: left;
    margin: 3px 3px 0 0;
    display: inline;
}




/* ----------------- New Classes ---------------------- */

.width300 {
    width: 300px !important;
}
.width-18-percentage {
    width: 18% !important;
}
.width-50-percentage {
    width: 50% !important;
}
/********************Common Backgrounds********************************/
.bg-gray {
    background-color: #F5F5F5;
}

.bg-light-gray {
    background-color: #Fcfcfc;
}

.bg-white {
    background-color: #ffffff;
}



/********************Font Sizes helper classes********************************/

.font-xxs {
    font-size: 9px !important;
}

.font-xs {
    font-size: 11px !important;
}

.font-sm {
    font-size: 12px !important;
}

.font-md {
    font-size: 14px !important;
}

.font-lg {
    font-size: 16px !important;
}

.font-xlg {
    font-size: 18px !important;
}

.font-xxlg {
    font-size: 22px !important;
}

.font-bold {
    font-weight: bold !important;
}


.font-normal {
    font-weight: normal !important;
}



/********************Font Sizes helper classes********************************/

.padding-top-0 {
    padding-top: 0px !important;
}
 .padding-bottom-0 {
    padding-bottom: 0px !important;
 }

/********************Labels Group *****************************************************/

.label-group {
    font-weight: normal;
    display: block;
    clear: both;
}

    .label-group label {
        border-bottom: 1px solid #f7f7f7;
        font-weight: normal;
        font-size: 12px;
    }

        .label-group label.key {
            font-weight: bold;
        }
/********************custom well-new help classes********************************/




.well-new {
    padding: 20px;
}

    .well-new.sm {
        padding: 10px;
    }

    .well-new.xs {
        padding: 5px;
    }

    .well-new.vertical {
        padding-left: 0px;
        padding-right: 0px;
    }

    .well-new.horizontal {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    
/********************custom padding help classes********************************/
.no-padding-left {
    padding-left: 0px !important;
}
.no-padding-right {
    padding-right: 0px !important;
}

.padding-t-10
{
    padding-top: 10px !important;
}

.padding5
{
    padding: 5px !important;
}
.padding-b-5
{
    padding: 5px !important;
}



.block_result {
    margin: 10px;
}

.patient_name {
    padding: 5px;
    margin: 0px 15px 15px 15px;
}

.box input, .box select {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

input[type="radio"], input[type="checkbox"] {
    height: auto;
}

/***************** Options list ********************/

ul.options-list.horizontal li {
    float: left;
    margin-right: 10px;
}

ul.options-list {
    list-style: none;
    margin-top: -5px;
}

    ul.options-list ul.options-list {
        margin-left: 20px;
    }

    ul.options-list li {
        cursor: pointer;
        border-bottom: 1px solid #F1F1F1;
    }

    ul.options-list label:hover {
        background-color: #EDEFF0;
        color: #808080;
    }

    ul.options-list li input {
        margin-bottom: 5px;
    }

    ul.options-list .selected label {
        background-color: #E6F0FB;
        color: gray;
    }

    ul.options-list .unselected label {
        background-color: #fff !important;
    }

    ul.options-list label {
        line-height: 15px;
        font-size: 13px;
        font-weight: bold;
        padding: 10px 10px;
        color: #808080;
        cursor: pointer;
        margin-bottom: 0px;
        display: block;
        min-height: 34px;
    }

    ul.options-list.sm label {
        line-height: 11px;
        font-size: 11px;
        padding: 5px 10px;
    }


    ul.options-list input[type="checkbox"], .multi-select-item input[type="radio"] {
        margin: 0;
    }

/***************** Options list ********************/

/******************** Control Panel Menu **********************/

ul.cp-menu {
    list-style: none;
}

.cp-menu li {
    float: left;
    height: 95px;
    padding: 10px;
    font-size: 15px;
    line-height: 1.4;
    text-align: center;
    border: 2px solid #FFF;
    background-color: #F9F9F9;
    color: #000000;
    width: 148px;
    cursor: pointer;
}

    .cp-menu li:hover {
        background-color: #487093;
        color: #ffffff;
    }


.cp-menu .glyphicon {
    margin-top: 5px;
    margin-bottom: 10px;
    font-size: 25px;
}

.cp-menu span.title {
    display: block;
    text-align: center;
    word-wrap: break-word;
}




/************************ Lay out classes***************************/

.box {
    margin: 20px;
    display: inline-table;
    margin-left: 0%;
    border: 1px solid rgb(238, 238, 238);
    padding-bottom: 35px;
    padding-top: 5px;
    padding-left: 20px;
    padding-right: 20px;
    width: 100%;
    color: gray;
    margin-bottom: 20px;
    min-height: 550px;
    height: 100%;
    display: inline-block;
}

/******** override bootstrap ****************/
.alert {
    padding: 3px 5px;
    -ms-border-radius: 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}

fieldset {
    margin-top: 10px;
}

.row.strip {
    margin-left: -21px;
    margin-right: -21px;
}

[data-href] {
    cursor: pointer;
}

.alert-warning {
    color: #C09853;
    background-color: #FCF8E3;
    border-color: #FAEBCC;
}

a:hover {
    text-decoration: none;
}



/******************Tree menu***********************/

.tree {
    min-height: 20px;
    padding: 19px;
}


    .tree li {
        list-style-type: none;
        margin: 0 0 0 30px;
        padding: 10px 5px 0 10px;
        position: relative;
    }

        .tree li::before, .tree li::after {
            content: '';
            left: -20px;
            position: absolute;
            right: auto;
        }


        .tree li::before {
            border-left: 1px solid #999;
            bottom: 50px;
            height: 100%;
            top: 0;
            width: 1px;
        }

        .tree li::after {
            border-top: 1px solid #999;
            height: 20px;
            top: 25px;
            width: 25px;
        }

        .tree li span {
            -moz-border-radius: 5px;
            -webkit-border-radius: 5px;
            border: 1px solid #999;
            border-radius: 5px;
            display: inline-block;
            padding: 3px 8px;
            text-decoration: none;
        }



        .tree li.selected span {
            background-color: #E6F0FB;
        }

        .tree li.parent_li > span {
            cursor: pointer;
        }

    .tree > ul > li::before, .tree > ul > li::after {
        border: 0;
    }

    .tree li:last-child::before {
        height: 26px;
    }

    .tree li.parent_li > span:hover, .tree li.parent_li > span:hover + ul li span {
        background: #eee;
        border: 1px solid #94a0b4;
        color: #000;
    }

    .tree li.root {
        margin-left: 0 !important;
    }

/*******Tree icons*/

/************ Control Panel Items****************/

ul.control-panel {
    list-style: none;
}

.control-panel li {
    padding: 10px;
    font-size: 18px;
    height: 95px;
    width: 215px;
    border: 2px solid #FFF;
    background-color: #F9F9F9;
    text-align: center;
    cursor: pointer;
    color: #585858;
}

    .control-panel li:hover {
        background-color: #487093;
        color: #ffffff;
    }

.control-panel .glyphicon {
    margin-top: 5px;
    margin-bottom: 10px;
    font-size: 25px;
}

.control-panel span.title {
    display: block;
    text-align: center;
    word-wrap: break-word;
}

/************ Control Panel Items END****************/

input:-webkit-autofill, textarea:-webkit-autofill {
    background-color: #fff !important;
}



/************ overriding bootstrap input-group :: adding xs size****************/

.input-group.xs .input-group-addon {
    height: 23px;
    padding: 3px;
}


    .input-group.xs .input-group-addon .glyphicon {
        font-size: 12px;
    }


.input-group.xs input {
    height: 23px;
}

input.input-xs {
    height: 25px;
    padding: 3px 6px;
}

select.input-xs {
    height: 25px;
    padding: 3px 6px;
}


/************ END****************/
.table.no-border td {
    border: none !important;
}


.smallcp-menu li {
    float: left;
    padding: 4px;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;
    border: 2px solid #FFF;
    background-color: #F9F9F9;
    /* color: #000000; */
    width: 92px;
    cursor: pointer;
    list-style: none;
}




/*.smallcp-menu
.glyphicon-print {
    font-size: 20px;
}*/

/*.label-group label.checkbox,
.label-group label.radio {
    border: none;
}*/








div.buttons-box input,
div.buttons-box a,
div.buttons-box button {
    height: 32px;
    min-width: 66px;
}





/***************** borders helper classes *********************/

.border-bottom {
    border-bottom: 1px solid #ddd !important;
}

.border-top {
    border-top: 1px solid #ddd !important;
}

.border-left {
    border-left: 1px solid #ddd !important;
}

.border-right {
    border-right: 1px solid #ddd !important;
}

.no-border {
    border: 0 !important;
}

.border-gray {
    border: 1px solid #ddd;
}

.borderwhite {
    border: 1px solid #fff;
}
/***************** END  *********************/




/***************** Treatment Plan notes helper classes *********************/


.relative {
    position: relative;
}

/*.bg-light-gray .tabbable  .active a{
    background: #FCFCFC;
}*/



/*********************Treatment plan :: appointment of today area*********/

.todayappointments_div {
    float: right;
    background: #DBDBDB;
    height: 100%;
    min-height: 100%;
    float: right;
    position: absolute;
    right: 0;
}


.appointments-list {
    position: absolute;
    right: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    height: 100%;
}


/* fontello icons */
.cp-menu [class^="icon-"]:before, .cp-menu [class*=" icon-"]:before {
    font-size: 31px;
    margin: 0.1em 0;
}


.list-tree ul.list-tree {
    margin-left: 25px;
}

.confirm {
    border-radius: 10px;
    margin: 0 5px 0 0;
    font-size: 10px;
    padding: 10px 2px 0px 2px;
    line-height: 17px;
    color: #000;
}


.notconfirm {
    border-radius: 20px;
    margin: 0 5px 0px 0;
    font-size: 9px;
    padding: 3px 0px 3px 2px;
    line-height: 17px;
    color: #000;
}


    .notconfirm span:before,
    .notconfirm span:after {
        font-size: 9px;
    }

.red-border {
    border-top: #D06428 1px solid !important;
    border-bottom: #D06428 1px solid !important;
}



/*SETTING PAGE */

.sidebar {
    position: fixed;
    top: 21px;
    bottom: 0;
    left: 0;
    z-index: 1000;
    display: block;
    padding: 20px;
    overflow-x: hidden;
    overflow-y: auto;
}

.nav-sidebar {
    margin-right: -21px;
    margin-bottom: 20px;
    margin-left: -20px;
}

.texttransform {
    text-transform: capitalize;
}

.showmsg {
}

.smsbody {
}

.scroll_popup {
    height: 305px;
    overflow-y: auto;
    overflow-x: hidden;
}

.disableinput {
    opacity: 0.5;
}

.table.table-inside {
    background: transparent;
}

.table-inside thead tr {
    border: none;
}


.report-info-box {
    margin-top: 10px;
}

    .report-info-box .glyphicon-info-sign {
        margin: 3px 3px 3px 0px;
        padding-right: 10px;
        float: left;
        font-size: 29px;
        color: rgb(255, 174, 0);
    }

    .report-info-box .alert-info {
        padding: 12px;
        margin-bottom: 18px;
        -ms-border-radius: 4px;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
        border: solid 1px #ECB02D;
        color: #151414;
        background-color: #FFE9B8;
    }

    .report-info-box p {
        font-size: 13px;
        padding-top: 5px;
        padding-left: 45px;
    }

.reminderCont .selectmultiple option {
    background: url("../../images/calender.jpg") no-repeat 5px 6px;
    background-size: 13px 12px;
    padding: 2px 23px;
}

#modalReLogin .modal-header {
    border-color: transparent;
}

    #modalReLogin .modal-header.ourlogo {
        background: url("../../images/ilogoblue.png") no-repeat scroll 40% 70% rgba(0, 0, 0, 0);
        height: 70px;
    }


    
    h1.logo.IshbilyahLogo,
    #modalReLogin .modal-header.IshbilyahLogo {
        background: url("../../images/IshbilyahLogo.png") no-repeat scroll center 10px rgba(0, 0, 0, 0);
        height: 87px;
    }

    h1.logo.IshbilyahLogo a {
        background: none !important;
    }
    #modalReLogin .modal-header .modal-title {
        font-size: 0px;
    }


.appointments-list .patient_name {
    margin: 5px 0;
}


.serious-diseases {
    background: #DB5C5C;
    padding: 3px 4px;
    text-transform: capitalize;
    box-shadow: 0px 0px 4px #C27D7D;
    border-radius: 4px;
    color: #F7F7F7;
}


.serious-diseases-tab {
    background: #DB5C5C;
    color: #F7F7F7;
}

.View_All_Links,.View_All_Admission {   
    font-size: 12px !important;
    margin-top: 5px !important;
    float: right !important;
    width: 25%;
    text-align: right;
}


/*=============================== Progress Note =================================*/

    .progressnote    .postion {
            position: absolute;
            z-index: 99;
            right: 2em;
        }

   .progressnote     .namedr {
            width: 80%;
        }

    .progressnote    .options-list.inday-list li {
            border-width: 20px;
            border-bottom: none !important;
            margin: 2px 0;
            /*  border-left: #4750AD 4px solid;   */
        }
     

     .progressnote   .status-done {
            border-left: #4DD0E1 20px solid;
            background: #E0F7FA;
            background: -webkit-linear-gradient(left, #E0F7FA, transparent, transparent); /* For Safari 5.1 to 6.0 */
            background: -o-linear-gradient(right, #E0F7FA, transparent, transparent); /* For Opera 11.1 to 12.0 */
            background: -moz-linear-gradient(right, #E0F7FA, transparent, transparent); /* For Firefox 3.6 to 15 */
            background: linear-gradient(to right, #E0F7FA, transparent, transparent); /* Standard syntax */
 
        }



     .progressnote   .status-in-progress {
            border-left: #81C784 20px solid;
            border-bottom: none !important;
            background: #E8F5E9;
            background: -webkit-linear-gradient(left, #E8F5E9, transparent, transparent); /* For Safari 5.1 to 6.0 */
            background: -o-linear-gradient(right, #E8F5E9, transparent, transparent); /* For Opera 11.1 to 12.0 */
            background: -moz-linear-gradient(right, #E8F5E9, transparent, transparent); /* For Firefox 3.6 to 15 */
            background: linear-gradient(to right, #E8F5E9, transparent, transparent); /* Standard syntax */
        }

    .progressnote    .status-pending {
            border-left: #FF8A65 20px solid;
            border-bottom: none !important;
            background: #FBE9E7;
            background: -webkit-linear-gradient(left, #FBE9E7, transparent, transparent); /* For Safari 5.1 to 6.0 */
            background: -o-linear-gradient(right, #FBE9E7, transparent, transparent); /* For Opera 11.1 to 12.0 */
            background: -moz-linear-gradient(right, #FBE9E7, transparent, transparent); /* For Firefox 3.6 to 15 */
            background: linear-gradient(to right, #FBE9E7, transparent, transparent); /* Standard syntax */
        }

   .progressnote     ul.options-list .listitem ul.options-list {
            margin-left: 0px;
        }


 .progressnote       .progress-notes-table tr {
            position: relative;
        }

@-moz-document url-prefix() {
    .left_width {
        float: left;
        /*margin-top: 110px;*/
        /* overflow: auto;*/
        position: absolute;
        top: 115px;
        width: 100%;
    }

    .height700 {
        height: 700px;
    }

    #pager {
        bottom: 0;
        position: absolute;
        width: 100%;
    }

   }


.progressnote-ed .postion {
    position: absolute;
    z-index: 99;
    right: 0em;
         }



.progressnote-ed .panel-body fieldset > div {
    position: relative;
    width: 100%;
}





ul.emenu {
        width: 100%;
        list-style: none;
          right: -111px;
        top: 12px;
         padding: 10px 0;
}

ul.emenu li  {
border-bottom: #F2EFEF solid 1px;
  cursor: pointer;
  width: 100%;
  float: left;
 height: 30px;
    margin-bottom: 0px;
}

ul.emenu li :last-child {
    border-bottom: 0px;
}

  


ul.emenu li .titileitm {
        width: 100%;
        height: 30px;
        padding: 5px 20px;
        width: 100%;
        display: table-cell;
        float: left;
    }


ul.emenu li .titileitm:hover {
  width: 100%;
  padding: 5px 20px;
  width: 100%;
  display: table-cell;
  float: left;
  height: 30px;
    background: #E4E4E4;
}



#ProcedureModal .modal-dialog .modal-content .modal-body  {

        height: 400px;     
        background: -webkit-linear-gradient(#ffffff #FCFCFC, #F9F7F7); /* For Safari 5.1 to 6.0 */
        background: -o-linear-gradient(#ffffff,#FCFCFC,  #F9F7F7); /* For Opera 11.1 to 12.0 */
        background: -moz-linear-gradient(#ffffff,#FCFCFC,  #F9F7F7); /* For Firefox 3.6 to 15 */
        background: linear-gradient(#ffffff,#FCFCFC,  #F9F7F7); /* Standard syntax */
}


#ProcedureModal #modal-footer{
    background: #F9F7F7;
}


/*custom font*/


html, body {min-height: 100%;}

 

.breadcrumb {
	/*centering*/
	display: inline-block;
	/* box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.35); */
	overflow: hidden;
	border-radius: 5px;
	/*Lets add the numbers for each link using CSS counters. flag is the name of the counter. to be defined using counter-reset in the parent element of the links*/
	counter-reset: flag;
    background: #fff;
    padding: 0px;
    margin: 0px;
}

.breadcrumb a {
	text-decoration: none;
	outline: none;
	display: block;
	float: left;
	font-size: 12px;
	line-height: 36px;
	color: white;
	/*need more margin on the left of links to accomodate the numbers*/
	padding: 0 20px 0 60px;
	background: #666;
	background: linear-gradient(#666, #333);
	position: relative;
}
/*since the first link does not have a triangle before it we can reduce the left padding to make it look consistent with other links*/
.breadcrumb a:first-child {
	padding-left: 46px;
	border-radius: 5px 0 0 5px; /*to match with the parent's radius*/
}
.breadcrumb a:first-child:before {
	left: 14px;
}
.breadcrumb a:last-child {
	border-radius: 0 5px 5px 0; /*this was to prevent glitches on hover*/
}

/*hover/active styles*/
.breadcrumb a.active, .breadcrumb a:hover{
	background: #333;
	background: linear-gradient(#333, #000);
}
.breadcrumb a.active:after, .breadcrumb a:hover:after {
	background: #333;
	background: linear-gradient(135deg, #333, #000);
}

/*adding the arrows for the breadcrumbs using rotated pseudo elements*/
.breadcrumb a:after {
	content: '';
	position: absolute;
	top: 0; 
	right: -18px; /*half of square's length*/
	/*same dimension as the line-height of .breadcrumb a */
	width: 36px; 
	height: 36px;
	/*as you see the rotated square takes a larger height. which makes it tough to position it properly. So we are going to scale it down so that the diagonals become equal to the line-height of the link. We scale it to 70.7% because if square's: 
	length = 1; diagonal = (1^2 + 1^2)^0.5 = 1.414 (pythagoras theorem)
	if diagonal required = 1; length = 1/1.414 = 0.707*/
	transform: scale(0.707) rotate(45deg);
	/*we need to prevent the arrows from getting buried under the next link*/
	z-index: 1;
	/*background same as links but the gradient will be rotated to compensate with the transform applied*/
	background: #666;
	background: linear-gradient(135deg, #666, #333);
	/*stylish arrow design using box shadow*/
	box-shadow: 
		2px -2px 0 2px rgba(0, 0, 0, 0.4), 
		3px -3px 0 2px rgba(255, 255, 255, 0.1);
	/*
		5px - for rounded arrows and 
		50px - to prevent hover glitches on the border created using shadows*/
	border-radius: 0 5px 0 50px;
}
/*we dont need an arrow after the last link*/
.breadcrumb a:last-child:after {
	content: none;
}
/*we will use the :before element to show numbers*/
.breadcrumb a:before {
	content: counter(flag);
	counter-increment: flag;
	/*some styles now*/
	border-radius: 100%;
	width: 20px;
	height: 20px;
	line-height: 20px;
	margin: 8px 0;
	position: absolute;
	top: 0;
	left: 30px;
	background: #444;
	background: linear-gradient(#444, #222);
	font-weight: bold;
}


.flat a, .flat a:after {
	background: white;
	color: black;
	transition: all 0.5s;
}
.flat a:before {
	background: white;
	box-shadow: 0 0 0 1px #ccc;
    padding-left: 6px;
}
.flat a:hover, .flat a.active, 
.flat a:hover:after, .flat a.active:after{
background: #ABCAEA;
  color: #888;
}

.flat a  , .flat a:after{
  	background: #E1EDF9;  
}

/************************************ tooth and services surface style in Procedure Editor ********************************************/

.services_surface .tooth_container {
    float: left;
  margin-top: 13px;
}

 

.services_surface .tooth{
    position: relative;
  float: left;
  height: 80px;
  width: 53px;
  top: 10px;
}


.services_surface .number_bottom,
.services_surface .number_top {
   text-align: center;
}


.services_surface .tooth > div {
    background: #D9E0F5;
  border-top-color: #D9E0F5;
}

.services_surface .tooth .top {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 100%;
  left: 6px;
  top: 9px;
  position: absolute;
  cursor: pointer;
  border-top-style: solid;
  border-top-width: 25px;
  background: transparent !important;

        }


.services_surface .tooth .right {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  position: absolute;
  left: 19px;
  top: 23px;
  cursor: pointer;
  border-top-style: solid;
  border-top-width: 15px; 
  background: transparent !important;
        }


.services_surface .tooth .center {
  width: 25px;
  height: 25px;
  -moz-border-radius: 100%;
  -webkit-border-radius: 100%;
  border-radius: 100%;
  -ms-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  position: absolute;
  left: 9px;
  top: 17px;
  z-index: 99; 
  border: 4px solid white;
  cursor: pointer;
  border-top-color: #fff !important;
        }


.services_surface .tooth .left {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 100%;
  -ms-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
  position: absolute;
  left: -6px;
  top: 23px;
  cursor: pointer;
  border-top-style: solid;
  border-top-width: 15px;
  background: transparent !important;
        }


.services_surface .tooth .bottom {
  width: 0;
  height: 0;
  border-left: 15px solid transparent;
  border-right: 15px solid transparent;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 100%;
  -ms-transform: rotate(-180deg);
  -webkit-transform: rotate(-180deg);
  transform: rotate(-180deg);
  position: absolute;
  left: 6px;
  top: 34px;
  cursor: pointer;
  border-top-style: solid;
  border-top-width: 15px; 
  background: transparent !important;
        }

.services_surface .tooth_container .togglecolor{
           border-top-color: #778899 ;
        background-color: #778899 ; 
}
 
 
   
   
   /**********************  ******************************/



.AdultDentalChart .modal-body {
      padding: 10px;
}

.modal-DentalChart {
    width:682px;
}


.AdultDentalChart .tooth  {
    width:40px;
    cursor: pointer;
     border-right: #ccc dashed 1px;
     float: left;
}
.AdultDentalChart .tooth:last-child {
    border-right-color: transparent;
}
 
.AdultDentalChart .tooth:last-child {
    border-right-color: transparent;
}

.AdultDentalChart .tooth .nondecidous  {
    width: 34px;
    height: 71px;
    margin-left: 2px;
}

.modal-DentalChart .modal-body {
    height: 203px;
 
}

.modal-DentalChart .modal-footer {
    border: none;
}
.dashedcolor {
    background-color: #D9E0F5;
}

.modal-DentalChart .number_top ,
.modal-DentalChart .number_bottom {
  text-align: center;
}


.modal-DentalChart 
.tooth .tooth-content:first-child {
    border-bottom: 1px dashed #ccc;
    padding-bottom: 5px;
    margin-left: 1px;
}

.modal-DentalChart 
.tooth .tooth-content:last-child {
     margin-top: 5px;
    margin-left: 1px;
}


.AdultDentalChart .tooth .TL1 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position: -260px -6px ;
}
.AdultDentalChart .tooth .TL2 {
     background-image: url("../../images/DentalChart.png") !important ;    background-position:-217px -6px  ;

 }
.AdultDentalChart .tooth .TL3 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position:  -180px -6px;

 }
.AdultDentalChart .tooth .TL4 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -149px -6px  ;

  }
.AdultDentalChart .tooth .TL5 {  
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -107px -6px ;

  }
.AdultDentalChart .tooth .TL6 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position:  -75px -6px;

  }
.AdultDentalChart .tooth .TL7 {
         background-image: url("../../images/DentalChart.png")  !important ;    background-position: -38px 0px;

 }
.AdultDentalChart .tooth .TL8 {
     background-image: url("../../images/DentalChart.png")!important ;  background-position: 0px 0px  ;

}






.AdultDentalChart .tooth .TR1 {
        background-image: url("../../images/DentalChart.png")!important ;    background-position: -292px -6px  ;
}

.AdultDentalChart .tooth .TR2 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position:-328px -6px  ; 
}

.AdultDentalChart .tooth .TR3 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -368px -6px ;
}

.AdultDentalChart .tooth .TR4 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -408px -6px ;
}
.AdultDentalChart .tooth .TR5 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position:  -442px -6px  ;
}

.AdultDentalChart .tooth .TR6 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -483px -6px ;  
}

.AdultDentalChart .tooth .TR7 {
         background-image: url("../../images/DentalChart.png") !important ;  background-position: -521px -6px  ;

}
.AdultDentalChart .tooth .TR8 {
   background-image:url("../../images/DentalChart.png")!important ;  background-position: -558px -6px ;
}



.AdultDentalChart .tooth .BL1 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position:-253px -94px;
}

.AdultDentalChart .tooth .BL2 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position:-218px -94px ;
  
}

.AdultDentalChart .tooth .BL3 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -182px -94px ;
  
}

.AdultDentalChart .tooth .BL4 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -144px -94px ;
  
}

.AdultDentalChart .tooth .BL5 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -110px -91px ;
  
}
.AdultDentalChart .tooth .BL6 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: -76px -90px ;
  
}
.AdultDentalChart .tooth .BL7 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position:-38px -84px  ;
  
}
.AdultDentalChart .tooth .BL8 {
         background-image: url("../../images/DentalChart.png")!important ;    background-position: 0px -82px ;
  
}




.AdultDentalChart .tooth .BR1 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position: -331px -94px ;
  
}

.AdultDentalChart .tooth .BR2 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position: -331px -94px;
  
}

.AdultDentalChart .tooth .BR3 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position: -366px -94px;
  
}

.AdultDentalChart .tooth .BR4 {
         background-image: url("../../images/DentalChart.png") !important ;    background-position:  -404px -94px;
  
}

.AdultDentalChart .tooth .BR5 {
         background-image: url("../../images/DentalChart.png") !important  ;    background-position:  -440px -94px ;
  
}

.AdultDentalChart .tooth .BR6 {
         background-image: url("../../images/DentalChart.png") !important  ;    background-position:-484px -92px ;
  
}

.AdultDentalChart .tooth .BR7 {
       background-image: url("../../images/DentalChart.png") !important ;    background-position: -520px -89px ;
    
}
.AdultDentalChart .tooth .BR8 {
        background-image: url("../../images/DentalChart.png") !important ;    background-position: -557px -89px ;
   
}
 
/**********************  ******************************/

    .addtion {
        float: left;
    }

    .gomenu {
        position: relative;
        position: relative;
    }


    #toothModal .modal-body {
  position: relative;
  padding: 0px 20px;
  height: 173px;
    }
    /*======== tooth option =========*/


  
    #toothModal div.pull-right {
  margin-left: -10px;
  padding-left: 5px;
  border-left: 1px dashed #DAD6D6;
}
     
    #toothModal .modal-body > div {
  padding-top: 13px;
  padding-bottom: 0px;
}


.services_surface
.tooth {
  position: relative;
  float: left;
  height: 80px;
  width: 53px;
    }

.amn {
  color: #999;
  height: 64px;
  padding: 8px 0 0 12px;
}

.amn span:hover {
    text-decoration: underline;
    cursor: pointer;
}


.kendo-tab {
     /*width: 92%;padding: 4%;margin: 0px auto;*/background: #F3F3F3;clear: both;
}

.kendo-tab 
.k-tabstrip>.k-content, .k-panelbar .k-tabstrip>.k-content {
    border-color: transparent !important;
}

.kendo-tab 
.k-tabstrip-items .k-state-active {
    border-color: transparent !important;
}

#divFilters .disabled{
      color: gray;
      cursor: default;
      text-decoration: none;
}



#divFilters .active {
    
  font-weight: bold;
  color: #615D5D;
}

.fliterpostion {
    position: relative;
  top: 26px;
  right: -29px;
}

  

.fliterpostion .postion  {
        position: absolute;
        z-index: 200;
        right: 3em;
    }

 .input-group span.select_service{
     background: #fff;
     height: 33px;
 }
 .input-group span.select_service input{
     background: #fff;
     height: 30px;
 }