@charset "utf-8";

small{
	color: #999;
}

/* Bootstrap Override */
.navbar-brand{
	
}
.nav-item{
	padding-right:2em;
	font-size: 1.1em;
}
	.navbar-nav{
		flex-wrap: wrap;
	}
	.navbar-nav >.nav-item .nav-link:hover{
		color: rgba(255,255,255, 0.80)
	}
	.navbar-nav >.nav-item .nav-link{
		color: rgba(255,255,255, 0.65)
	}
	.navbar-nav >.nav-item.active .nav-link{
		color: rgba(255,255,255, 1.0);
	}
	
.nav_wrapper{
	/* border-bottom: 0.05em solid rgba(255,255,255, 0.50); */
	padding-top:    0.2em;
	padding-bottom: 1.0em;
	position:relative;
}
.navbar-custom{
    transition: color 0.2s;
}
	.nav-logo-sub{
		padding-top:0.5em;
		font-weight: normal;
		/* color: rgba(255,255,255, 0.95); */
		font-size: 0.9em;
		letter-spacing: 0.13em;
		color:#ccc;
	}

.hdr_title{
	font-size:0.85em;
	color: rgba(255,255,255, 0.75);
	padding: 0.15em;
}
.hdr_subtitle{
	font-size:1.2em;
	color: rgba(255,255,255, 0.95);
	padding: 0.15em;
}

.datepicker {
	font-size: inherit;
	padding: 0.75em;
	color: #333;
}
.datepicker .today{
	background-color:#efefef;
}
.datepicker .today:hover{
	background-color:#dedede;
}
.datepicker thead{
	border-bottom: 0.5px solid #ddd;
	margin-bottom: 1em;
}
.datepicker table tr td.old, .datepicker table tr td.new{
	opacity:0.6;
}
.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover{
	opacity:0.3;
}
.datepicker table tr td.active:active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active{
	background-color: #5d795f;
	border-color: #303e31;
}
.datepicker table tr td.active:active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active{
	background-color: #5d795f;
	border-color: #303e31;
}
.datepicker table tr td.active:active:hover, .datepicker table tr td.active.highlighted:active:hover, .datepicker table tr td.active.active:hover, .datepicker table tr td.active.highlighted.active:hover, .datepicker table tr td.active:active:focus, .datepicker table tr td.active.highlighted:active:focus, .datepicker table tr td.active.active:focus, .datepicker table tr td.active.highlighted.active:focus, .datepicker table tr td.active:active.focus, .datepicker table tr td.active.highlighted:active.focus, .datepicker table tr td.active.active.focus, .datepicker table tr td.active.highlighted.active.focus{
	background-color: #485849;
	border-color: #262e27;
}

.clockpicker-popover .popover-title{
	font-size:1.4em;
}
.clockpicker-popover .popover-title {
	padding-top:0.3em;
	padding-bottom:0.3em;
}
.clockpicker-tick {
	font-size:0.9em;
}
.clockpicker-tick:hover {
	background-color: rgb(182, 221, 185);
	background-color: rgba(93, 121, 95, .25);
}
/* Common Styling */

.jumbotron-title{
	font-size:3em;
	font-weight: bold;
	color:#fff;
}
.jumbotron-subtitle{
	font-size:1.0em;
	color:#333;
}
.jumbotron-context{
	color:#dedede;
	
}
.jumbotroner {
    background-color: #edf8fa;
    margin-bottom: 0px;
    height: 70vh;
    display: flex;
    align-items: center;
	min-height:600px;
	color:#eee;
}
.jumbo-bg-image {
    position: absolute;
    top: 0px;
    right: 0px;
    height: 100%;
	
	opacity: 0.9;
}

.section-wrapper {
	padding: 0;
    padding-top:1em;
	padding-bottom:1em;
}
.section-wrapper-sm {
	padding: 0;
    padding-top: 0.2em;
	padding-bottom: 0.2em;
}
.section-wrapper-lg {
	padding: 0;
    padding-top:2em;
	padding-bottom:3em;
}
.section-btmpad{
	margin-bottom:0.75em;
}
.section-light {
    background-color: #fff;
}
.section-transparent {
    background-color: transparent !important;
}
.section-dark {
    background-color: #455073;
	color: #fff;
}
	.section-dark > p{
		color:#343a40;
	}
.section-gradient-blue {
    background-image: linear-gradient(120deg, #6981c9, #004c97 100%);
	color: #efefef;
}
	.section-gradient-blue > p{
		color:#343a40;
	}
.section-gradient-blue-lit {
    background-image: linear-gradient(120deg, #ffffff, #e7f3ff 100%);
	color: #444;
}
.section-gradient-green {
    background-image: linear-gradient(120deg, #cae2cb, #82bd84 100%);
	color: #444;
}

.section-gradient-green-lit {
    background-image: linear-gradient(120deg, #ffffff, #f0fbf1 100%);
	color: #444;
}
.section-green-lit {
    background-color: #fafbf9;
	color: #333;
}
	.section-green-lit .table thead th{
		border-bottom: 1px solid #cdcfd2;
		background-color:#efefef;
	}

.title{
	font-size: 2.2em;
    border-left: 0.5em solid #bed3bf;
    padding-left: 0.5em;
}
.title_sub{
	position: absolute;
	right: 1.0em;
	bottom: 0;
	opacity: 0.6;
	font-size: 0.85em;
}

.tr_gridlock td{
	padding:0px !important;
	border-top: none;
	border-bottom: none;
}
.grey-text{
	color: #5f6973;
	text-align:justify;
	font-size:0.95em;
	letter-spacing:0.025em;
}
.grey-text-sm{
	color: #5f6973;
	text-align:justify;
	font-size:0.85em;
	letter-spacing:0.025em;
}
.grey-text-xsm{
	color: #959ea7;
	text-align:justify;
	font-size:0.70em;
	letter-spacing:0.025em;
}
.homeimg {
	margin-bottom: 0.8em;
	margin-top: 1.2em;
}
.heightened{
	line-height: 1.75em;
}
.hl{
	font-weight:bold;
	text-decoration:underline;
}
.table{
	margin-bottom: 0em;
	page-break-inside:auto;
}
.table tr{
	page-break-inside:avoid;
	page-break-after:auto;
}
.table thead th{
	border-bottom: 1px solid #cdcfd2;
	background-color:#fafafa;
}
.table thead th,.table thead td, .table tbody th, .table tbody td{
	vertical-align: middle;
	padding: 0.75em;
}
.table-tight{
}
	.table-tight thead th, .table-tight thead td{
		padding-top:0.25em;
		padding-bottom:0.25em;
	}
	.table-tight tbody th, .table-tight tbody td{
		padding-top:0.2em;
		padding-bottom:0.2em;
	}

.err_msg{
	font-size:0.85em;
	color:#cc0033;
	margin-left: 0.25em;
	margin-right: 0.25em;
}
.row{
	/*
	padding-bottom: 1em;
	*/
	padding-top: 0.5em;
	padding-bottom: 0.5em;
}
.row-borded-hdr{
	border-bottom: 0.05em solid rgba(255,255,255, 0.50);
}
.row-borded-btm{
	border-bottom:1px solid #999;
}
	.row-borded-btm-lit{
		 border-bottom:1px solid #ddd;
	}

.row-tight{
	padding-top: 0em;
	padding-bottom: 0em;
}
.log_wrapper{
	height:8em;
	border:1px solid #ddd;
	overflow-y:scroll;
}
.log_item{
	font-size: 0.8em;
	padding-left:0.5em;
	padding-right:0.5em;
	cursor: default;
}
	.log_item a{
		color: #bbb;
	}
	.log_item a:hover{
		color: #666;
		text-decoration:none;
	}

.btn_record_edt{
	font-size: 0.8em;
	position:absolute;
	top:0.25em;
	right:0.25em;
	cursor: pointer;
	color: #eee;
}
	.btn_record_edt:hover{
		color: #999;
	}
.btn_view,.btn_delete{
	width:40px;
}

/* Block Styling */
body{
	padding-bottom:50px;
}
header {
	width: 100%;
	margin-bottom: 2.5em;
}
header .container-fluid{
	/* padding-top: 1.0em; */
	background-color: #272727;
}

#content {
	min-height:600px;
}
footer{
	background-color: #272727;
    position: fixed;
	bottom:0;
	width:100%;
	text-align:center;
}
	.footer-links-list {
		padding: 0px;
		list-style: none;
	}
	.footer-links {
		font-size: 0.9em;
		line-height: 2em;
		color: #bbb;
	}
	.footer-signature{
		font-size:0.8em;
		color: #efefef;
		display:inline-block;
		/* vertical-align: -0.8em; */
	}

	.hdr{
		margin-bottom: 0.6em;
		padding-top: 0.25em;
		padding-bottom: 0.25em;
		border-bottom: 1px solid #dee2e6;
		
	}

	.modal-dialog{
		font-size:0.95em;
	}
	
	.modal-dialog.modal-dialog-70p{
		min-width: 70% !important;
	}
	.modal-dialog.modal-dialog-60p{
		min-width: 60% !important;
	}
	.modal-dialog.modal-dialog-50p{
		min-width: 50% !important;
	}
	.modal-dialog.modal-dialog-40p{
		min-width: 40% !important;
	}
		.modal-dialog .modal-header{
			background-color: #666;
			color:white;
			text-align:center;
			border-radius:0;
			font-size: 1.2em;
		}
	
	.modal-dialog .hdrform{
		font-size: 1.1em;
		padding: 0.75em;
		background-color: #666;
		color: #fff;
		position:relative;
	}
	.modal-dialog .sepa{
		height: 0.5em;
	}
	.modal-dialog .ctrl {
		text-align: center;
		margin-top: 1em;
		border-top: 1px solid #efefef;
		padding-top: 1em;
	}
	
	.chart_wrap{
		position: relative;
	}
		.doughnut_disp{
			position: absolute;
			font-size:3em;
		}
	
	.chart-tooltip-series{
		color: #666;
		border: 1px solid #ddd;
		border-radius: 5px;
		background-color: #fff;
		opacity: 0.7;
	}
		.chart-tooltip-series td, .chart-tooltip-series th{
			padding:3px;
		}
	.chartjs-tooltips{
		opacity: 0;
		position: absolute;
		top:0;
		left:0;
	}

	.loader{
		width:100%;
		text-align:center;
		padding-top:2.5em;
		padding-bottom:2.5em;
	}

	.btn_rmv{
		opacity: 0.4;
		cursor: pointer;
	}
	.btn_rmv:hover{
		opacity: 0.8;
	}

	.err{
		background-color: #ffeaea;
	}
	.errmsg{
		color: #cc3333;
		font-size:0.8em;
		font-weight: normal;
	}

	.td_tslit{
		font-size:0.7em;
	}
	.tdhl{
		font-size: 1.1em;
		font-weight: bold;
	}
	.tdlit{
		font-size: 0.85em;
		font-weight: normal;
		color:#444;
	}
	.tdlit_time{
		font-size:0.7em;
		color:#444;
	}


/* =======================   Module Components =========================== */
/* 	Inherits #content */

#nav_subtitle{
	padding-top: 0.5em;
	/* white-space:nowrap; */
	font-size:0.8em;
	color: #efefef;
}
	#welecome_msg{
		opacity: 0.7;
	}
	#btn_logout{
		opacity: 0.5;
		cursor: pointer;
	}
	#btn_logout:hover{
		opacity: 1.0;
	}

.tbl_nav{
	width: auto;
}
	.tbl_nav .navi{
		background-color: #aaa;
		color: #fff;
		
		padding-top:0.25em;
		padding-bottom:0.45em;
		padding-right:1.0em;
		padding-left: 0.8em;
		cursor: pointer;
		border-bottom-left-radius:  0.4em;
		border-bottom-right-radius: 0.4em;
		min-width: 6em;
		text-align:center;
		opacity:0.7;
	}
	.tbl_nav .navi:hover{
		opacity:1.0;
	}
	.tbl_nav .navi.act{
		background-color: #4b4e4b;
		color: #fff;
		opacity:1.0;
	}
	
	.tbl_nav .navi.app{
		background-color: #d7748f;
		color: #fff;
	}
	.tbl_nav .navi.app.act{
		color: #fff;
		opacity:1.0;
	}
	
	.tbl_nav .navi.comm{
		background-color: #3c8b32;
		color: #fff;
	}
	.tbl_nav .navi.comm.act{
		color: #fff;
		opacity:1.0;
	}
	
	
	.tbl_nav .navi.navi-home{
		min-width:auto;
		background-color:#70758d;
		padding-right:0.4em;
		padding-left: 0.4em;
		border-bottom-right-radius: 0.5em;
		border-bottom-left-radius: 0.5em;
	}
	.tbl_nav .navi-sepa{
		/* min-width: 0.10em; */
		
	}

#ptn_nav{
	
}
	#ptn_nav td{
		text-align:right;
	}
	#ptn_nav .navi{
		background-color: #aaa;
		color: #fff;
		
		padding-top:0.3em;
		padding-bottom:0.3em;
		padding-right:1.0em;
		padding-left: 0.8em;
		
		margin-left: 0.0em;
		margin-right: 0.0em;
		margin-top: 0.1em;
		margin-bottom: 0.1em;
		cursor: pointer;
		border-radius: 0.25em;
		
		min-width: 5em;
		text-align:center;
		opacity:0.7;
		display:inline-block;
		
	}
	#ptn_nav .navi:hover{
		opacity:1.0;
	}
	#ptn_nav .navi.act{
		background-color: #4b4e4b;
		color: #fff;
		opacity:1.0;
	}
	#ptn_nav .navi.app{
		background-color: #d7748f;
		color: #fff;
	}
	#ptn_nav .navi.app.act{
		color: #fff;
		opacity:1.0;
	}
	
	#ptn_nav .navi.comm{
		background-color: #3c8b32;
		color: #fff;
	}
	#ptn_nav .navi.comm.act{
		color: #fff;
		opacity:1.0;
	}
	
	
	#ptn_nav .navi.navi-home{
		background-color:#70758d;
	}	
.page_patients{
}
	#termrec_toggle{
		position:absolute;
		right:0;
		bottom:0.3em;
	}
	#btn_termrec_toggle{
		font-size:0.7em;
		color:#666;
		cursor:pointer;
	}
	#btn_termrec_toggle:hover{
		color:#000;
	}

.page_home{
}
	.badge_home{
		padding-top:0.5em;
		padding-bottom:0.5em;
		text-align:center;
		margin-top:1.0em;
		margin-bottom:0.2em;
		
		/* border: 1px solid #dedede;
		background-color:#efefef;
		border-radius: 1em; */
	}
	#pid_disp{
		background-color: #999;
		color: #fff;
		text-align:center;
		padding:0.5em;
	}
		#pid_disp [name=pid]{
			font-size: 2em;
		}
	.btn_home{
		font-size:1.5em;
		font-weight: normal;
		min-width:100%;
	}
	.tag {
		min-width:4em;
		display: inline-block;
		border-radius: 0.5em;
		padding: 0.25em;
	}

	.line_logtype_in{
		background-color: #cb4e70;
		color: #fff;
		display: inline-block;
		padding: 0.4em;
		border-radius: 0.2em;
		font-size:0.9em;
	}
	.line_logtype_out{
		background-color: #609b4d;
		color: #fff;
		display: inline-block;
		padding: 0.4em;
		border-radius: 0.2em;
		font-size:0.9em;
	}

.page_map{	
}
	.SvgOverlay {
		position: relative;        
	}

	.SvgOverlay .SvgBase {
		position: absolute;
		top: -4000px;
		left: -4000px;
		width: 8000px;
		height: 8000px;
	}
	#map_overlay{
		background-color:rgba(255,255,255,0.3);
	}
	#map_overlay_mouse{
		
	}
	.g_ptnpt,g_ptnlbl{
		cursor:default;
	}
	#map_info{
		background-color: #fff;
		opacity:1;
		padding:0.5em;
		font-size: 0.85em;
	}

.page_patient_visit{
}
	.ditto{
		position:absolute;
		right:0.75em;
		top:0.5em;
		font-size:0.75em;
		text-align:right;
	}
		.ditto [name=btn]{
			color:#bbb;
		}
		.ditto [name=btn]:hover{
			color:#fff;
		}
		.ditto [name=disp]{
			color:#ccc;
			margin-right:0.2em;
		}
/* QTR */
	.qtrtbl{
	}
	.qtrtbl .hdr{
		font-size:1.1em;
		padding: 1.0rem;
		background-color: #666;
		color:#fff;
	}
    .qtrtbl .th, .qtrtbl .td{
		/*border: 1px solid #dee2e6;*/
		
		box-shadow: 
			0.7px 0 0 0 #dee2e6, 
			0 0.7px 0 0 #dee2e6, 
			0.7px 0.7px 0 0 #dee2e6,   /* Just to fix the corner */
			0.7px 0 0 0 #dee2e6 inset, 
			0 0.7px 0 0 #dee2e6 inset;
	
		padding: 0.75rem;
		font-size:1.05rem;
	}
	.qtrtbl .th{
		background-color: #f9f9f9;
	}
	.qtrtbl .td{
		
	}
	.qtrtbl .qh{
		/*border-left:4px solid #82FFB7 !important; */
		box-shadow: 
			0.7px 0 0 0 #dee2e6, 
			0 0.7px 0 0 #dee2e6, 
			0.7px 0.7px 0 0 #dee2e6,   /* Just to fix the corner */
			4.0px 0 0 0 #82FFB7 inset, 
			0 0.7px 0 0 #dee2e6 inset;
	}
	.qtrtbl .qbh{
		/*border-left:4px solid #82FFB7 !important; */
		box-shadow: 
			0.7px 0 0 0 #dee2e6, 
			0 0.7px 0 0 #dee2e6, 
			0.7px 0.7px 0 0 #dee2e6,   /* Just to fix the corner */
			4.0px 0 0 0 #61a6d7 inset, 
			0 0.7px 0 0 #dee2e6 inset;
	}
	
	.notion{
		font-size:0.85em;
		text-align:left;
	}
	.dot-xsm{
		display: inline-block;
		background-color: #d42f2f;
		border-radius: 0.4em;
		width:0.4em;
		height:0.4em;
		line-height:0.3em;
	}

	.dot-sm{
		display: inline-block;
		background-color: #d42f2f;
		border-radius: 0.7em;
		width:0.7em;
		height:0.7em;
		line-height:0.7em;
	}
	.dot-lg{
		display: inline-block;
		background-color: #d42f2f;
		border-radius: 4em;
		width:4em;
		height:4em;
		line-height:4em;
	}
	
	.dot-r{
		background-color: #d42f2f;
		color: #fff;
	}
	.dot-y{
		background-color: #f5e233;
		color: #555;
	}
	.dot-g{
		background-color: #76b344;
		color: #fff;
	}
	.tbl_head_wrap{
		margin-top:2.25rem;
		margin-bottom:1.5rem;
		padding:2rem;
		background-color:#f6f6f6;
		
	}
	.tbl_head{
	}
		.tbl_head td{
			vertical-align:middle;
			font-size: 1.4rem;
			padding-left: 0.25rem;
			padding-right: 0.25rem;
			text-align:center;
		}

	.dot-round-1p0{
		border-radius: 1.0em;
	}
	.dot-round-p50{
		border-radius: 0.5em;
	}
	.dot-round-p25{
		border-radius: 0.25em;
	}
	.score_tag{
		width: 2.5em;
		display: inline-block;
	}


/* Login */
.page_login{
}
	#login_wrap{
		background-color:#f6f6f6;
		border-radius: 0.5em;
		padding: 2em;
		padding-bottom: 1em;
	}
	#tbl_login{
		width: 100%;
		table-layout: fixed;
	}
		#tbl_login th{
			border:none;
			background-color: #5d795f;
			color: #efefef;
			
			text-align: center;
			letter-spacing: 0.2em;
			padding-top: 0.75em;
			padding-bottom: 0.75em;
		}
		#tbl_login td{
			border:none;
		}
		#tbl_login input{
			font-size:1em;
		}
		#tbl_login #msg{
			color:#ff2222;
			font-size:0.8em;
			text-align:center;
		}
		#tbl_login button{
			min-width: 100px;
			width: 80%;
		}


/* terry */
.tbl_title{
	background-color:#444 !important;
	color:white;
	text-align:center;	
	font-size:1.2em;
	
}
.tbl_subtitle{
	background-color:#999 !important;
	color:white;	
	text-align:left !important;
}
.redlight{
	background-color: red;
}
.orangelight{
	background-color: orange;
}
.greenlight{
	background-color: greenyellow;
}
.red-dot {
	position: relative;
}
.red-dot::after {
	content: '';
	position: absolute;
	top: -12%;
	right: -12%;
	width: 12px;
	height: 12px;
	background-color: red;
	border-radius: 50%;
}