html{-webkit-text-size-adjust:none;}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,ins,kbd,q,samp,small,strong,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}
li{list-style:none}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:none}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;outline:0 none;}
ins{background-color:#ff9;color:#000;text-decoration:none}
mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}
del{text-decoration:line-through}
abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}
table{border-collapse:collapse;border-spacing:0}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}
input,select{vertical-align:middle}
input[type="text"],input[type="tel"],input[type="number"],input[type="password"],input[type="email"],input[type="url"],input[type="file"] {margin:0;border-radius:0;-webkit-appearance: none;}
sup {font-weight:normal;line-height:normal;}
.pullLeft{float:left;}
.pullRight{float:right;padding-right: 4px;}
.txtCenter{text-align:center !important;}
.txtRht{text-align:right !important;}
.clear {clear:both;}
.clearL {clear:left;}
.clearR {clear:right;}
.clearFix {zoom:1;}
.clearFix:after {clear:both;display:block;visibility:hidden;height:0;line-height:0;content:"";}
* {font-family:Arial, Helvetica, sans-serif;}
h6 {color:#53565a;}
.txtRed{color:#f00;}
.redColTxt {color:#fe3434;}
a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;color:#3399CC;outline:none;text-decoration:none;}
img{max-width:100%;border:0;}
body {color:#555555;font-family:arial,verdana,times New Roman;font-size:12px;}
p{padding:0 0 10px;}
.last{padding-bottom:0!important;}
.noPadLft{padding-left:0;}
.commonSpacing{margin-top:10px;}
.noMarginBtm,.singleRow.noMarginBtm,.labelField.noMarginBtm {margin-bottom:0;}
.blueBtn, .grayBtn {width:auto;padding:10px 20px;color:#ffffff;font-size:14px;display:block;text-align:center;cursor:pointer;text-transform:uppercase;}
.blueBtn{background:#0dbceb;}
.grayBtn {background:#97999B;}
.blueBtn:hover, .grayBtn:hover {background:#008CE6;}
.grayColor{background:#666;}
.BtnWrapper,.BtnWrapperTwo,.BtnWrapperThree{float:right;}
.BtnWrapper{padding:20px 0 0;}
#main{background:#FFFFFF; margin: 0 auto; overflow: hidden; width: 984px;}
#wrapper {background:#fff;}
#header {display:block;margin:0px auto;height:86px;background:url("../images/blue-bar-bg.jpg") repeat-x top left;}
.logo{background: url("../images/citibank-logo.png") no-repeat 0 0;width:131px;height:37px;float: left;margin:22px 0 0 29px;}
.fillUpForm {margin:0px auto;padding:25px 29px;float:left;}
.fillUpForm h1 {margin-bottom:10px;font-family:Arial, Helvetica, sans-serif;font-size:16px;line-height:19px;color:#000066;font-weight:bold;}
.fillUpForm p {font-size:13px;}
.bg {font-size:13px;padding: 10px;text-align: left;line-height: 18px;background-color: #f7f7f7;}
.formContent h2,.verifyDetails h2,.confirmationDetails h2 {padding:15px;color:#002975;background:#d9f5fd;font-size:15px;font-family:Arial, Helvetica, sans-serif;width:100%;box-sizing:border-box;float:left;}
.provideDetails,.verifyDetails,.confirmationDetails{float:left;width:100%;box-sizing:border-box;}
.verifyDetails .supportDocumentsArea{padding-bottom:0;}
.personalInfoArea,.supportDocumentsArea,.formTypeArea {background:#fff;width:100%;display:inline-block;box-sizing:border-box;padding:25px 0 25px 15px;}
.formContent .personalInfoArea .labelField{line-height:30px;}
.formContent .formTypeArea .labelField{line-height:30px;}
.singleRow {float:left;margin-bottom:26px;width:100%;}
.inputBox {background:#fff;border:1px solid #c5c5c5;color:#53565a;}
.labelField{float:left;width:18%;padding-right:2%;}
.inputField {float:left;position:relative;width:80%;}
.posRelat{position:relative;}
.plusSymbol{height:15px;width:10px;position:absolute;left:10px;top:7px;font-size:15px;}
.minusSymbol{margin:0 4px;float:left;line-height:30px;}
#areacode{padding-left:20px;}
.smallDrop .sbHolder,.smallDrop .sbOptions,.smallDrop .sbSelector{width:130px;}
.largeDrop .sbHolder,.largeDrop .sbOptions,.largeDrop .sbSelector{width:334px;}
.doc_up_select, .doc_up_input{float:left;position:relative;}
.alertMsg { position:absolute;padding:5px;white-space:nowrap;background:#fff9d2;border:1px solid #c5c5c5;font-size:12px;color:#000;z-index:999;line-height:14px;display:none;top:-28px;}
.alertMsg img { position:absolute; top:24px; left:50%; margin-left:-8px;}
.idTypeRow .doc_up_select {width:130px;}
.idTypeRow .inputField .doc_up_select .alertMsg{right:-2%;}
.surnameRow .doc_up_input .alertMsg, .contactRow .inputField .alertMsg.mobile, .nameRow .inputField .alertMsg.name, .typeRow .doc_up_select .alertMsg, .topicIdRow .doc_up_select .alertMsg,.surnameRow .doc_up_select .alertMsg{right:0%;}
.contactRow .inputField .alertMsg.areacode{left:0%;right:unset;}
.idTypeRow .inputField .doc_up_input .alertMsg.Passport, .idTypeRow .inputField .doc_up_input .alertMsg.HKID{top:-28px;right:0%;}
.contactRow .inputField .alertMsg.areacode{left:0%;right:unset;z-index:9999;}
.contactRow  .alertMsg.areacode img, .contactRow  .alertMsg.mobile img, .formContent .inputField .alertMsg.areacode img,.formContent .inputField .alertMsg.mobile img{top:24px;}
.contactRow .doc_up_input{margin-left:0;}
.nameRow .small.inputBox{width:110px;}
.formContent .personalInfoArea .nameRow .labelField, .formContent .personalInfoArea .contactRow .labelField, .formContent .personalInfoArea .idTypeRow .labelField {line-height:14px;}
.doc_up_input,.lastColumn,.marginLft12,.fileSize{margin-left:12px;}
.small.inputBox{width:100px;}
.medium.inputBox{width:170px;}
.inputBox{width:172px;}
.lastColumn{float:left;line-height:30px;}
.first.inputBox{float:left;}
.first.inputBox{width:45px;}
.second.inputBox{width:89px;}
.third.inputBox{width:10px;}
.fileUpload{float:left;width:100%;}
.fileUpload labe{margin-top:10px;}
.fileUpload .formContent input{padding:0;}
.formContent .labelField {font-size:13px;font-family:Arial, Helvetica, sans-serif;}
.formContent select {font-size:13px;color:#53565a;padding:5px;margin-left:0px;width:183px;}
.formTypeArea input,.personalInfoArea input {font-size:13px;line-height:16px;padding:7px 10px;}
.formContent .inputField .alertMsg{position:absolute;padding:5px;white-space:nowrap;background:#fff9d2;border:1px solid #c5c5c5;font-size:12px;color:#000;z-index:999;}
.formContent .inputField .alertMsg img {position:absolute;top:24px;left:50%;margin-left:-8px;}
#footer {padding:0;font-size:11px;width:984px;margin:0 auto;}
.footerMenu{border-bottom:2px solid #CCCCCC;overflow:hidden;padding:7px 0 5px;width:100%;box-sizing:unset;}
.footerMenu a{color:#666;}
.footerMenu a:hover{text-decoration:underline;}
.footerLinks {float:right;padding:0;}
.footerLinks ul{margin:0;padding:0;}
.footerLinks ul li {float:left;padding:0 0 0 23px;list-style:none;}
.footerLeftLink{float:left;padding:2px 0px 0 0;}
.footerLinksList {float:right;padding:0;margin-top:3px;}
.footerList li{float:left;padding-left:18px;list-style:none;}
.footerDisclaimer {overflow:hidden;padding:16px 0 35px;}
.footerLogo {background:url("../images/citi-logo-pc.png") no-repeat;width:31px;height:18px;float:left;}
.copyRight {float:right;text-align:right;color:#999;}
.followTxt{float:left;padding:2px 0 0 0;}
.mediaIcons{float:left;border-left:1px solid #ccc;padding:0 0 0 7px;}
.mediaIcons li{float:left;margin:0 6px 0 0;list-style:none;} 
.mediaIcons li a.facebookIcon, .mediaIcons li a.faceIcon{width:18px;height:18px;background-repeat:no-repeat;display:inline-block;background-size:contain;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;-ms-background-size:contain;-moz-border-radius:3px 3px 3px 3px;-webkit-border-radius:3px 3px 3px 3px;border-radius:3px 3px 3px 3px;cursor:pointer;z-index:1;}
.mediaIcons li a.faceIcon{width:30px;height:30px;}
.mediaIcons li a.facebookIcon, .mediaIcons li a.faceIcon{background-image:url("/views/images/facebookIcon.png");}
.footerLinksList a.activeTabHighlight {color:#3399CC;text-decoration:underline;}
.visible-phone {display:none !important;}
.visible-tablet {display:none !important;}
.hidden-desktop, .hidden_desktop{display:none !important;}
.visible-phone-port{display:none !important;}
#back-top {bottom: 0;padding: 0;position: fixed;right: 0;}
#back-top span {background: url("../images/back-to-top.png") no-repeat scroll 0 0 #DDDDDD;border-radius: 3px 3px 3px 3px;display: block;height: 33px;margin-bottom: 0;transition: all 1s ease 0s;width: 33px;z-index: 9999;cursor:pointer;}
#errorpage {margin: 200px auto;text-align: center;width: 100%;}
#realpage {visibility: hidden;}
.noMarginLft{margin-left:0;}
.error{color:#fe3434;font-size:11px;margin-top:3px;float:left;width:100%;}
.Note{float:left;width:100%;}
.BtnWrapperThree a,.BtnWrapperTwo a{float:left;margin-right:10px;}
.BtnWrapperThree a.noMarginRgt,.BtnWrapperTwo a.noMarginRgt{margin-right:0;}
#upload_1, #upload_2, #upload_3{width:30%;}
.disclaimer{font-size:11px !important;color:#666;}
ul.bulLst{padding:0 0 10px;}
ul.bulLst li {background: url("../images/bullet.jpg") no-repeat 0 6px transparent; padding: 0 0 8px 10px;list-style: none;line-height: 17px;}
ol.numLst{padding:0 0px 10px 5px;margin:0 0 0 25px;list-style:decimal;line-height: 17px;}
ol.numLst{padding:0 0 10px;}
ul.numLst > li, ol.numLst li {padding:0 0px  5px;list-style:decimal;line-height: 17px;}
#steps{margin-top:20px;}
.printIcon{background:url("../images/printIcon.png") no-repeat;width:24px;height:24px;float:right;}
#output{width:83%;}
.sbOptions li:last-child a{border-bottom:none;}
.idAccnoRow .doc_up_input {margin-left: 0;}
.large.inputBox {width: 314px;}
.option,.optionOneOp,.optionTwoOp,.optionFour,.optionThreeOp{display:none}
#document1,#document2,#document3{word-wrap: break-word;}
.refNo{float:left}
.doc_up_input  .ccInputBox{font-size: 13px;line-height: 16px;padding: 8px 19px !important;width:42px; background: #fff none repeat scroll 0 0;border: 1px solid #c5c5c5;color: #53565a;}
input{outline:none}
#jobInfo {margin-bottom: 25px;position: relative;left: -15px;}
.checkbtnCol.doc_up_input {
    margin: 0;
    line-height: 30px;
    float: none;
    display: table;
}
.checkbtnCol.doc_up_input .checkbtn {
	float: left;
}
.checkbtnCol > .checkbtn:not(:last-child) {
    margin-right: 15px;
}
.checkbtnCol .checkbtn input {
    padding: 0;
    line-height: normal;
    font-size: initial;
    margin: 0;
    margin-right: 5px;
}
.formContent .personalInfoArea .labelField.line_ht_normal{
	line-height: 18px;
}
.custom-file-input::-webkit-file-upload-button {
  visibility: hidden;
}
.custom-file-input-cover {
    display: inline-block;
    width: 215px;
}
.custom-file-input-cover .custom-file-input{
	position: absolute;
    left: 0;
    top: -5px;
    width: 215px;
    background: beige;
    padding: 5px 0;
}
.custom-file-input-cover:after {
    content: 'BROWSE';
    display: inline-block;
    background: #0dbceb;
    position: absolute;
    left: 0;
    padding: 0 10px;
    color: #fff;
    z-index: 9;
    top: -5px;
    height: 31px;
    line-height: 31px;
}
.formContent .personalInfoArea .labelField.line14{
	line-height:14px;
}
#otherareacode {padding-left:20px}
#areacode{padding-left:20px}


.areaselcont {
	display:inline-block;
	
	float:left;
} 
.areaselcont:not(.hideEl) + .areacodeBox {
	margin-left:9px
}
.hideEl {
	display:none  ;
}

@media (max-width:1024px) {
	#main{margin:0;}
	#main,#footer{width:100%;box-sizing:border-box;}
	#wrapper{padding:0;}
	#header{height:44px;background-position:0 bottom;}
	.logoWrap{padding:7px 7px 0;}
	.logo {background: url("../images/logoDevice.png") no-repeat 0 0 transparent;background-size: 54px 34px;width: 54px;height: 34px;margin: 0 auto;float: left;display: block;}
	.fillUpForm {width: 100%;margin: 0px auto;box-sizing:border-box;float:left;}
	#footer {padding: 10px;font-size: 11px;}
	.provideDetails .personalInfoArea .medium.inputBox{width:168px;}
	.footerMenu{height:50px;padding:7px 0 8px;}
    .footerList{float:right;padding-top:20px;}
	.footerLinksList ul li {float: left;padding: 0 15px 0 0;}
	.footerLinksList {float: none;padding: 0 23px 0 0;position: relative;}
	.footerLinksList a {color: #666666;padding-bottom: 4px;display: inline-block;}
	.appFooterScrolPlus, .appFooterScrolMinus {display: block;position: absolute;right:0;top: 2px;padding-right: 20px;}
	.appFooterScrolTop{top:2px;}
	.appFooterScrolPlus {background: url("../images/plus.png") no-repeat right 0 transparent;}
	.appFooterScrolMinus {background: url("../images/minus.png") no-repeat right 0 transparent;}
	.hidden-desktop{display:inherit !important;}
	.inputBox {width: 170px;}
	.largeDrop .sbHolder,.largeDrop .sbOptions,.largeDrop .sbSelector{width:332px;}
	.BtnWrapperTwo{padding-bottom:25px;}
	
}
@media (max-width:768px) {
	.fillUpForm{padding:25px 7px 7px 7px;}
}
@media (max-width:767px) {
	.visible-phone {display:inherit !important;}
	.hidden-phone {display: none;}	
	.logo{float:none;margin:0 auto;display:block;}
	.footerMenu {height: 16px;box-sizing:unset}
	.footerLeft {margin: 0 23px 0 0;}
	.copyRight {float: none;text-align: left;padding-left: 90px;}
	.footerList sup {line-height:0;}
	.labelField, .inputField,.contactRow .inputField{width:100%;}
	.supportDocumentsArea .labelField, .verifyDetails .labelField{width:28%;}
	.supportDocumentsArea .inputField,.verifyDetails .inputField{width:70%;}
	.doc_up_select, .doc_up_input, .surnameRow .doc_up_select, .idTypeRow .doc_up_select, .typeRow .doc_up_select, .topicIdRow .doc_up_select{width: 100%;}
	.smallDrop .sbHolder, .smallDrop .sbSelector, .largeDrop .sbHolder,.largeDrop .sbSelector {width:99.6%;}
	.smallDrop .sbOptions, .largeDrop .sbOptions{width:100%;}
	.medium.inputBox, .inputBox {box-sizing: border-box;width: 100%;}
	.doc_up_input,.lastColumn, #HKID, #Passport{margin-left:0;margin-top:15px;}
	.lastColumn{float:left;}
	.small.inputBox{width:25%;float:left;}
	.contactRow .small.inputBox,.provideDetails .personalInfoArea .contactRow .medium.inputBox,.idAccnoRow .large.inputBox,.nameRow .small.inputBox, .provideDetails .personalInfoArea .nameRow .medium.inputBox{width:100%;}
	.contactRow .inputField .alertMsg.areacode{right: 0%;width: 40%;left: unset;}
	.provideDetails .personalInfoArea .contactRow .medium.inputBox, .provideDetails .personalInfoArea .nameRow .medium.inputBox {margin-left:0%;}
	.provideDetails .medium.inputBox, .provideDetails .personalInfoArea .medium.inputBox{width:73%;float:left;margin-left:2%;}
	.first.inputBox{width:17.5%;}				
	.second.inputBox{width:60%;}
	.third.inputBox{box-sizing: border-box;width:17.5%;}
	.doc_up_input.id_type .marginLft12{margin-left:2%;}
	.marginLft12.lastField{margin-left:1% !important;}
	#upload_1,#upload_2,#upload_3{width: 76%;word-wrap: break-word;}
	.lastColumn{line-height:0;}
	.surnameRow .doc_up_select .alertMsg, .contactRow .inputField .alertMsg,.typeRow .doc_up_select .alertMsg,.topicIdRow .doc_up_select .alertMsg{right:0%;}
	.idTypeRow .inputField .doc_up_select .alertMsg{right:-0.3%;}
	.idTypeRow .inputField .doc_up_input .alertMsg.HKID{right:0%;top:-12px;}
	.singleRow {margin-bottom:20px;}
	.provideDetails .personalInfoArea .idTypeRow .doc_up_input{margin-top:0;}
	.formContent .personalInfoArea .labelField{line-height:14px;margin-bottom:10px;}
	.formContent .inputField .alertMsg.surname{right:0%;}
	.personalInfoArea, .supportDocumentsArea,.formTypeArea {padding: 15px;}
	.BtnWrapper, .BtnWrapperTwo, .BtnWrapperThree{display:inline-block;float:none;width:100%;text-align:center;}
	.blueBtn{display:inline-block;}
	.BtnWrapperTwo, .BtnWrapperThree {padding-top:0;padding-bottom:25px;}
	.BtnWrapperThree a, .BtnWrapperTwo a{float:none;display:inline-block;}
	.areacodeBox{width:30%}
	.phoneBox{width:70%;margin-top:0px}
	.doc_up_input  .ccInputBox{padding: 8px 19px !important;width:35px;}
}
@media (min-width: 641px) and (max-width: 766px){ /* For iPhone6 */
	.alertMsg.title, .alertMsg.surname, .alertMsg.mobile, .alertMsg.name, .alertMsg.upload_1, .alertMsg.upload_2, .alertMsg.upload_3, .alertMsg.idType{top: -29px;}
	.smallDrop .sbHolder, .smallDrop .sbSelector, .largeDrop .sbHolder,.largeDrop .sbSelector {width: 99.7%;}
	
}
@media (max-width:580px){
	.second.inputBox{width:59%;}
	.BtnWrapperThree a{float:none;margin-right:0;}
}
@media (max-width:480px){
	.smallDrop .sbHolder, .smallDrop .sbSelector, .largeDrop .sbHolder,.largeDrop .sbSelector{width:99.5%;}
	.verifyDetails .fileSize{width:100%;margin: 4px 0 0 0;display: inline-block;}
	.supportDocumentsArea .inputField,.verifyDetails .inputField{width:100%;}
}
@media (max-width:400px){
	.second.inputBox{width:58%;}
	.verifyDetails .labelField {width: 48%;}
	.verifyDetails .inputField {width: 50%;}
	.doc_up_input  .ccInputBox{padding: 8px 15px !important;width:30px;}
}
@media (max-width:320px){
	.alertMsg.Passport{white-space: pre-line !important;}
	.formContent .inputField .alertMsg.Passport img{top:38px;}
}



