body p {
	margin-top: 0;
	margin-bottom: 0.5rem;
	font-size: 20px;
}
.navbar-light .navbar-brand {
	width: 50%;
}
.col-form-label {
	text-align: left;;
}
.modal-content {
	border: 0;
	border-radius: 1.125rem;
}
.login-area {
	padding:15px;
	text-align: center;
}
.g-login-margin {
	margin-top: 30px;
	margin-bottom: 30px;
}
.g-content-area {
	margin-bottom : 80px;
}
.g-card-booking {
  background-color: #FFF;
  box-shadow: 0 0px 5px 1px rgb(130 130 130 / 25%);
  margin: 2rem 0;
	border-radius: 1.125rem !important;	
}

.g-bg-tran {
	padding: 0 1rem 1rem 1rem;
	background-color:	#FFF;
	opacity: 0.8;
	border-radius: 1.125rem !important;
}
.g-card-stutus {
	padding:0.72rem;
	color: #FFF;
}
.g-card-stutus.danger {
	background-color: tomato;
}
.g-card-stutus.primary {
	background-color: #0d6efd;
}
.g-card-stutus.success {
	background-color: forestgreen;
}
.g-card-stutus.warning {
	background-color: #ffb600;
}
.g-card-stutus > .row > p ,.g-card-detail > .row > p {
	margin-bottom: 0;
}
.g-card-detail {
	padding:0.72rem;
	background-color: #FFF;
  box-shadow: 0px 3px 4px 0px rgb(202 202 202 / 50%);
}
.g-card-content {
	text-align: left;
}
.bg-circle {
	display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 30px;
    border-radius: 50%;
    padding: 8px;
    margin: 10px 0;
}
.bg-circle.icon {
	display: inline-flex;
	text-align: center;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.30);
}
.bg-circle.icon.primary {
	background-color: #0d6efd;
} 
.g-card-insp {
	border-top: 7px solid #949494;
}
.g-card-insp.success {
	border-top: 7px solid forestgreen;
}
.g-card-insp.warning {
	border-top: 7px solid #ffb600;
}
.bg-light-gray {
	background-color: rgb(239, 239, 239);
}
.g-chart-area {
	padding: 0 0 2rem 0;
	text-align: center;
	text-transform: uppercase;
	color: #fff;
	border-radius: 0.50rem;
	-webkit-box-shadow: 0 0.4375rem 0.875rem 0 rgba(65, 69, 88, 0.1), 0 3px 6px 0 rgba(0, 0, 0, 0.07) !important;
	box-shadow: 0 0.4375rem 0.875rem 0 rgba(65, 69, 88, 0.1), 0 3px 6px 0 rgba(0, 0, 0, 0.07) !important;
}
.g-chart-area > h5 {
	font-size: 15px;
	background-color: rgb(255 255 255 / 50%);
	border-radius: 0.5rem;
	padding: 0.50rem;
}
.g-chart-area > h2 {
	margin-top: 2rem;
	font-weight: 600;
}
.g-chart-area.light {
	background-color: #cecece;
}
.g-chart-area.primary {
	background-color: #6cb3f7;
}
.g-chart-area.danger {
	background-color: #f76c83;
}
.g-chart-area.warning {
	background-color: #f7cb6c;
}
.g-chart-area.success {
	background-color: #7fce65;
}
.text-fb {
	float: left;
  font-size: 26px;
	color: #3b5998;
}
.text-line {
	float: left;
  font-size: 26px;
	color: #00B900;
}
.bg-dev {
	padding: 1rem;
	max-width: 130px;
	max-height: 130px;
}
.bg-dev img {
	width: 100%;
	height: auto;
}
.clickable:hover {
	cursor: pointer;
}


/* ------ inv_user_table ------ */

#inv_user_table thead > tr > th {
	border-bottom: 2px solid #949494;
}
#inv_user_table tbody > tr > td:nth-child(1) {
	text-align: left;
	min-width: 200px;
}
#inv_user_table tbody > tr > td:nth-last-child(1) {
	text-align: right;
	max-width: 250px;
}
.total-table {
	border-top: 1px solid #d0d0d0;
	border-bottom: 1px solid #d0d0d0;
}
.total-table > td >h4 {
	color: dodgerblue;
}

/* --------- Max-width ---------- */
/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
	body p {
		margin-top: 0;
		margin-bottom: 0.5rem;
		font-size: 15px;
	}
	.g-chart-area > h5 {
		font-size: 12px;
	}
 }
 /* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {  
	.px-sm-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
	}
}

/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {  }

/* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {  }

 /* X-Large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {  }


/* --------- Min-width ---------- */
 /* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {  }

 /* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
	.pe-sm-2 {
    padding-right: 0.5rem !important;
  }
 }

 /* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
	
}

 /* X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  }

 /* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {  }