


/* -----------------------------------
		    Order/ Renew CSS
----------------------------------- */
.form-area {
	padding: 10px 0 60px 0;
}
.form-area .border {
	border: 1px solid #151515 !important;
}
.green-title {
	margin: 0 15px;
	padding-bottom: 10px;
	border-bottom: 2px solid #22b573;
}
.green-title span {
	margin: 0;
	font-size: 18px;
	color: #22b573;
}
.green-title img {
	width: 22px;
	float: left;
	margin-right: 10px;
	padding-top: 2px;
}
.warning-text {
	padding: 32px 15px;
	background-color: #f9f9f9;
	border: 2px solid #ccc;
	border-radius: 5px;
	width: 100%;
}

@media (max-width: 991px){
	.green-title {
		margin: 0;
	}
	.form-area .m-3 {
		margin: 1rem 0 !important;
	}
	.confirm-form .colorfuldmn-img {
		display: none;
	}
}



/* -----------------------------------
		    Bank Area CSS
----------------------------------- */
.bank-wrapper {
	padding: 0;
}
.mail-info {
	margin: 0 150px;
	display: flex;
	flex-wrap: wrap;
}
.mail-info i { 
	margin-right: 8px;
	font-size: 18px;
}
.mail-info a {
	color: black;
	font-size: 19px;
	font-weight: 600;
}
.mail-info .card h3 {
	color: #1dc8cc;
	font-weight: 500;
}
.mail-info p {
	font-size: 18px;
}
@media (max-width: 767px){
	.mail-info .col-lg-1 { display: none; }
	.mail-info p { font-size: 17px; }
}
@media (max-width: 992px){
	.mail-info { margin: 0; }
}



/* -----------------------------------
		  Bank Area CSS
----------------------------------- */
.banks {
  	background: url(https://4gbhost.com/images/bg-img/bg-bank-detail.jpg) center no-repeat;
	background-size: cover;
  	border-radius: 6px;
  	box-shadow: 0 2px 5px rgba(0,0,0,0.075);
  	text-align: center;
	padding: 15px;
	margin: 100px auto 0 auto;
}
.bank-logo {
  	border-radius: 100px;
  	overflow: hidden;
  	height: 125px;
  	width: 125px;
  	position: relative;
  	margin: auto;
  	top: -70px;
  	box-shadow: 0 0 0 12px white; /* #faf8f9 */
}
.bank-logo img {
  	position: absolute;
  	left: 0;
  	top: 0;
	width: 125px;
	height: 125px;
  	border-radius: 100px;
}
.banks h5 {
	margin: -35px 0 0 0;
	font-size: 18px;
  	font-weight: 500;
  	color: currentColor;
}
.banks p {
	font-family: "Sarabun";
  	color: #333;
	margin-bottom: 0;
}
.banks p:last-child {
	margin-bottom: 15px;
}

.bank-note {
	margin: 30px 0;
}
.bank-note h5 {
	color: #0a58ca;
	font-weight: 500;
	margin: 0;
	text-align: start;
}
.bank-note ul {
	margin: 15px 0 0 20px;
	padding: 0;
	list-style: decimal;
	list-style-position: outside;
}
.bank-note ul li {
	font-family: "Sarabun";
	font-size: 16px;
	word-wrap: break-word;
	color: currentColor;
	margin: 8px 0;
}
.text-side {
	font-family: "Sarabun";
  	border-radius: 6px;
  	text-align: center;
	padding: 0 15px;
	margin: 95px auto 0 auto;
}
.text-side span {
	font-size: 18px;
	line-height: 18px;
	font-family: "Kanit";
	text-align: center;
}
.text-side p {
	font-size: 15px;
	text-align: start;
	margin-bottom: 8px;
}
.text-side strong {
	font-size: 17px;
}
.text-side p:last-child {
	margin-bottom: 10px !important;
}
	

	
/* -----------------------------------
		  Confirm Form CSS
----------------------------------- */
.confirm-form { 
	padding: 0 0 30px 0;
}
.confirm-form .border {
	border: 1px solid #252525 !important;
}
.confirm-form legend {
    color: currentColor;
    padding: 5px 10px !important;
	border-radius: 30px;
}
.confirm-form .form-label  {
	margin: 0;
	color: currentColor;
}
.confirm-form .form-check-inline {
    width: auto;
	margin-left: 10px;
}
.confirm-form .col-md-4 img {
	margin-top: 20px;
}
.confirm-form input.form-control placeholder {
	color: #ccc !important;
}
.confirm-form .input-group-append {
	cursor: pointer;
}
.colorfuldmn-img {
	display: block;
	margin: 0 auto 15px auto;
}
@media (max-width: 767px){
	.confirm-form legend {
		text-align: center;
	}
	.confirm-form .row .col-md-6 img {
		display: none;
	}
	.colorfuldmn-img {
		margin: 15px auto 0 auto !important;
	}
}


	
/* -----------------------------------
	    Date & Time Picker CSS
----------------------------------- */
.datetimepicker,
.persontype-phone { }

.datetimepicker .input-group-addon {
  	cursor: pointer;
}
.datetimepicker i.input-group-text {
	line-height: 1.5;
}
.datepicker-controls .view-switch {
  	color: #2569d9 !important;
}
.datepicker-view .dow {
	color: dodgerblue !important;
}


	
/* -----------------------------------
	  Invoice Accept or Not  CSS
----------------------------------- */
.radio-title {
	display: inline-block;
	width: auto !important;
	font-size: 18px;
	margin-bottom: 15px;
}
@media (max-width: 767px){
	.radio-title {
		width: 100% !important;
		margin: 0 !important;
	}
}


	
/* ----------------------------------------
      Details Confirm payment Table CSS
---------------------------------------- */
.confirmDetails-area { }
.confirm-paymentDetails {
	margin: 20px 0 0 0;
}
.confirm-paymentDetails table tbody td {
	color: currentColor;
	vertical-align: middle;
}
.confirm-paymentDetails table tbody td:first-child {
	text-align: end;
	width: 35%;
}
.confirm-paymentDetails table tbody td:last-child {
	width: 65%;
}

.txt-prt {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 15px;
}
.txt-prt h5 {
	color: #2569d9;
	line-height: 2.5;
	margin-bottom: 0;
}
.btn-outline-print {
	color: #2569d9;
	border: 1px solid #2569d9;
	border-radius: 10px;
	background: none;
}
.btn-outline-print:hover,
.btn-outline-print:focus {
  	background-color: #2569d9;
	color: white;
	outline: none;
}

@media (max-width: 767px){
	.confirm-paymentDetails {
  		margin: 0;
	}
	.confirm-paymentDetails .row {
		flex-direction: column-reverse;
	}
	.txt-prt h5 {
  		width: 100% !important;
  		text-align: center;
	}
	.btn-outline-print {
		width: 50% !important;
		padding: 10px 15px;
		margin: 0 auto;
		border-radius: 30px;
	}
	.confirm-paymentDetails table tbody td:first-child,
	.confirm-paymentDetails table tbody td:last-child {
		display: block;
		width: 100% !important;
		text-align: start;
	}
	.confirm-paymentDetails table tbody td:first-child {
		padding: 15px 0 3px 0;
		font-family: "Kanit";
		font-size: 18px;
		letter-spacing: .3px;
	}
	.confirm-paymentDetails table tbody td:last-child {
		color: #2569d9;
		font-weight: 500;
		padding: 0 0 15px 0;
		border-bottom: 1px dashed #ccc;
	}
	.btn-outline-print {
		font-size: 18px;
		border: 2px solid #2569d9;
	}
	.confirm-paymentDetails .col-lg-4 .img-fluid {
		display: block;
		width: 55%;
		margin: 30px auto 40px auto !important;
	}
	.confirm-paymentDetails .-sarabun p {
		font-size: 14px;
		color: midnightblue;
	}
	.confirm-paymentDetails .-sarabun img {
		width: 110px;
	}
}
@media (max-width: 991px){
	.cofirmDetails-area .section-heading p > br {
		display: none;
	}
}
@media (min-width: 768px) and (max-width: 991px) {
	.confirm-paymentDetails .col-lg-4 {
		display: none;
	}
}


