

.content .title{     font-size: 1.5em;
	float: left;
	background-color: #27b7dade;
	padding: 6px 29px;
	width: fit-content;
	border-radius: 0px 5px 5px 0px;}

#Titleview{	overflow: hidden;height: 40px;}


#style-10::-webkit-scrollbar-track{  -webkit-box-shadow: inset 0 0 6px rgba(243, 242, 242, 0.3);
	background-color: rgba(255, 255, 255, 0.1);border-radius: 50%;   }
#style-10::-webkit-scrollbar{width: 2px;background-color: rgba(187, 186, 186, 0.35);}
#style-10::-webkit-scrollbar-thumb{background-color: #e4e4e4;border-radius: 10px;background-image: -webkit-linear-gradient(50deg, rgba(0, 0, 0, .2) 25%, transparent 25%,transparent 50%,rgba(0, 0, 0, .2) 50%,rgba(0, 0, 0, .2) 75%,transparent 85%,transparent);}




.styled-input-single {
	position: relative;
	padding: 10px 0 3px 45px;
	text-align: left;
}
.styled-input-single label {
	cursor: pointer;
}
.styled-input-single label:before, .styled-input-single label:after {
	content: '';
	position: absolute;
	top: 50%;
	border-radius: 50%;
}
.styled-input-single label:before {
	left: 0;
	width: 30px;
	height: 30px;
	margin: -15px 0 0;
	background: #f7f7f7;
	box-shadow: 0 0 1px grey;
}
.styled-input-single label:after {
	left: 5px;
	width: 20px;
	height: 20px;
	margin: -10px 0 0;
	opacity: 0;
	background: #37b2b2;
	-webkit-transform: translate3d(-40px, 0, 0) scale(0.5);
	transform: translate3d(-40px, 0, 0) scale(0.5);
	transition: opacity 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
	transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;
	transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
}
.styled-input-single input[type="radio"],
.styled-input-single input[type="checkbox"] {
	position: absolute;
	top: 0;
	left: -9999px;
	visibility: hidden;
}
.styled-input-single input[type="radio"]:checked + label:after,
.styled-input-single input[type="checkbox"]:checked + label:after {
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
	opacity: 1;
}

.styled-input--square label:before, .styled-input--square label:after {
	border-radius: 0;
}

.styled-input--rounded label:before {
	border-radius: 10px;
}
.styled-input--rounded label:after {
	border-radius: 6px;
}

.styled-input--diamond .styled-input-single {
	padding-left: 45px;
}
.styled-input--diamond label:before, .styled-input--diamond label:after {
	border-radius: 0;
}
.styled-input--diamond label:before {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.styled-input--diamond input[type="radio"]:checked + label:after,
.styled-input--diamond input[type="checkbox"]:checked + label:after {
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	opacity: 1;
}
/* custom style  */
#sidebarnav li ul li a i{
	margin-right: 10px;
}
.alert-success {
	background-color: #93ede9;
	border-color: #93ede9;
	color: #218e89;
}
.appForm label {
	font-weight: 400;
	margin-bottom: 10px;
	color: #1fa9bf;
}

.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
	line-height: 15px;
	vertical-align: -webkit-baseline-middle;
}
.upload-btn-wrapper {
	position: relative;
	overflow: hidden;
	display: inline-block;
	margin: 10px;
	float: right;
}
.btnupload {
	border: 2px solid #1eacbe57;
	color: #24a9c7ba;
	background-color: white;
	padding: 8px 20px;
	border-radius: 8px;
	font-size: 20px;
	font-weight: bold;
}
.btnupload:before {
	font-family: FontAwesome;
	content: "\f0c2";
	display: inline-block;
	padding-right: 3px;
	vertical-align: middle;
}
.upload-btn-wrapper input[type=file] {
	font-size: 100px;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
}
#ImagePreview{
	width: 75px;
	height: 66px;
	border-radius: 10%;
	border: 5px #e7e7e7 solid;
	margin-top: 0px;
	float: left;
}


.productImg{
	text-align: center;
	font-size: 12px;
	color: #fff;
	height: 40px;
	padding-left: 8px;
	padding-right: 6px;
	padding-top: 10px;
	width: auto;
	border: solid 2px #ededed;
	border-radius: 6px;
	margin: 2px;
	background-size: 90%;
	font-family: monospace;
	float: left;
	background-repeat: no-repeat;
	background-position: center;
	background-color: #319bc5;
}

.productImg:hover{opacity: 0.8;border-color: #dee2e1cc;cursor: pointer;background-color: #15a59e;color: #FFF;font-weight: bold;}
.product_Select{opacity: 0.8;border-color: #dee2e1cc;cursor: pointer;background-color: #15a59e;color: #FFF;font-weight: bold;}

.imgisslect {
	right: 33px;
	position: absolute;
	top: 25px;
	height: 100px;
	width: 110px;
	border: 5px #e7e7e7 solid;
	border-radius: 6px;
	margin: 5px;
}

.tD {
	text-align: center;
}
.thfooter{
	background-color: rgba(100, 101, 101, 0.66);
	color: #f1f1f1;
}

@media (max-width: 768px){
	#addtoinvoices.card {
		display: inline-block;
		width: 100%;
		/*height: 550px;*/
	}
}
.m-t-40 {margin-top: 0px!important;}
.card .card-subtitle {
	color: #99abb4;
	font-weight: 300;
	margin-bottom: 0px;
}

/*table invoice */
.tbor. th, td { border-collapse: collapse;      }
.tbor thead{ background: #EEE;  }
.tbor thead th{ background: #EEE;   height: 35px;}
.tbor tfoot th{ background: #EEE;   height: 35px;}
.tbor tbody tr:hover{ background: #EEE;   height: 30px;}
.tbor  .TD_c{text-align: center;}
.tbor .TD_r{text-align: right;}
.tbor .TD_l{text-align: left;}
.tbor tbody tr{height: 30px;}
.tbor td{ padding-left: 5px; }
.tbor {   border: 1px solid #f0f3f5a8;    }

.SEL_Clint{display: none;background: #3cc1746e;height: 39px;padding: 5px;color: #3a3b3cb5;width: auto;overflow: hidden;	border-radius: 5px;	border: 3px solid rgba(155, 226, 194, 0.53);}
.SEL_Clint #ClearClint{display: none;	cursor: pointer;	position: absolute;	right: 22px;	top: 44px;}
.SEL_Clint:hover #ClearClint {	display: block;/*transition: all 0.2s ease 0s;*/}

.SEL_Doctor{display: none;background: #e4f3e8;height: 39px;padding: 5px;color: #156f30b5;width: auto;overflow: hidden;border-radius: 5px;border: 3px solid #3ed3e694;}
.SEL_Doctor #ClearDoctor{display: none;	cursor: pointer;	position: absolute;	right: 22px;	top: 44px;}
.SEL_Doctor:hover #ClearDoctor {	display: block;/*transition: all 0.2s ease 0s;*/}
.SEL_Employees{    background: #58d3e661;
	height: 39px;display: none;
	padding: 5px;
	color: #7b7071;    text-align: center;
	width: auto;
	padding-left: 65px;
	overflow: hidden;
	border-radius: 5px;
	border: 3px solid #80dbea;}
.SEL_Employees #ClearDoctor{display: none;	cursor: pointer;	position: absolute;	right: 22px;	top: 44px;}
.SEL_Employees:hover #ClearDoctor {	display: block;/*transition: all 0.2s ease 0s;*/}
#ClearEmployees{margin: 4px; float: right; cursor: pointer;}

.empimgSElect{	float: left;	height: 63px;	width: 63px;	background-color: #c1eef6;	border: solid 4px #17a2b89e;	border-radius: 50%;	position: absolute;	top: 21px;
	left: 19px;	background-size: cover;	background-position: center;}

.btnup{height: 70px;
	width: 118px;
	border: 4px solid #c6cace8f;
	color: #ffffffba;
	background-color: var(--secondary);
	padding: 6px 20px;
	border-radius: 8px;
	font-size: 20px;
	background-size: cover;
	font-weight: bold;
}

.btnup:before {
	font-family: FontAwesome;
	content: "\f0c2";
	display: inline-block;
	padding-right: 3px;
	vertical-align: middle;
}











.searshfor {
	float: left;
	height: 40px;
	border: none;
	line-height: 36px;
	font-size: 24px;
	color: cadetblue;
	background-repeat: no-repeat;
	background-position: 100% 16px;
	padding-right: 21px;
	border-bottom: 1px #EEE solid;
}
.searshfor:hover {	background-image: url(/images/se.png);border-bottom: 1px #EEE solid;}
/*table invoice */
/* end custom style  */
.f10{font-size: 10px;}
.f11{font-size: 11px;}
.f12{font-size: 12px;}
.f13{font-size: 13px;}
.f14{font-size: 14px;}
.f15{font-size: 15px;}
.f16{font-size: 16px;}

.secbg{
	background-color: #e0e3e8;
	background-repeat: no-repeat;
	background-image: url(https://scontent-hbe1-1.xx.fbcdn.net/v/t1.15752-9/48039905_543656969377900_â€¦&_nc_ht=scontent-hbe1-1.xx&oh=d3a8fedâ€¦&oe=5C970A7A);
	background-position: bottom;
	background-size: 300px;
	background-position-x: right;
}

.fbuserimg{
	height: 60px;
	width: 60px;
	margin: 15px;
	border-radius: 50%;
	border: 5px solid #efeeeed9;
	background: url(../images/avatar/4.jpg);
	background-size: cover;
}
#ManualAttendance_Notes{   padding-bottom: 0px;
	height: 64px;
	z-index: auto;
	position: relative;
	line-height: 24px;
	font-size: 16px;
	transition: none 0s ease 0s;
	background: transparent !important;
	padding-top: 0px;}



/* TOOTH Style */

.tooth {
	float: left;
	width: 40px;
	height: 40px;
	border: solid #b0e0e6 2px;
	margin: 1px;
	margin-bottom: 5px;
	margin-top: 5px;
	text-align: center;
	border-radius: 5px;
	color: #424847;
	padding: 5px;
	position: relative;
	background-image: url(/images/toothbg.png);
	background-position: bottom;
	background-repeat: no-repeat;
	font-size: 13px;
	background-size: 20px;
}
.TActive{
	border: dashed #ff5c29 2px;
	background: #ff5c29;
	cursor: pointer;
	color: white;
	font-size: larger;
}
.Tselect {
	border: dashed #ff5c29 2px;

}


.tooth:hover {
	/*border: dashed #b0e0e6 2px;*/
	border: dashed #ff5c29 2px;
	background: #ff5c29;
	/*background: #48d4e6;*/
	cursor: pointer;
	color: white;
	font-size: larger;
}
.FLR{ float: right;margin-right: 5px}
.FLe{ float: left;
	margin-left: 5px;}
.TRnsion {
	-webkit-transition: all 0.6s ease-in-out;
	transition: all 0.6s ease-in-out;
}

.ToothTopRight{
	border-bottom: 5px double rgb(143, 220, 255);
	border-right: 5px double rgb(143, 220, 255);
	border-radius: 0px 25px 0px 0px;
	border-top: 10px #a5b3b917 solid;
}

.ToothTopRight::before {
	content: "Top Right : UL";
	font-size: 11px;
	position: absolute;
	top: -15px;
	color: #69a2b9;
	left: 5px;
}

.ToothTopLeft {
	border-bottom: 5px double rgb(143, 220, 255);
	border-top: transparent solid 7px;
}
.ToothTopLeft::before {
	content: "Top Left : UR";
	font-size: 11px;
	position: absolute;
	bottom: 0;
	right: 5px;
	color: #69a2b9;
	top: 15px;
}

.ToothBottomLeft{
	border-left: 5px double rgb(143, 220, 255);
	border-radius: 0px 0px 0px 33px;
	border-bottom: 10px #a5b3b917 solid;
}

.ToothBottomLeft::before {
	content: "Bottom Left : LR";
	font-size: 11px;
	position: absolute;
	bottom: -10px;
	right: 5px;
	color: #69a2b9;
}



.ToothBottomRight::before {
	content: "bottom Right : LL";
	font-size: 11px;
	position: absolute;
	top: 15px;
	color: #69a2b9;
	left: 5px;
}


.form-control:disabled, .form-control[readonly] {
    background-color: #ffffff;
    opacity: 1;
}
#Tooth{
    color: #f45927;
    font-size: xx-large;
}
/*end tooth style */



.Tooth-Children{
	background: url(/images/cheldren.png);
	margin-right: 20px; cursor: pointer;
	height: 55px;
	width: 55px;
	border: solid 3px #e3e6e6;
	border-radius: 50%;
	float: left;
	background-position: center;
	background-size: cover;
	background-position-x: -3px;
	background-position-y: 1px;
	background-repeat: no-repeat;
}

.Tooth-adults{         margin-right: 20px; cursor: pointer;
	background: url(/images/adullt.png);
	height: 55px;
	width: 55px;
	border: solid 3px #e3e6e6;
	border-radius: 50%;
	float: left;
	background-position: center;
	background-size: 110%;
	background-repeat: no-repeat;
}
.Tooth-adults:before {
	content: "Adults";
	font-size: inherit;
	color: #5edace;
	right: -61px;
	position: relative;
	top: 13px;
}

.Tooth-Children:before {
	content: "Child";
	font-size: inherit;
	color: #f7885d;
	left: -51px;
	position: relative;
	top: 13px;
}
.Tooth-Children:hover{border: dashed 2px #0d71bb; }
.Tooth-adults:hover{border: dashed 2px #0d71bb; }
.AgeyTepeACtiv{border: dashed 2px #0d71bb;}








