@charset "utf-8";
/* CSS Document */

@font-face {
  font-family:'FZUPBS';
  src:url('../fonts/FZUPBS.eot?r=2');
  src:url('../fonts/FZUPBS.eot?r=2#iefix') format('embedded-opentype'),
       url('../fonts/FZUPBS.woff?r=2') format('woff'),
       url('../fonts/FZUPBS.ttf?r=2')  format('truetype'),
       url('../fonts/FZUPBS.svg?r=2') format('svg'); font-weight:normal; font-style:normal;
}

body, html { font-family:"Arial"; color:#4A4A4A; background-color:#f3f3f3; font-size:16px; line-height:21px; }

H1, H2, .btn { font-family:"FZUPBS"; }

H2 { font-size:40px; text-align:left; margin-top:0px;}
H3 { font-size:18px; text-align:left; line-height:24px; }
p { margin:15px 0px 5px 0px; }

H1, H2, H3 { margin-top:0px; }

H3 { margin-bottom: 20px; }

.h10 { height:10px; }
.h20 { height:20px; }

.space { clear:both; line-height:0px; height:0px; width:100%; }
.space5 { clear:both; line-height:0px; height:5px; width:100%; }
.space10 { clear:both; line-height:0px; height:10px; width:100%; }
.space15 { clear:both; line-height:0px; height:15px; width:100%; }
.space20 { clear:both; line-height:0px; height:20px; width:100%; }
.space25 { clear:both; line-height:0px; height:25px; width:100%; }
.space30 { clear:both; line-height:0px; height:30px; width:100%; }
.space35 { clear:both; line-height:0px; height:35px; width:100%; }
.space40 { clear:both; line-height:0px; height:40px; width:100%; }
.space45 { clear:both; line-height:0px; height:35px; width:100%; }
.space50 { clear:both; line-height:0px; height:40px; width:100%; }
.space55 { clear:both; line-height:0px; height:35px; width:100%; }
.space60 { clear:both; line-height:0px; height:40px; width:100%; }

.nobr { white-space:nowrap; }

.header { width:100%; height:95px; background-color:#1F5199; color:#ffffff; font-size:16px; line-height:21px; z-index:50; }
.header .logo_bar { max-width:1080px; padding:0px 15px;}
.footer .footer_inner { max-width:1340px; }

.header .logo_bar { position:relative; width:100%; margin:0px auto;}
.header .logo { float:left; background-image:url(../img/logo_800.png); background-size:100%; background-repeat:no-repeat; height:66px; width:106px; margin-top:15px; margin-right:15px; -ms-interpolation-mode: bicubic; cursor: pointer; }

#language_button { display:block; position:absolute; top:36px; right:0px; margin:0px; padding:0px;}
#language_button ul { margin:0px; padding:0px; }
#language_button li { float:left; padding:0px; list-style:none; margin:0px; height:20px; color:#FFFFFF; border-right:1px solid #FFFFFF; line-height:20px; text-align:center; width:50px; cursor:pointer; }
#language_button li a { color:#FFFFFF; }
#language_button li:last-child, #language_button li:last-child a { border-right:0px; }
#language_button li.tc { font-family:'\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', '\5FAE\8F6F\96C5\9ED1\4F53', 'Microsoft YaHei', Arial !important; }
#language_button li.sc { font-family:'\5FAE\8F6F\96C5\9ED1\4F53', 'Microsoft YaHei', '\5FAE\8EDF\6B63\9ED1\9AD4', 'Microsoft JhengHei', Arial !important; }

.main_visual_frame { position:relative; width:100%; max-height:455px; height:auto; background-image:url(../img/kv.png); background-size:cover; background-position:center; background-repeat:no-repeat; overflow: hidden;}
.main_visual_frame img.kv_area { width:100%; height:auto; max-height:455px; }
.main_visual_frame img.kv_area.desktop { display:block; }
.main_visual_frame img.kv_area.mobile { display:none; }
.main_visual_frame .title_frame { position:absolute; width:90%; height:100%; position:relative; max-width:1110px; margin:0px auto; z-index:1000;}
.main_visual_frame .title { position:absolute; top:10%; left:1%; width:50%; font-family:"FZUPBS"; color:#FFFFFF; font-size:40px; line-height:46px; text-shadow:0px 0px 12px rgba(0,0,0,0.64); -webkit-text-shadow:0px 0px 12px rgba(0,0,0,0.64); -moz-text-shadow:0px 0px 12px rgba(0,0,0,0.64); -ms-text-shadow:0px 0px 12px rgba(0,0,0,0.64);}
.main_visual_frame .card { position:absolute; top:-24%; right:-7%; width:52%; }
.main_visual_frame .card img { width:100%; height:auto; }

.content_frame { display: table; position:relative; top:-40px; max-width:1110px; width:100%; min-height:410px; padding:55px 65px; margin:0px auto; background-color:#FFFFFF; }
.content_frame.info_page { position:relative; top:0px; max-width:1110px; width:100%; min-height:410px; padding:40px 65px; margin:60px auto 60px auto; background-color:#FFFFFF; }
.intro_box { box-sizing: border-box; float:left; width:50%; padding-right:30px; text-align:left; }
.reward_quota { color:#1E5199; font-size:18px; font-weight:bold; line-height:21px; margin-top:40px; }

.form-control { height:50px; width:100%; border:1px solid #D0D0D0; background-color:#FFFFFF; color:#4A4A4A; font-size:16px; line-height:21px;}
.form-group { height:50px; margin-bottom:20px; }
.login_box { box-sizing: border-box; float:left; width:50%; padding-left:30px; border-left:1px solid #cacaca; }
#loginForm { margin:0px auto; width:380px; }
#registerEmailForm { margin:0px auto; width:380px; }
#addCardBinFencingForm { margin:0px auto; width:380px; }
#addCardForm { margin:20px auto; }
#cardTokeniserIframeContainer { margin:0px auto; width:380px; }
.login_box .form-group { height:50px; margin-bottom:20px; }

.form-control.country_code { width:25%; margin-right:5%; float:left; }
.form-control.mobile_number { width:70%;  float:left;  }


.footer { position:relative; border-top:0px; font-family:Arial; font-size:13px; line-height:16px; color:#ffffff; height:104px; width:100%; background-color:#4A4A4A; padding:40px 20px; }
.footer .footer_inner { width:100%; height:16px; margin:0px auto; }
.footer_link { float:left; }
.footer_link a:link, .footer_link a:visited, .footer_link a:hover { color:#ffffff; }
.footer_copyright { float:right; }
.footer_lounge_key { float:right; position:relative; top:-13px; width:131px; height:48px; background-image:url(../img/loungekey.png); background-size:100%; background-repeat:no-repeat; margin-left:20px; }



.btn { float:left; height:50px; font-size:16px; font-weight:400; border:0px; border-radius:0px; padding: 6px 20px;}
.btn:hover { border:0px; }
.btn-default { background-color:#A3A3A3!important; color:#FFFFFF; }
.btn-primary { background-color:#1E5199!important; color:#FFFFFF; }
.btn-warning { background-color:#008089!important; color:#FFFFFF; }
.btn-danger { background-color:#DF3232!important; color:#FFFFFF; }
.btn-w-m { margin-right:1%; display:table-cell; width:32%; }
.btn-w-m:last-child { margin-right:0%; }

.btn-search { background-color:#424242!important; color:#FFFFFF; height:35px!important; max-width:150px; font-weight:normal; }
.btn-search:hover { color:#CCCCCC!important; }
.btn-search:visited { color:#CCCCCC!important; }

.button_group.nofloat .btn { width:100%; float:none; margin-bottom:20px; display: block; }

.button_group.btn3 .btn-w-m { margin-right:2%; display:table-cell; width:32%; }
.button_group.btn2 .btn-w-m { margin-right:3%; display:table-cell; width:48%; }
.button_group.btn1 .btn-w-m { margin-right:0%; display:table-cell; width:100%; }

.button_group.btn2 .btn-w-m.pull-right { margin-right: 0%; }

/*.button_group.btn3 { width:90%; display:block; padding:20px 0px; margin:0px auto; }
.button_group.btn2 { width:60%; display:block; padding:20px 0px; margin:0px auto; }
.button_group.btn1 { width:30%; display:block; padding:20px 0px; margin:0px auto; }*/

.button_group.w90p { width:90%; display:block; padding:20px 0px; margin:0px auto; }
.button_group.w60p { width:60%; display:block; padding:20px 0px; margin:0px auto; }
.button_group.w30p { width:30%; display:block; padding:20px 0px; margin:0px auto; }

.button_group .btn-w-m:last-child { margin-right:0%; }


.form-control { height:50px; }
.form-control:focus { border-color:#286090; }

.form-control.add_card { float:left; width:60%; }
#btn_addcard { float:right; width:40%; }
.btn_upload_doc { float:right!important; width:40%; padding: 6px 10px;}


#captcha_element { margin-bottom:20px; }


.table_frame { width:100%; margin-top:30px; min-height:360px; background-color:#ffffff; padding-bottom:25px; }

.tabs-container .nav-tabs { display:table; font-size:16px; line-height:50px; height:50px; width:100%; background-color: #EBEBEB; color: #4A4A4A; border-bottom:0px solid #FFFFFF; }
.tabs-container .nav-tabs > li { float:left; display:table-cell; height:50px; white-space:nowrap; text-align:center; cursor:pointer; border-right:0px solid #FFFFFF; margin-bottom:0px;}
.tabs-container .nav-tabs.col50 > li { width:50%; }
.tabs-container .nav-tabs.col25 > li { width:25%; }

.tabs-container .nav-tabs > li:last-child { border-right:0px;}
.tabs-container .nav-tabs > li.active > a, .tabs-container .nav-tabs > li.active > a:hover, .tabs-container .nav-tabs > li.active > a:focus { border:1px solid #D5D5D5; border-bottom-color:transparent; margin:0px; border-radius:0px 0px 0 0; }
.nav-tabs > li > a { color: #4A4A4A; font-weight:bold; padding: 10px 10px 10px 10px; line-height:29px; margin:0px; border:0px;}

.tabs-container .nav-tabs span.remarks { font-size:14px; font-weight:normal; }

.tab-content { border:1px solid #D5D5D5; padding:20px; }

/* document approval */
.doc_check { float:left; width:50%; }

.table { font-size:14px;}
.table > thead { background-color:#ffffff; border-bottom:1px solid #C5C5C5; }
.table > thead > tr > th, .table > thead > tr > td { height:50px; vertical-align:middle; padding:8px 10px; border-bottom:1px solid #C5C5C5; }
.table > thead > tr > th:first-child, .table > thead > tr > td:first-child, .table > tbody > tr > th:first-child, .table > tfoot > tr > th:first-child, .table > tbody > tr > td:first-child, .table > tfoot > tr > td:first-child { padding:8px 10px 8px 30px; }
.table > thead > tr > th:last-child, .table > thead > tr > td:last-child, .table > tbody > tr > th:last-child, .table > tfoot > tr > th:last-child, .table > tbody > tr > td:last-child, .table > tfoot > tr > td:last-child { padding:8px 30px 8px 10px; }

.table > tbody > tr > th, .table > tfoot > tr > th, .table > tbody > tr > td, .table > tfoot > tr > td { height:60px; vertical-align:middle; padding:8px 10px; border-bottom:1px solid #C5C5C5; }
.table-hover > tbody > tr > th, .table-hover > tfoot > tr > th, .table-hover > tbody > tr > td, .table-hover > tfoot > tr > td { cursor:pointer; }
.table > tbody { background-color:#ffffff; border-bottom:1px solid #C5C5C5; }

.table .highlight { color:#72BAD7; font-weight:bold; }
.res_table td span.res_label { display:none; }


.doc_frame { display:table; width:100%; margin:0px auto; }
.doc_image { float:left; height:inherit; background-color:#ffffff; margin-right:6%; width:45%; text-align:center; display: inline-block;}
.doc_details { font-size:16px; float:left; position:relative; height:inherit; width:100%; margin-top:10px; }
.doc_details.right { width:49%; margin-top:0px; }
.doc_details H3 { margin-bottom:20px; }
.doc_image img { width:90%; max-width:320px; height:auto; }
.details_row { display:inline-block; width: 100%; margin-bottom:15px; }

.details_row span { display:inherit; margin-right:15px; }
.details_row span.details_label { display:inline-block; display:inherit; width:170px; vertical-align: top; }
.details_row span.details_content { display:inline-block; display:inherit; vertical-align: top;}
/*.details_row span.card_num { height:50px; line-height:50px; width:145px; margin-right:0px; }	*/
.details_row span.card_achieved { text-align: right; color:#1E5199; font-size: 18px; font-weight: bold; margin-right:0px; float:right; }
.details_row span.lounge-key-activate-date { text-align: right; margin-right:0px; float:right; font-size: 14px; margin-top: 4px; clear: right; }

.doc_details.card_info { width:inherit; float:right; }
.doc_details.card_info .details_row { font-size: 14px;  margin-bottom: 0px; width:auto; }
.doc_details.card_info .details_content { margin-right:0px; }

.details_row.card_info { padding-bottom:15px; border-bottom: 1px solid #cacaca; }
.card_upload { font-size:14px; float:left; position:relative; height:inherit; width:180px; margin-top:0px; }
.card_upload_row { display:inline-block; width:100%; margin-bottom:0px; margin-right:0px; }
.card_upload_row span { display:inherit; margin-right:10px; }
.card_upload_row span.card_num { font-size:16px; margin-bottom:5px; }
.card_upload_row span.card_upload_label { display:inline-block; display:inherit; width:130px; vertical-align: top; }
.card_upload_row span.card_upload_content { display:inline-block; display:inherit; vertical-align: top; margin-right:0px; font-weight:bold; width:30px; text-align:right; }

#btn_check_history { width:180px; margin:15px 0px; }
#btn_logout { width:180px; margin:15px 0 0 25px; }

.security_form { width:480px; margin:0px auto; padding:20px 0px; }
.security_form .error_box .help-block { text-align: center; }
.security_form .button_group { margin-bottom:20px; min-height: 50px; }

.myCheck { display:inline-block; max-width:100%; margin-bottom:5px; font-weight:normal; cursor:pointer; }
.myCheck input { display:none; }
.myCheck span.details_input { margin-right:15px; width:20px; height:20px; background-size:20px 20px; background-repeat:no-repeat; background-position:0px 0px; background-image:url(../img/check.png); vertical-align:top; display:inline-block; }
.myCheck input:checked + span.details_input { background-image:url(../img/check_v.png); }

.myCheck { display:inline-block; max-width:100%; margin-bottom:5px; font-weight:normal; cursor:pointer; }
.myCheck input { display:none; }
.myCheck span.details_input { margin-right:15px; width:20px; height:20px; background-size:20px 20px; background-repeat:no-repeat; background-position:0px 0px; background-image:url(../img/check.png); vertical-align:top; display:inline-block; }
.myCheck_x input:checked + span.details_input { background-image:url(../img/check_x.png); }

.alert_duplicated, .error_container { color:#D0021B; font-size:14px; font-weight:bold; }
.alert_duplicated a { color:#D0021B; text-decoration:underline; }

.check_col { width:20px; box-sizing: content-box; padding: 0px 0px 0px 20px!important; }
.check_col .myCheck span.details_input { margin-right:0px; margin-top:4px; }
.receipt_col { width:23px; }

.search_row { padding:0px 0px 30px 0px; }
.search_row .form-control { font-weight:bold; margin-right:10px; }
.search_row .search_row_text { height:35px; line-height:35px; display:inline-block; margin-right:10px; }
.search_row .search_row_text.bold { font-weight:bold; }
.search_row .search_row_text.seperator { display:inline; padding-left:10px; margin-right:20px; border-right:1px solid #cccccc; }

.instructions { font-size:14px; font-weight:bold; margin:0px 20px; margin-bottom:15px; line-height:20px; vertical-align:middle; }
.icon_email { background-image:url(../img/icon_email.png); background-size:auto 20px; padding-left:48px; background-position:left top; background-repeat:no-repeat; margin-right:15px;}
.icon_view { background-image:url(../img/icon_view.png); background-size:auto 20px; padding-left:39px; background-position:left top; background-repeat:no-repeat; margin-right:15px;}
.icon_receipt { background-image:url(../img/icon_receipt.png); background-size:auto 20px; padding-left:36px; background-position:left top; background-repeat:no-repeat; margin-right:15px;}
.icon_view_receipt { display:block; background-image:url(../img/icon_view_receipt.svg); background-size:23px 30px; width:23px; height:30px; background-position:left top; background-repeat:no-repeat; cursor:pointer; }


.msg_overlay { display:none; position:fixed; z-index:120; height:100%; width:100%; background-color:rgba(0,0,0,0.7); cursor:pointer; }

.alert_box { display:none; z-index:150; background-color:#ffffff; position:fixed; padding:40px 0px 20px 0px; }
.alert_box .msg_title { color:#525155!important; font-family:'gotham-medium', Arial !important; font-size:24px; line-height:35px; margin:0px auto 10px auto;}
.alert_box .msg_content {  font-size:20px; line-height:35px; }
.alert_box .button.left { float:left; width:45%; margin-right:10%; }
.alert_box .button.right { float:right; width:45%; }

.btn_close_x { position:absolute; right:20px; top:20px; width:34px; height:34px; opacity:0.3; cursor:pointer; }
.btn_close_x:hover { opacity:1; }
.btn_close_x:before, .btn_close_x:after { position:absolute; left:15px; content:' '; height:33px; width:2px; background-color:#333; }
.btn_close_x:before { transform:rotate(45deg); }
.btn_close_x:after { transform:rotate(-45deg); }

#overlay_document { width:100%; height:100%; margin:0px auto; padding:0px 0px 0px 0px; text-align: center; background-color:transparent; }
#overlay_document img { width:auto; height:90%; margin-top:2.5%; }
/*#overlay_document .document_preview { display:table-cell; height:100%; }
#overlay_document .document_preview img { width:auto; height:100%; }*/


.document_tab { display:table; width:100%; height:auto; background-color:#008089;  }
.document_tab .document_type { float:left; width:40%; color:#ffffff; padding:15px 10px 15px 20px; font-size:18px; }
.document_tab .approved_balance { float:left; width:60%; color:#ffffff; padding:15px 20px 15px 0px; text-align:right; }
.document_tab .approved_balance .balance { font-weight:bold; }

/* Form Login */
.help-block { color:#ff0000; text-align:left; margin-top:0px; margin-bottom:5px;}

.search_row .search_error { padding-top:5px;}
.search_row .help-block { margin-bottom:0px; }

#merge_confirm { display:none; }
#merge_confirm_email { display:none; }
#merge_confirm_mobile { display:none; }

#swal2-title { font-size:26px; font-weight:normal; }
#swal2-content { width:100%; margin:0px auto; }
#swal2-content .doc_details { width:70%; text-align:left; margin:10px auto 0px auto; float:none; }
#swal2-content .doc_details .details_label { width:38%; margin-right:3%;}
#swal2-content .doc_details .details_content { width:57%; margin-right:0px; }
#swal2-content p { font-size:16px; }

.form-control.help-block { margin-bottom:0px; }

.congrat { padding:40px 30px 60px 30px; }
.congrat_box { text-align: center; }
.congrat_box .icon_congrat { background-image:url(../img/icon_congrats.png); background-size:100% 100%; background-repeat:no-repeat; height:89px; width:89px; margin:0px auto; }
.congrat_box .icon_thankyou { background-image:url(../img/icon_thankyou.png); background-size:100% 100%; background-repeat:no-repeat; height:101px; width:106px; margin:0px auto; }
.congrat_box .title { font-family:"FZUPBS"; font-size:36px; line-height:48px; margin:10px auto; }
.congrat_box .content { font-size:16px; line-height:32px; margin:20px auto; width:100%; max-width:760px; }
.congrat_box p { margin:0px auto 0px auto; }
.congrat_box .highlight { color:#1E5199; }
.congrat_box .big { font-size:30px; line-height:48px; }
#btn_continue { float:none; width:270px; margin:10px auto; }

.congrat_box .balance { font-family:"FZUPBS"; font-size:26px; line-height:40px; }
.congrat_box .button_group { height:50px; margin:25px auto; display: table; }
.congrat_box .balance_type { display:inline; }

/* upload document */
#form_upload_document .form-group { width: 100%; margin-bottom: 20px; /*display: block;*/ display: inline-table;}
#form_upload_document #statement_date, #form_upload_document #transaction_date, #form_upload_document #transaction_time{width:100%;}

.upload_doucment_error_container{ line-height: 18px; font-size: 16px;  color: #ff0000; font-weight: normal;}

.dropzone { min-height: 140px; border: 2px dashed #BABABA;; background: white; padding: 20px 20px; border-radius:10px;  }
#dropzoneForm .dz-message { text-align: center; }

.dropzone.dz-started .dz-message { /*opacity: 0;*/ display:none; }
.upload_container{ display: table-cell; width: 100%; height: 400px; padding: 0px 10% 0px 10%; line-height: 20px; font-weight: bold; vertical-align: middle; }
.upload_container div { font-size:18px; line-height:23px; padding-top:20px; }
.doc_image img.icon_upload{ width:86px; height:86px; }
.input-group.date { width:100%; }
.input-group.clockpicker { width: 100%; margin-bottom:0px; }
.form-amount { width:100%; display:inline-block; }
div#imageid-error{ float:left; padding:0px; margin-bottom: 0px; position: relative; top:8px; line-height: 18px; }
#form_upload_document div.help-block { float:left; padding:0px; margin-bottom: 0px; position: relative; top:8px; line-height: 18px; }

.dz-image img { width:100%; height:auto; max-width:inherit; }

.dz-preview { position:relative; }
.dz-remove { opacity:0; text-indent: -9999px; position:absolute; width:100%; height:100%;/*margin-top:-100px; margin-left:-100px; width:200px; height:200px;*/ top:0px; left:0px; background-color: rgba(0,0,0, 0.5); }
.dz-preview:hover .dz-remove { opacity:0.5; }
.dz-remove:before, .dz-remove:after { position:absolute; top:50%; left:50%; margin-top:-75px; margin-left:-12px; content:' '; height:150px; width:25px; background-color:#ffffff; border-radius:25px;  }
.dz-remove:before { transform:rotate(45deg); }
.dz-remove:after { transform:rotate(-45deg); }



@media handheld, screen and (max-width:1200px) {

H2 { font-size:30px; }
H3 { font-size:16px; line-height: 20px; }

.header .logo_bar { max-width: 1080px; padding: 0px 25px; }
#language_button { right: 20px; }
.main_visual_frame .title { width:60%; font-size: 36px; line-height: 44px; }
.main_visual_frame .card { top:-15%; right:-2%; width:45%; }
#loginForm { width:100%; }
#registerEmailForm { width:100%; }
#cardTokeniserIframeContainer { width:100%; }
#addCardForm { width:100%; }
.content_frame { width: 90%; padding:40px 5%;}
.content_frame.info_page { width: 90%; padding:40px 5%;}

.doc_image { margin-right:6%; width:47%;}
.doc_details { width:100%; }
.doc_details.right { width: 47%; margin-top:0px; }

.security_form { width:100%; margin:0px auto; padding:0px 0px; }
.security_form H3 { text-align: left; }

}

@media handheld, screen and (max-width:1024px) {

#btn_check_history { width:100%; margin:15px 0px; }
#btn_logout { width:100%; margin:0px; }

}

@media handheld, screen and (max-width:960px) {

.card_upload { }
.btn_upload_doc { float:none; width:100%; margin-top:10px; }


}



@media handheld, screen and (max-width:860px) {

body { font-size:14px; }
H2 { font-size:24px; }
H3 { font-size:14px; line-height: 18px; }

.header { height: 70px; font-size: 14px;}
.header .logo { height: 48px; width: 77px; margin-top: 11px; }
.header .logo_bar { padding: 0px 25px; }
#language_button { right: 20px; top:24px; }
#language_button li { width: 40px; }
.main_visual_frame .title { width: 75%; font-size: 28px; line-height: 36px; }
.main_visual_frame .card { top:-15%; right:-2%; width:45%; }

.reward_quota { font-size:14px; line-height:18px; }

.footer { padding: 15px 20px; display: table; }
.footer .footer_inner { height:inherit; display: table;}
.footer_link { float:none; margin:0px auto; text-align: center; padding:10px; }
.footer_copyright { float:none; margin:0px auto; text-align: center; padding:10px; }
.footer_lounge_key { float:none; width:98px; height:36px; margin:15px auto 0px auto; top:inherit; }

.content_frame { padding:30px 5%; margin:15px auto;}
.content_frame.info_page { padding:30px 5%; margin: 50px auto 50px auto;}

.intro_box { float:none; width:100%; padding-right:0px; }
.login_box { float:none; width:100%; padding-left:0px; border-top:1px solid #cacaca; border-left:0px; margin-top:40px; padding-top:30px; }

.btn { float:none; height:40px; font-size:14px; font-weight:400; border:0px; border-radius:0px;}

.form-control { height:40px; font-size:14px; }
.form-group { height:40px; }
.login_box .form-control { height:40px; font-size:14px; }
.login_box .form-group { height:40px; }

/*.tabs-container .nav-tabs { font-size:14px; line-height:45px; height:45px; }
.tabs-container .nav-tabs > li { height:45px;}	*/
.tabs-container .nav-tabs > li { float: left!important; }
.tabs-container .nav-tabs > li.active > a { border: 1px solid #D5D5D5!important; border-bottom-color: transparent!important;}

.doc_image { float:none; width:100%; }
.doc_details { float:none; width:100%; margin-top:20px; font-size:14px;  }
.doc_details.right { width:100%; margin:30px auto 20px auto;}
.doc_details.info { width:70%; margin:30px auto 20px auto;}
.details_row { margin-bottom:10px; }
.details_row span.details_label { width:45%; margin-right:5%; float:left; }
.details_row span.details_content { width:50%; margin-right:0%;}
.details_row span.card_achieved { font-size: 14px; }

.card_upload { float:left; width:70%; }
.btn_upload_doc { float:right; width:30%; margin-top:0px; }



}


@media handheld, screen and (max-width:640px) {

H2 { font-size:20px; }

.header .logo_bar { padding: 0px 20px; }
#language_button { right: 10px; }

.main_visual_frame img.kv_area.desktop { display:none; }
.main_visual_frame img.kv_area.mobile { display:block; }

.main_visual_frame .title { width:80%; top:6%; font-size: 24px; line-height: 30px; }
.main_visual_frame .card { top:-1%; right:-4%; width: 65%; }

.content_frame { padding:15px 5% 25px 5%;}
.content_frame.info_page { padding:15px 5%; margin: 20px auto 30px auto;}
.table_frame { margin-top: 15px; }

.login_box { margin-top:20px; padding-top:25px; }

.btn { float:none; height:40px; font-size:14px; font-weight:400; border:0px; border-radius:0px;}
.button_group.btn3 .btn-w-m { margin-right:0%; margin-bottom:20px; display:table-cell; width:100%; }
.button_group.btn2 .btn-w-m { margin-right:0%; margin-bottom:20px; display:table-cell; width:100%; }
.button_group.btn1 .btn-w-m { margin-right:0%; margin-bottom:20px; display:table-cell; width:100%; }

.button_group .btn-w-m:last-child { margin-bottom:0px; }
.button_group.w60p { width:100%; display: table; }

.res_table {display:block; border-bottom: 0px; }
.res_table thead { display:none; }
.res_table tbody { display:table-row; border-bottom: 0px;}
.res_table tr { position:relative; padding:15px 10px 5px 40px; display:inline-block; background-color:#f3f3f3; border-bottom: 1px solid #C5C5C5; }
.table.res_table > tbody > tr > td { display:inherit; width:100%!important; padding:0px; height:inherit; border-bottom: 0px solid #C5C5C5; border-top: 0px solid #e7eaec; }
.res_table td span.res_label { float:left; display:block; width:40%; margin-bottom:10px; margin-right:5%; font-weight:bold; }
.res_table td span.res_content { float:left; display:block; width:55%; margin-bottom:10px; }

.res_table .check_col { width: 20px; box-sizing:border-box; padding: 0px!important; }

.table.res_table > tbody > tr > td.check_col { position: absolute; left: 10px; top:10px; }

.document_tab .document_type  { width:30%; padding:10px 5px 10px 10px; font-size:16px; }
.document_tab .approved_balance  { width:70%; padding:10px 10px 10px 0px; }

#overlay_document img { width:96%; height:auto; }

/*#btn_check_history { width:100%; margin:15px 0px; }*/
.btn_upload_doc { width:100%; margin:10px 0px; }
.details_row span.card_achieved { text-align:left; width:100%; float:none; }
.doc_details.right { width:100%; margin:20px auto; }
.doc_details.info { width:100%; margin:20px auto; }

.form-control.add_card { width:100%; }
#btn_addcard { width:100%; margin:15px 0px; }

.details_row span.card_num { width:100%; margin-right:0px; }


#swal2-title { font-size: 20px; font-weight: normal; }
#swal2-content .doc_details { width:70%; }
#swal2-content p { font-size:14px; }

.congrat { padding:25px 15px 40px 15px; }
.congrat_box .icon_thankyou { height:95px; width:100px; }
.congrat_box .title { font-size:20px; line-height:32px; margin:10px auto; }
.congrat_box .content { font-size:14px; line-height:20px; margin:20px auto; width:100%; max-width:760px; }
.congrat_box p { margin:0px auto 10px auto; }
.congrat_box .big { font-size:26px; line-height:38px; }
.congrat_box .highlight { color:#1E5199; }
#btn_continue { float:none; width:100%; max-width:270px; margin:10px auto; }

.congrat_box .seperator { display:none; }
.congrat_box .balance { font-size:24px; line-height:30px; }
.congrat_box .button_group { height:50px; margin:25px auto; }
.congrat_box .balance_type { float:none; display:block; }

/* upload document */
.upload_container { padding: 0px 0% 0px 0%; }
.upload_container div { font-size:16px; line-height:21px; padding-top:20px; }
.dropzone { padding: 15px 15px; }

}



@media handheld, screen and (max-width:480px) {

.main_visual_frame .title { font-size: 22px; line-height: 28px; }

.form-control.country_code { width:35%; margin-right:5%; }
.form-control.mobile_number { width:60%; }

#swal2-content .doc_details { width:80%; }

/* upload document */
.upload_container { height:280px; }
.upload_container div { font-size:16px; line-height:21px; padding-top:20px; }


}


@media handheld, screen and (max-width:360px) {

.main_visual_frame .title { width:80%; top:6%; font-size: 18px; line-height: 26px; }
.main_visual_frame .card { top:1%; right:-3%; width: 60%; }

#captcha_element { transform:scale(0.88); transform-origin:0 0; }
#captcha_element > div { width:200px!important; }

#swal2-content .doc_details { width:90%; }


}


.how-to .panel-group .panel {
	border-radius: 0px;
}

.how-to .panel-default {
	border-color: #008089;
}

.how-to .panel-default>.panel-heading {
    background-color: #008089;
    border-color: #008089;
    color: #FFFFFF;
    font-size: 18px;
    padding: 15px 20px;
    font-weight: normal;
}

.how-to .panel-default>.panel-heading .panel-title {
	font-weight: normal;
}

.how-to .panel-heading {
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
}




@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.header .logo { background-image:url(../img/logo_106.png); }
}

@supports (-ms-accelerator:true) {
	.header .logo { background-image:url(../img/logo_106.png); }
}

.dropzone .dz-preview .dz-progress {
	display: block;
	height: 15px;
	border: 1px solid #aaa;
}

.dropzone .dz-preview .dz-progress .dz-upload {
	display: block;
	height: 100%;
	width: 0;
	background: green;
}

.dropzone .dz-preview.dz-processing .dz-progress {
	opacity: 1;
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

.dropzone .dz-preview.dz-complete .dz-progress {
	opacity: 0;
	-webkit-transition: opacity 0.4s ease-in;
	-moz-transition: opacity 0.4s ease-in;
	-ms-transition: opacity 0.4s ease-in;
	-o-transition: opacity 0.4s ease-in;
	transition: opacity 0.4s ease-in;
}

.dropzone .dz-preview:not(.dz-processing) .dz-progress {
	-webkit-animation: pulse 6s ease infinite;
	-moz-animation: pulse 6s ease infinite;
	-ms-animation: pulse 6s ease infinite;
	-o-animation: pulse 6s ease infinite;
	animation: pulse 6s ease infinite;
}

.dropzone .dz-preview .dz-progress {
	opacity: 1;
	z-index: 1000;
	pointer-events: none;
	position: absolute;
	height: 16px;
	left: 50%;
	top: 50%;
	margin-top: -8px;
	width: 80px;
	margin-left: -40px;
	background: rgba(255, 255, 255, 0.9);
	-webkit-transform: scale(1);
	border-radius: 8px;
	overflow: hidden;
}

.dropzone .dz-preview .dz-progress .dz-upload {
	background: #333;
	background: #1F5199;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 0;
	-webkit-transition: width 300ms ease-in-out;
	-moz-transition: width 300ms ease-in-out;
	-ms-transition: width 300ms ease-in-out;
	-o-transition: width 300ms ease-in-out;
	transition: width 300ms ease-in-out;
}