@font-face{font-family:'Barlow-Bold';src:url('../../fonts/Barlow-Bold.ttf')format('truetype');}
@font-face{font-family:'Barlow-Regular';src:url('../../fonts/Barlow-Regular.ttf')format('truetype');}
@font-face{font-family:'Barlow-Light';src:url('../../fonts/Barlow-Light.ttf')format('truetype');}
@font-face{font-family:'Barlow-Medium';src:url('../../fonts/Barlow-Medium.ttf')format('truetype');}
@font-face{font-family:'Barlow-SemiBold';src:url('../../fonts/Barlow-SemiBold.ttf')format('truetype');}
@font-face{font-family:'Barlow-BoldItalic';src:url('../../fonts/Barlow-BoldItalic.ttf')format('truetype');}

.hd1 {background: linear-gradient(to right, #295CA9, #009B87);color: #fff;font-size: 18px;margin-top: 50px;}
.BoxIdCard{margin-top: 30px;padding:0px; box-shadow: 10px 10px 30px #e0e0e0;background:#FFFFFF;border-radius: 10px;position:relative;}
.BoxIdCard .LogInOut{position: absolute;right: 0px;top: 35px;text-align: right;color:#3D3D3D;font-size:16px;font-family:Barlow-Medium;z-index:1;}
.BoxIdCard .LogInOut a{font-family:Barlow-Regular;padding: 7px 10px;background:#E6ECF8;color:#2A5DAA;border: 1px solid #CCCCCC;margin-left: 15px;}
.BoxIdCard .LogInOut a:hover{background:#d1e0fe;text-decoration:none;}
.BoxIdCard .BoxIdCardImage{float:left;padding:0px;}
.BoxIdCard .BoxIdCardImage img{width:100%;}
.BoxIdCard .BoxIdCardContent{padding: 0px 70px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle{float:left;width:100%;padding:0px;margin-bottom: 20px;margin-top: 30px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect{float:left;padding: 10px 20px;border:2px solid #FAFAFA; border-radius:8px;background:#e7e7e7;width: 35%;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle #BoxIdCardSelectCN{margin-left: 10%;margin-right:5%;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle #BoxIdCardSelectTC{margin-left: 5%;margin-right:10%;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelectActive{border:2px solid #008999;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect i{font-size:40px;float:left;color:#b5b9b9;margin-top:5px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelectActive i{color:#008999;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect p{color:#3D3D3D;font-size:18px;font-family:Barlow-Regular;float:left;padding-left:20px;margin:0px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelectActive p{color:#008999;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect:hover{border:2px solid #008999;cursor:pointer;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect:hover i{color:#008999;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect:hover p{color:#008999;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent{float:left;padding:0px;margin-top:10px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentTitle{float:left;width:100%;color:#2A5DAA;font-size:18px;font-family:Barlow-SemiBold;margin-top:0px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem{float:left;margin-bottom:10px;background:#e7e7e7;height:100px;padding:20px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem .BoxIdCardSelectContentItemNumber{float:left;text-align:center;font-size: 35px;font-family:Barlow-SemiBold;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem .BoxIdCardSelectContentItemImage{padding:0px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem .BoxIdCardSelectContentItemImage img{max-width:100%;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem .BoxIdCardSelectContentItemText{color:#3D3D3D;font-size:16px;font-family:Barlow-Regular;float:left;padding:0px 0px 0px 10px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle h1{color:#2A5DAA;font-size:24px;font-family:Barlow-SemiBold;margin-top:0px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle h3{color:#2A5DAA;font-size:20px;font-family:Barlow-Bold;margin-top:0px;margin-bottom:30px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardTitle p{color:#3D3D3D;font-size:16px;font-family:Barlow-Regular;}

.BoxIdCard .BoxIdCardContent .boxCardType{padding: 5px 15px 5px 0px;}
.BoxIdCard .BoxIdCardContent .boxCardType .btn{font-size: 14px;padding: 7px 0px; width:100%;background:#2A5DAA;border:0px;}
.BoxIdCard .BoxIdCardContent .boxCardType .btn:hover{background:#1a4a93;}
.BoxIdCard .BoxIdCardContent .Mess{padding: 10px 0px;color:#ff0000;}
.BoxIdCard .BoxIdCardContent .Information{padding: 15px;border: 1px solid #CCCCCC;}
.BoxIdCard .BoxIdCardContent .Information p{color:#3D3D3D;font-size:16px;font-family:Barlow-Medium;}
.BoxIdCard .BoxIdCardContent .Information ul{float:left;width: 100%;margin:0px; padding:0px 0px 0px 20px;}
.BoxIdCard .BoxIdCardContent .Information ul li{float:left;width: 100%;color:#3D3D3D;font-size:16px;font-family:Barlow-Regular;}
.BoxIdCard .BoxIdCardContent .btnNext{margin-top: 20px;padding:0px;margin-bottom:20px;}
.BoxIdCard .BoxIdCardContent .btnNext a{padding: 10px 0px;width:100%;background: linear-gradient(to right, #009B87, #295CA9);border:0px;font-size: 18px;font-family:Barlow-Regular;}
.BoxIdCard .BoxIdCardContent .btnNext a:hover, .BoxIdCard .BoxIdCardContent .btnNext a:visited,.BoxIdCard .BoxIdCardContent .btnNext a:active{background: linear-gradient(to right, #295CA9, #009B87);box-shadow:initial;}
.UpdateImage .panel-body{padding:0px;float:left;width:100%;}
.UpdateImage .btn-pub {cursor: pointer;}
.UpdateImage .loading-custom {width: 80px;height: 80px;position: relative;-webkit-animation: bkg 2.2s steps(140) infinite;animation: bkg 2.2s steps(140) infinite;background-image: url(/theme/image/flower-loading.8df16d11.png);}
.UpdateImage .vs-loading__load {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-ms-flex-direction: column;flex-direction: column;position: absolute;margin: auto;left: 0;top: 0;bottom: 0;right: 0;}
.UpdateImage .loading {display: none;position: fixed;z-index: 9000;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,.4);}
.UpdateImage .action-block{background-image: url(/theme/image/Portal/bg-img.png);width: 100%; height:auto;}
.UpdateImage .form-horizontal .form-group{margin: 0px 0px 40px 0px;float: left;width:100%;padding: 30px 15px 80px 15px;border: 1px solid #CCCCCC;border-radius: 6px;}
.UpdateImage .btnVideo{transform:initial;margin-bottom: 10px;top:155px;left: 10%; width: 80%;background: linear-gradient(to right, #009B87, #295CA9);font-family:Barlow-Regular;}
.UpdateImage .btnVideo:hover{background: linear-gradient(to right, #295CA9, #009B87);}
.UpdateImage .btnVideo2{background:#E6ECF8;color:#2A5DAA;font-family:Barlow-SemiBold;}
.UpdateImage .btnVideoTai{top: 170px;background:none;color:#2A5DAA;font-weight: bold;}
.UpdateImage .btnVideoTai:hover{background:none; text-decoration:underline;}
.UpdateImage .divVideo{width:100%;margin:0px;}
.UpdateImage .divVideo img{max-width:100%; height: 135px;position:relative;border-radius: 4px;}
.UpdateImage .spanekyc{color:#3D3D3D;font-size:16px;font-family:Barlow-Regular;}
.UpdateImage #divVideo12, .UpdateImage #divVideo22, .UpdateImage #divVideo32{background-image:none;width:100%; height:auto;}
.UpdateImage .imgtmp3 {padding:0px;}
.UpdateImage .imgtmp3 p{float: left;width: 100%;text-align: left;background: #E7E7E7;padding: 0px 10px;border-radius: 4px;margin-bottom:2px;border:1px solid #CCCCCC;}
.UpdateImage .imgtmp3 p a{float: right;color:#3D3D3D;}
.BoxIdCard .UpdateImage .btnNext{width: 46%;margin: 0px 2% 20px 2%;}
.BoxIdCard .register-form{margin-top: 0px;padding:15px;border: 1px solid #CCCCCC;}
.BoxIdCard .UpdateInformation .Information{border:0px;padding: 0px 15px 0px 0px;margin:0px;}
.BoxIdCard .UpdateInformation .Information p{float:left;width:100%;margin-bottom: 22px;}
.BoxIdCard .UpdateInformation .Information .fontmuli-b{padding:0px;}
.BoxIdCard .UpdateInformation .Information .fontmuli-a{font-weight:initial;padding:0px;}
.BoxIdCard .UpdateInformation .formUpdateInformation{padding:0px;}
.BoxIdCard .UpdateInformation .formUpdateInformation p{float:left;width:100%;margin-bottom:5px;}
.BoxIdCard .UpdateInformation .formUpdateInformation .fontmuli-b{padding:0px;float:left;}
.BoxIdCard .UpdateInformation .formUpdateInformation .form-control{width: 50%;float:left;font-family:Barlow-Medium;}
.BoxIdCard .UpdateInformation .formUpdateInformation .form-control#otp1{width:15%;border-radius:0px;}
.BoxIdCard .UpdateInformation .formUpdateInformation .form-control#otp2{width:15%;border-radius:0px;}
.BoxIdCard .UpdateInformation .formUpdateInformation .form-control#otp3{width:15%;border-radius:0px;}
.BoxIdCard .UpdateInformation .btnNext{margin-top:0px;width: 46%;margin: 0px 2% 20px 2%;}
.BoxIdCard .loading-custom {width: 80px;height: 80px;position: relative;-webkit-animation: bkg 2.2s steps(140) infinite;animation: bkg 2.2s steps(140) infinite;background-image: url(/theme/image/flower-loading.8df16d11.png);}
.BoxIdCard .vs-loading__load {display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;-ms-flex-direction: column;flex-direction: column;position: absolute;margin: auto;left: 0;top: 0;bottom: 0;right: 0;}
.BoxIdCard .loading {display: none;position: fixed;z-index: 9000;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,.4);}
.BoxIdCard .SuccessUpdateIdCard .BoxIdCardTitle{margin-top: 150px;}
.BoxIdCard .SuccessUpdateIdCard .BoxIdCardTitle h1{text-align:center;font-size: 35px;margin-bottom: 50px;}
#loginform img{margin-bottom:30px;}
#loginform .pb-4{margin:0px;}
#loginform .input-group{float:left;width:100%;margin-bottom: 10px;}
#loginform .input-group .input-group-text{float:left;width:10%;background:#00b291;height:34px;text-align:center;padding-top:5px;color:#FFFFFF;}
#loginform .input-group .form-control{float:left;width:90%;}
#loginform .border-secondary{margin:20px 0px 0px 0px;border-top: 1px solid #CCCCCC;padding-top: 20px;}
#loginform .form-horizontal .form-group{margin:0px;}
#loginform .form-horizontal .form-group .btn-success{background: linear-gradient(to right, #009B87, #295CA9);border:0px;}
#loginform .form-horizontal .form-group .btn-success:hover, #loginform .form-horizontal .form-group .btn-success:active, #loginform .form-horizontal .form-group .btn-success:visited{background: linear-gradient(to right, #295CA9, #009B87);border:0px;box-shadow:initial;}
.card{float:left;width: 100%;box-shadow: 10px 10px 30px #e0e0e0;padding: 10px;}
.card th{background:#e4e4e4;font-family:Barlow-Regular;font-size: 15px;}
.card td p{font-family:Barlow-Regular;font-size: 14px;}
.card tr:nth-child(2n+1) td{background:#f2f2f2;}
.card .btn {border-radius:0px;font-size: 14px;font-family:Barlow-Regular;padding: 6px 12px;}
.pagination {margin: 20px 0;}
.pagination ul {display: inline-block;*display: inline;margin-bottom: 0;margin-left: 0;-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;*zoom: 1;-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);}
.pagination ul > li {display: inline;}
.pagination ul > li > a,.pagination ul > li > span {float: left;padding: 4px 12px;line-height: 20px;text-decoration: none;background-color: #ffffff;border: 1px solid #dddddd;border-left-width: 0;}
.pagination ul > li > a:hover,.pagination ul > li > a:focus,.pagination ul > .active > a,.pagination ul > .active > span {background-color: #f5f5f5;}
.pagination ul > .active > a,.pagination ul > .active > span {color: #999999;cursor: default;}
.pagination ul > .disabled > span,.pagination ul > .disabled > a,.pagination ul > .disabled > a:hover,.pagination ul > .disabled > a:focus {color: #999999;cursor: default;background-color: transparent;}
.pagination ul > li:first-child > a,.pagination ul > li:first-child > span {border-left-width: 1px;-webkit-border-bottom-left-radius: 4px;border-bottom-left-radius: 4px;-webkit-border-top-left-radius: 4px;border-top-left-radius: 4px;-moz-border-radius-bottomleft: 4px;-moz-border-radius-topleft: 4px;}
.pagination ul > li:last-child > a,.pagination ul > li:last-child > span {-webkit-border-top-right-radius: 4px;border-top-right-radius: 4px;-webkit-border-bottom-right-radius: 4px;border-bottom-right-radius: 4px;-moz-border-radius-topright: 4px;-moz-border-radius-bottomright: 4px;}
.pagination-centered {text-align: center;}
.pagination-right {text-align: right;}
.pagination-large ul > li > a,.pagination-large ul > li > span {padding: 11px 19px;font-size: 17.5px;}
.pagination{padding-left: 10px;float:right;}
.pagination a.page-link:hover{cursor:pointer;background: #1a4a93;color:#FFFFFF;}
.BoxIdCardContent .History_main{padding:0px;}
.BoxIdCardContent .History_main table{float:left;width: 100%;}
.BoxIdCardContent .History_main .trTitle{background:none;}
.BoxIdCardContent .History_main .trTitle th{font-family: Barlow-SemiBold;padding: 5px 10px 10px 10px;font-size:16px;line-height:16px;color:#222B64;}
.BoxIdCardContent .History_main tr{margin-bottom: 5px;border-radius:6px;}
.BoxIdCardContent .History_main tr td{font-family: Barlow-Regular;background:#FFFFFF;padding: 5px 10px;font-size:16px;line-height:16px;color:#3D3D3D;border-bottom: 5px solid #EDEDED;}
.BoxIdCardContent .History_main tr td select.form-control{border:0px;font-family:Barlow-Regular;box-shadow:none;width:auto;display:initial;}
.BoxIdCardContent .History_main tr td a.btn{text-decoration:none; color:#FFFFFF;font-family:Barlow-Regular; padding: 5px 30px;background: #1AB090;border:0px;}
.BoxIdCardContent .History_main tr td a.btn:hover{background: #13967a;color:#FFFFFF;border:0px;}
.BoxIdCardContent .History_main tr.disable td{font-family: Barlow-Regular;color:#999999;}
.BoxIdCardContent .History_main tr td:first-child{border-radius: 6px 0px 0px 6px;}
.BoxIdCardContent .History_main tr td:last-child{border-radius: 0px 6px 6px 0px;}
.BoxIdCardContent .History_main tbody {display:block;max-height:470px;overflow-y:auto;}
.BoxIdCardContent .History_main thead, .BoxIdCardContent .History_main tbody tr {display:table;width:100%;table-layout:fixed;height:50px;}
.BoxIdCardContent .History_main .divPage{float:left;padding:0px;display:flex;}
.BoxIdCardContent .History_main .divPage ul{padding:10px 0px 0px 0px;margin:auto;}
.BoxIdCardContent .History_main .divPage ul li{float:left;}
.BoxIdCardContent .History_main .divPage ul li a{font-family: Barlow-SemiBold;font-size:14px;line-height:16px;color:#252525;padding: 10px;cursor:pointer;}
.BoxIdCardContent .History_main .divPage ul li.active a{color:#999999;}
.BoxIdCardContent .History_main .divPage ul li a:hover{text-decoration:none;color:#999999;}
.BoxIdCardContent .History_main .divPage ul li a i{font-size:18px;}
.BoxIdCardContent .History_main .divPage ul li a.active{color:#999999;}
@media (min-width:1200px){
   
}
@media (min-width:980px) and (max-width:1200px){
  .container{width:1100px;}
   .BoxIdCard .BoxIdCardContent{padding: 0px 15px;}  
}
@media (min-width:980px) and (max-width:1100px) {
  .container{width:100%;}
   .BoxIdCard .BoxIdCardContent{padding: 0px 15px;}
}
@media (min-width:851px) and (max-width:979px){
     .container{width:100%;}
   .BoxIdCard .BoxIdCardContent{padding: 0px 10px;}
}
@media (min-width:768px) and (max-width:850px){
   .container{width:100%;}
   .BoxIdCard .BoxIdCardContent{padding: 0px 10px;}
}
@media (min-width:480px) and (max-width:767px){
   .container{padding:0px;}
    .BoxIdCard{padding-bottom: 50px;box-shadow:initial;margin-top:0px;}
    .BoxIdCard .BoxIdCardContent{padding:0px;}
    .BoxIdCard .SuccessUpdateIdCard{padding: 0px 15px;}
    .BoxIdCard .SuccessUpdateIdCard .BoxIdCardTitle{margin-top: 50px;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardTitle{margin-top:15px !important;border:0px !important;}
    .BoxIdCard .UpdateImage{padding:0px 15px;}
    .UpdateImage .form-horizontal .form-group .divekycItem{padding:0px;}
    .UpdateImage .form-horizontal .form-group .divVideo{height:350px !important;}
    .UpdateImage .btnVideo{top:190px;}
    .UpdateImage .btnVideo2{top:250px;}
    .UpdateImage .divVideo img{height:160px;}
    .UpdateImage .form-horizontal .form-group{padding:20px 15px;}
    .UpdateImage .action-block{background-size: 60% 60%;}
    .BoxIdCard .UpdateInformation{padding: 0px 15px;}
    .BoxIdCard .UpdateInformation .formUpdateInformation{padding:0px !important;}
    .BoxIdCard .BoxIdCardContent .btnNext{text-align:center;}
    .BoxIdCard .BoxIdCardContent .btnNext a{width:90%;}
}
    
@media (max-width:480px){
    .container{padding:0px;}
    .BoxIdCard{padding-bottom: 50px;box-shadow:initial;margin-top:0px;}
    .BoxIdCard .BoxIdCardContent{padding:0px 10px;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardTitle .BoxIdCardSelect{width:48%;padding:10px;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardTitle #BoxIdCardSelectCN{margin-left: 0%;margin-right:2%;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardTitle #BoxIdCardSelectTC{margin-left: 2%;margin-right:0%;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem{padding:20px 10px !important;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem .BoxIdCardSelectContentItemNumber{width:10%;padding:0px;}
.BoxIdCard .BoxIdCardContent .BoxIdCardSelectContent .BoxIdCardSelectContentItem .BoxIdCardSelectContentItemText{width:64%;padding-top:0px !important;padding-bottom:0px !important;}
    .BoxIdCard .SuccessUpdateIdCard{padding: 0px 15px;}
    .BoxIdCard .SuccessUpdateIdCard .BoxIdCardTitle{margin-top: 50px;}
    .BoxIdCard .BoxIdCardContent .BoxIdCardTitle{margin-top:15px !important;border:0px !important;}
    .BoxIdCard .UpdateImage{padding:0px 15px;}
    .UpdateImage .form-horizontal .form-group .divekycItem{padding:0px;}
    .UpdateImage .form-horizontal .form-group .divVideo{height:350px !important;}
    .UpdateImage .btnVideo{top:190px;}
    .UpdateImage .btnVideo2{top:250px;}
    .UpdateImage .divVideo img{height:160px;}
    .UpdateImage .form-horizontal .form-group{padding:20px 15px;}
    .BoxIdCard .UpdateInformation{padding: 0px 15px;}
    .BoxIdCard .UpdateInformation .formUpdateInformation{padding:0px !important;}
    .BoxIdCard .BoxIdCardContent .btnNext{text-align:center;}
    .BoxIdCard .BoxIdCardContent .btnNext a{width:90%;}
    .BoxIdCard .LogInOut{width:100%;color:#FFFFFF;}
}