@import url(../resources/css/krungsri-simple.css);

body  {
    background: #fff url(../images/frontend/debut_light.png) repeat left top;
    color: #6f5e5d;
    font-family: "krungsri_simple", sans-serif !important;
}
a			{ color: #fed401; }
a img		{ outline: 0; border: none; }
.wrapper	{ width: 960px; }

/* Header */
#header		{ border-top: 30px solid #fed401; }
.krungsri-logo		{ position: relative; top: -30px; float: left; margin-right: 20px; }
.krungsri-header	{ float: left;  }
.krungsri-header h1			{ font-weight: 300; font-size: 28px; font-family: "krungsri_simple", sans-serif; line-height: 1.1; }
.krungsri-header h1 span	{ display: block; font-weight: lighter; font-size: 18px; }
.slogan		{ float: right; margin: 10px 0; }
.slogan h3	{ margin: 5px 0; padding: 5px 0; border-top: 2px solid #fed401; border-bottom: 2px solid #fed401; font-weight: lighter; font-weight: 300; font-size: 16px; font-family: "krungsri_simple", sans-serif; line-height: 1.4; }
.lang       { position: relative; left:210px; top:-27px;}
.lang a     { margin-left: 5px;}

/* Content */
.main-content	{ padding: 20px 80px; border-top: 1px solid #6f5e5d; }
.instruction	{ text-align: center; }
.instruction h3	{ font-size: 20px; margin-bottom: -10px;}
.content-wrapper	{ position: relative; margin: 0 0 20px; padding: 30px; border-radius: 8px; background-color: #fff; box-shadow: 0 2px 2px rgba(0,0,0,0.25); }

/* Progress */
.payment-progress		{ margin: 30px 0; padding: 15px 20px; border-radius: 8px; background-color: #fff; box-shadow: 0 2px 2px rgba(0,0,0,0.25); }
.payment-progress ul	{ overflow: hidden; margin: 0; padding: 0; list-style: none; }
.payment-progress li	{ float: left; width: 245px; height: 38px; text-align: center; line-height: 38px; }
.payment-progress a		{ display: block; padding-right: 32px; background: #b7afaf url(../images/frontend/progress-none.png) no-repeat right top; color: #6f5e5d; }
.current-step a			{ font-weight: bold; }

.step-3 a				{ background-image: url(../images/frontend/progress-none-end.png); }

.at-step-1 .step-1 a,
.at-step-2 .step-2 a	{ background-color: #fed401; background-image: url(../images/frontend/progress-active-before.png); }
.at-step-3 .step-3 a	{ background-color: #fed401; background-image: url(../images/frontend/progress-active-end.png); }

.at-step-2 .step-1 a,
.at-step-3 .step-1 a,
.at-step-3 .step-2 a	{ background-color: #fed401; background-image: url(../images/frontend/progress-active-both.png); }


/* Payment Information */
.payment-info-list			{ margin: 20px 0; padding-left: 80px; list-style: none; }
.payment-info-list li		{ margin: 10px 0; font-size: 14px; }
.lt-ie8 .payment-info-list li	{ overflow: hidden; }
.payment-info-list li h4	{ display: inline; float: left; margin: 0; width: 240px; font-weight: normal; font-size: 14px; }
.payment-info-list li .field-info			{ display: block; margin-left: 240px; }
.lt-ie8 .payment-info-list li .field-info	{ float: left; margin: 0; }

/* Form */
form					{ margin: 0; padding: 0 50px; }
label,
.field-input			{ display: table-cell; vertical-align: middle; }

.lt-ie8 label			{ float: left; }
.lt-ie8 .field-input	{ display: block; overflow: hidden; }

.field-input img		{ width: 32px !important; height: 32px !important; vertical-align: middle; opacity: 0.25; }
.lt-ie9 .field-input img	{ filter: alpha(opacity=25); }

label					{ width: 180px; font-weight: 400; }
.required-field:after	{ margin-left: 5px; color: #e00; content: "\2A"; }
.form-notice			{ color: #e00; font-weight: bold; font-size: 11px; }
input[type="text"]		{ margin-right: 5px; margin-bottom: 0; width: auto; height: 20px; border-radius: 0px; line-height: 20px; }
input[type="checkbox"]	{ margin: 0 5px; }
.cc-number input		{ width: 60px; text-align: center; }
#cc-security-num		{ width: 40px; text-align: center; }
.month-selectbox,
.year-selectbox	{ margin-right: 5px; width: 80px; height: 25px; line-height: 25px; }
#cc-limit		{ width: 100px; }
.remark			{ position: relative; padding-left: 60px; font-size: 12px; }
.remark strong	{ position: absolute; top: 0; left: 0; }
.btn			{ width: 160px !important; color: #6f5e5d; font-weight: bold;     border: 1px solid;}
.lt-ie10 .btn	{
	border: 1px solid #e6e6e6;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e6e6e6',GradientType=0 );
}
.lt-ie8 .btn	{ padding: 4px 0 !important; }

.cc-control .continue-btn	{ border: 1px solid #dfc542; 
	background: #fef0aa;
	background: -moz-linear-gradient(top,  #fef0aa 0%, #fed401 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fef0aa), color-stop(100%,#fed401));
	background: -webkit-linear-gradient(top,  #fef0aa 0%,#fed401 100%);
	background: -o-linear-gradient(top,  #fef0aa 0%,#fed401 100%);
	background: -ms-linear-gradient(top,  #fef0aa 0%,#fed401 100%);
	background: linear-gradient(to bottom,  #fef0aa 0%,#fed401 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fef0aa', endColorstr='#fed401',GradientType=0 );
}
.continue-btn.continue-btn-disable {
	border: none;
	background: none;
	background-color: #DCDEDC;
	color: #FFF;
	pointer-events: none;
}

.request-opt-btn.btn-msp-disable {
	border: none;
	background: none;
	color: #6f5e5d;
	pointer-events: none;
}

/* Register Form */
.register-form h3				{ font-style: italic; font-size: 18px; font-family: "krungsri_simple", sans-serif; }
.register-form h4				{ padding: 10px 0; border-top: 1px solid #ccc; }
.register-form label			{ padding-right: 20px; width: 220px; text-align: right; font-size: 12px; }
.register-form .field-input		{ font-size: 12px; }
#card-idtype			{ height: 25px; line-height: 25px; }
.birth-date img			{ width: 32px; height: 32px; cursor: pointer; }
.birth-date img:hover	{ opacity: 0.75; }
.lt-ie9 .birth-date img:hover		{ filter: alpha(opacity=75); }

.register-form .cc-control		{ padding-top: 10px; border-top: 1px solid #ccc; }

.ui-datepicker			{ padding: 10px; border: 1px solid #ccc; background-color: #fff; box-shadow: 0 4px 8px rgba(0,0,0,0.2); font-size: 12px; }
.lt-ie8 .ui-datepicker	{ width: 240px; }

.ui-datepicker-prev,
.ui-datepicker-next		{ padding: 0 8px; border-radius: 24px; background-color: #fed401; color: #fff; text-transform: uppercase; font-weight: bold; font-size: 10px; cursor: pointer; }
.ui-datepicker-prev		{ float: left; }
.ui-datepicker-next		{ float: right; }
.ui-datepicker-title	{ clear: both; text-align: center; font-weight: bold; }
.ui-datepicker-calendar		{ width: 100%; }
.ui-datepicker-calendar th		{ padding: 4px 8px; text-align: center; }
.ui-datepicker-calendar td		{ border: 1px solid #cfcfcf; text-align: right; }
.ui-datepicker-calendar td a	{ display: block; padding: 4px 8px; color: #6f5e5d; }
.ui-datepicker-calendar td a:hover	{ background-color: #eee; }
.ui-state-highlight		{ background-color: #b7afaf; font-weight: bold; }
.ui-state-active		{ background-color: #fed401; font-weight: bold; }

/* Terms and Condictions */
.term-content ul			{ margin-bottom: 30px; margin-right: 25px; text-align: justify;}
.term-content li			{ margin: 5px 0; }
.term-content .cc-control	{ margin: 0; text-align: center; }

/* Payment Verify */
.verify-smsotp	{ margin-bottom: 20px; }
.otp-mobile		{ padding: 20px 0; border-top: 1px solid #cfcfcf; font-size: 12px; }
.verify-smsotp .cc-control	{ margin: 0; text-align: center; }

/* Summary */
.success-content	{ background: #fff url(../images/frontend/krungsri-masthead.png) no-repeat right top; }
.contact-info		{ margin-bottom: 20px; padding-top: 20px; width: 320px; }
.contact-info h2,
.contact-info h3	{ margin: 10px 0; font-size: 18px; line-height: 1.1; }
.info-section		{ padding: 10px 0; border-top: 2px dashed #6f5e5d;  }
.info-section li.mkt { list-style: none;}
.info-section table	{ margin-bottom: 10px; width: 100%; }
.info-section td	{ line-height: 2.2; }

#general-info td			{ font-size: 16px; }
#general-info td:last-child	{ text-align: right; }

#card-payment-info td	{ vertical-align: top; font-weight: bold; font-size: 18px; }
#card-payment-info ul	{ margin: 0; padding: 0; list-style: none; font-size: 14px; }
#card-payment-info li	{ margin-bottom: 10px; }
#card-payment-info td:last-child	{ text-align: right; }
.payinfo-total td	{ font-size: 28px !important; }
.payinfo-value		{ font-weight: normal; }

#aycap,
#acknowledgement	{ text-align: center; text-transform: uppercase; }
#aycap				{ font-weight: bold; }
.success-content .cc-control	{ margin: 30px 0 10px; text-align: center; }
.payment-success	{ margin-bottom: 40px; }
.payment-success .content-wrapper	{ border-radius: 8px 8px 0 0; }
.payment-success .zigzag			{ position: absolute; bottom: -15px; left: -1px; width: 100%; height: 30px; border-right: 1px solid #ddd; border-left: 1px solid #ddd; background: transparent url(../images/frontend/zigzag.png) repeat-x left top;}

.lt-ie8 .payment-success .zigzag	{ border: none; }

/* Footer */
#footer		{ padding: 10px 0; background-color: #6f5e5d; color: #fff; font-size: 12px; }

.table-center{
	width: 60% !important;
    margin-left: 40% !important;
    margin-right: 0% !important;
}