@charset "UTF-8";

@media all
{
	.login_content {
		padding: 0;
	}
	.login_content form div a {
		font-size: 12px;
		margin: 10px 0 0 0;
	}
	.login_content h1 {
		line-height: 30px;
	}
	.login_content h1::before, .login_content h1::after {
		top: 30px;
		width: 15%;
	}
	.panel_toolbox {
		min-width: 45px;
	}
	.switch {
		margin-top: 8px;
	}
	.dataTables_processing {
		height: auto;
		z-index: 100;
	}
	.page-loader-wrapper {
		z-index: 99999999;
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		width: 100%;
		height: 100%;
		background: #eee;
		overflow: hidden;
		text-align: center;
	}
	.page-loader-wrapper .loader {
		position: relative;
		top: calc(40% - 30px);
	}
	.md-preloader.pl-size-md {
		width: 50px;
	}
	.md-preloader {
		font-size: 0;
		display: inline-block;
	}

	.bg-red {
		background-color: #F44336 !important;
		color: #fff;
	}
	.bg-pink {
		background-color: #E91E63 !important;
		color: #fff;
	}
	.bg-purple {
		background-color: #9C27B0 !important;
		color: #fff;
	}
	.bg-deep-purple {
		background-color: #673AB7 !important;
		color: #fff;
	}
	.bg-indigo {
		background-color: #3F51B5 !important;
		color: #fff;
	}
	.bg-blue {
		background-color: #2196F3 !important;
		color: #fff;
	}
	.bg-light-blue {
		background-color: #03A9F4 !important;
		color: #fff;
	}
	.bg-cyan {
		background-color: #00BCD4 !important;
		color: #fff;
	}
	.bg-teal {
		background-color: #009688 !important;
		color: #fff;
	}
	.bg-green {
		background-color: #4CAF50 !important;
		color: #fff;
	}
	.bg-light-green {
		background-color: #8BC34A !important;
		color: #fff;
	}
	.bg-lime {
		background-color: #CDDC39 !important;
		color: #fff;
	}
	.bg-yellow {
		background-color: #ffe821 !important;
		color: #fff;
	}
	.bg-amber {
		background-color: #FFC107 !important;
		color: #fff;
	}
	.bg-orange {
		background-color: #FF9800 !important;
		color: #fff;
	}
	.bg-deep-orange {
		background-color: #FF5722 !important;
		color: #fff;
	}
	.bg-brown {
		background-color: #795548 !important;
		color: #fff;
	}
	.bg-grey {
		background-color: #9E9E9E !important;
		color: #fff;
	}
	.bg-blue-grey {
		background-color: #607D8B !important;
		color: #fff;
	}
	.bg-black {
		background-color: #000000 !important;
		color: #fff;
	}
	.bg-white {
		background-color: #ffffff !important;
		color: #000;
	}

	.btn-group, .btn-group-vertical {
		vertical-align: text-bottom;
	}

	input[type="file"] {
		height: auto;
	}

	.border-line {
		padding: 10px 0;
		border-bottom: 1px dashed #dfdfdf;
	}

	.form-line {
		border-bottom: 1px solid #dfdfdf;
	}

	#accordion .panel-collapse {
		padding: 5px;
		margin-bottom: 10px;
		border: 1px solid #ccc;
	}

	.accordion-title {
		color: #fff;
		text-decoration: none;
	}
	.accordion-title:hover, .accordion-title:focus {
		color: #fff;
		text-decoration: none;
	}

	table.dataTable > tbody > tr.child span.dtr-title {
		min-width: 150px;
	}
	.table-bordered > thead > tr > th, .table-bordered > tfoot > tr > th {
		text-align: center;
	}

	#datatable b, #datatable b > a {
		color: #a80a0a;
	}	
	
	.loading-image  {
		width: 50px;
	}
	
	#popup .modal-dialog {
		width: 90%;
		margin: 2% auto;
	}

	#popup .modal-header {
		text-align: center;
	}
	
	#notification, #alert {
		max-height: 400px;
		overflow-y: scroll;
	}

	#notification::-webkit-scrollbar-track, #alert::-webkit-scrollbar-track
	{
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
		border-radius: 10px;
		background-color: #F5F5F5;
	}

	#notification::-webkit-scrollbar, #alert::-webkit-scrollbar
	{
		width: 12px;
		background-color: #F5F5F5;
	}

	#notification::-webkit-scrollbar-thumb, #alert::-webkit-scrollbar-thumb
	{
		border-radius: 10px;
		-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
		background-color: #555;
	}

	.letter {
		font-family: Arial;
		font-size: 11pt;
		margin: 25px auto;
		padding: 50px;
		color: #333;
		background-color: #fff;
		border: 1px solid #ccc;
		border-radius: 0;
		display: block;
	}
	.letter h1 {
		font-size: 16pt;
		margin: 0;
	}
	.letter h2 {
		font-size: 13pt;	
		margin: 0;
	}
	.letter h3 {
		font-size: 12pt;	
		margin: 0;
	}
	.letter table {
		font-family: Arial;	
		font-size: 11pt;
		line-height: 17.5pt;		
	}
	.letter th, .letter td {
		vertical-align: top;
		padding: 0;
	}
	.letter .address {
		margin: 0;
		padding: 0;
		font-size: 9pt;	
		line-height: 9pt;		
	}
	.letter .line {
		margin: 0;
		border: 2px solid #000;
	}
	.letter br {
		margin: 0;
		padding: 0;
	}
	.letter .table table {
		width: 100%;
		font-family: Arial;	
		font-size: 11pt;
		line-height: 17.5pt;
	}
	.letter .table th {
		vertical-align: top;
		text-align: center;
		padding: 5px;
		border: 1px solid #666;	
	}
	.letter .table td {
		text-align: justify;
		vertical-align: top;
		padding: 5px;
		border: 1px solid #666;		
	}
	.letter .table p {
		padding: 5px;	
	}
	.letter ol {
		text-align: justify;
		margin-left: 0;
		padding-left: 15px;
	}
	
	.a4 {
		min-width: 21cm;
		max-width: 21cm;
		min-height: 29.7cm;		
	}
	
	.a5 {
		min-width: 16.5cm;		
		max-width: 16.5cm;
		min-height: 21.5cm;
	}
	
	.signature {
		position: absolute;
		z-index: 99;
	}
	
	.page-break {
		border: 1px dashed #999;
	}

	.list-receiver {
		padding-left: 0;
		list-style: none;
	}
	
	.mobile {
		background-color: #fff;	
		min-height: 500px;
	}	
	
	.dtp > .dtp-content > .dtp-date-view > header.dtp-header {
		background: #20B090;
	}	
	
	.dtp div.dtp-date, .dtp div.dtp-time {
		background: #26B99A;
	}	
		
	.dtp .p10 > a {
		color: #fff;
		text-decoration: none;
	}	
	
	.sweet-alert {
		width: 300px !important;		
	}	
	
	.sweet-alert h2 {
		font-size: 16px;
		line-height: 18px;		
	}	
	
	.sweet-alert p {
		font-size: 12px;
		line-height: 14px;				
	}
	
	.sweet-alert button {
		font-size: 14px;
	}
	
	.input-group {
		margin-bottom: 0;
	}

	#popup-attachment .modal-dialog, #popup-map .modal-dialog {
		width: 90%;
	}
	
	#attachment-image {
		margin: 10px auto;
	}
	
	#popup-preview .modal-dialog, #popup-detail .modal-dialog {
		width: 90%;
	}
	
	#popup-hpk .modal-dialog, #popup-npt .modal-dialog, #popup-ksm .modal-dialog {
		width: 90%;
	}
	
	.tile_count .tile_stats_count::before {
		height: 100px;
	}
	
	.tile_count .tile_stats_count span.count_top {
		font-size: 18px;
		font-weight: 400;
	}	
	
	.timeline .tags {
		top: 4px;
		width: 85px;
	}
}

@media screen and (min-width: 400px) 
{
	.mobile {
		min-height: 700px;
	}
}

@media screen and (min-width: 800px) 
{
	.mobile {
		min-height: 1200px;
	}
}