html,body{margin:0;padding:0}
body{font-family:Arial,Helvetica,sans-serif;font-size:20px;line-height:1.35;color:#12202b;background:#f3f8fc;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-user-select:none}
input,textarea,select{-webkit-user-select:text}
*{-webkit-box-sizing:border-box;box-sizing:border-box}
.clr:after,.row:after{content:"";display:block;clear:both}
#staffHot{position:fixed;left:0;top:0;width:90px;height:90px;z-index:9000;background:transparent}
#hdr{position:fixed;left:0;top:0;right:0;height:120px;background:#fff;border-bottom:3px solid #1d7fd6;z-index:100}
#brandBar{height:76px;padding:10px 24px 0 20px;background:#fff}
#brandLogo{display:block;float:left;height:56px;width:auto}
#saveInd{float:right;font-size:18px;font-weight:normal;color:#14578f;line-height:56px}
#saveInd.bad{color:#8a4b00;font-weight:bold}
#progBar{height:41px;background:#f3f8fc;padding:0 24px;color:#14578f;font-size:20px;font-weight:bold;line-height:41px}
#progText{float:left;width:200px;white-space:nowrap}
#barOuter{margin-left:200px;position:relative;top:14px;height:12px;background:#d3e5f3;border-radius:6px;overflow:hidden}
#barFill{height:12px;width:0;background:#1d7fd6;border-radius:6px}
#main{padding:134px 20px 112px 20px}
#screen{background:#fff;border:1px solid #d3e5f3;border-radius:16px;padding:24px 24px 12px 24px;min-height:300px}
#ftr{position:fixed;left:0;right:0;bottom:0;height:96px;background:#fff;border-top:1px solid #d3e5f3;padding:14px 20px;z-index:100}
.btn{display:block;height:68px;line-height:68px;min-width:170px;padding:0 28px;border-radius:14px;font-size:24px;font-weight:bold;text-align:center;cursor:pointer}
.btn:active{opacity:.8}
.btn-pri{background:#1d7fd6;color:#fff;float:right;min-width:240px}
.btn-sec{background:#fff;color:#14578f;border:2px solid #1d7fd6;line-height:64px;float:left}
#btnReview{margin-left:16px}
.btn-off{background:#7f9db5;color:#fff;border-color:#7f9db5}
.btn-danger{background:#b3261e;color:#fff}
h1{font-size:40px;margin:6px 0 10px 0;color:#14578f}
h2{font-size:32px;margin:0 0 6px 0;color:#14578f;border-left:6px solid #1d7fd6;padding-left:14px;line-height:1.15}
.intro{font-size:20px;color:#4a6072;margin:0 0 18px 20px}
.row{margin:0 -8px}
.f{float:left;padding:0 8px;margin-bottom:18px}
.lab{display:block;font-size:20px;font-weight:bold;color:#0f2233;margin:8px 0 8px 0;line-height:1.25}
.req{color:#b3261e}
.hint{font-size:17px;color:#52687a;margin:-4px 0 9px 0;line-height:1.3}
input.t,select.t,textarea.t{display:block;width:100%;height:64px;font-size:22px;padding:0 16px;border:2px solid #bcd9ee;border-radius:12px;background:#fff;color:#0f2233;font-family:Arial,Helvetica,sans-serif;margin:0}
textarea.t{height:120px;padding:12px 16px;line-height:1.3}
input.t:focus,textarea.t:focus,select.t:focus{border-color:#1d7fd6;outline:none;background:#fff;-webkit-box-shadow:0 0 0 3px #bcd9ee;box-shadow:0 0 0 3px #bcd9ee}
input.t::-webkit-input-placeholder,textarea.t::-webkit-input-placeholder{color:#8a9db0}
.pickbtn{position:relative;min-height:64px;line-height:28px;padding:15px 60px 15px 16px;border:2px solid #bcd9ee;border-radius:12px;background:#fff;color:#0f2233;font-size:22px;cursor:pointer;overflow:hidden}
.pickbtn.empty{color:#5d7388}
.pickbtn:active{background:#e3f1fb}
.pickbtn:before{content:"";position:absolute;right:0;top:0;bottom:0;width:52px;background:#e3f1fb;border-left:2px solid #bcd9ee}
.pickbtn:after{content:"";position:absolute;right:19px;top:50%;margin-top:-10px;width:11px;height:11px;border:solid #14578f;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
.bad .t,.bad .pickbtn{border-color:#d64545;background:#fff7f7}
.bad .chip,.bad .seg{border-color:#e08a8a}
.seg{float:left;min-width:130px;min-height:62px;line-height:26px;padding:15px 24px;margin:0 10px 10px 0;border:2px solid #bcd9ee;border-radius:12px;background:#fff;font-size:22px;text-align:center;cursor:pointer;color:#0f2233}
.seg.on{background:#1d7fd6;border-color:#1d7fd6;color:#fff;font-weight:bold}
.segs.joined{display:inline-block;border:2px solid #bcd9ee;border-radius:14px;overflow:hidden;white-space:nowrap;margin:0 0 10px 0;vertical-align:top;background:#fff}
.segs.joined .seg{float:none;display:inline-block;margin:0;border:0;border-right:2px solid #bcd9ee;border-radius:0;height:58px;line-height:58px;min-width:120px;padding:0 30px}
.segs.joined .seg:last-child{border-right:0}
.segs.joined .seg.on{background:#1d7fd6;border-color:#1d7fd6;color:#fff;font-weight:bold}
.seg.on:active{background:#14578f}
.seg:active{background:#e3f1fb}
.err{color:#c0302c;font-size:18px;font-weight:bold;margin-top:6px;line-height:1.25}
.chipbox{margin:0 -5px}
.chipcell{float:left;padding:0 5px 10px 5px}
.chip{height:72px;overflow:hidden;padding:8px 12px 8px 56px;border:2px solid #bcd9ee;border-radius:14px;background:#fff;font-size:20px;line-height:1.2;color:#0f2233;position:relative;cursor:pointer;display:table;width:100%}
.chip:active{background:#e3f1fb}
.chip span{display:table-cell;vertical-align:middle;height:54px}
.chip:before{content:"";position:absolute;left:14px;top:50%;margin-top:-16px;width:28px;height:28px;border:2px solid #9bbbd6;border-radius:9px;background:#fff}
.chip.on{background:#1d7fd6;border-color:#1d7fd6;color:#fff;font-weight:bold}
.chip.on:active{background:#14578f}
.chip.on:before{background:#fff;border-color:#fff}
.chip.on:after{content:"";position:absolute;left:26px;top:50%;margin-top:-10px;width:7px;height:14px;border:solid #1d7fd6;border-width:0 3px 3px 0;-webkit-transform:rotate(45deg);transform:rotate(45deg)}
.chip.cust{background:#fff3cf;border-color:#c9a227;color:#0f2233}
.chip.cust:before,.chip.cust:after{display:none}
.chip.cust{padding-left:16px}
.chip.agree{height:auto;min-height:76px}
.chip.agree span{height:auto;padding:4px 0}
.chip small{font-size:17px;font-weight:normal;color:#52687a}
.chip.on small{color:#e3f1fb}
.note{background:#fff3cf;border:2px solid #e3c35a;border-radius:12px;padding:12px 16px;font-size:19px;margin:4px 0 12px 0}
.noteinfo{background:#e3f1fb;border-color:#1d7fd6}
.legal{border:2px solid #bcd9ee;border-radius:8px;padding:6px 18px;margin:0 0 14px 0;background:#fafcfe;font-size:20px}
.legal p{margin:10px 0}
.big{font-size:28px}
.welcome{text-align:center;padding:20px 0 10px 0}
.welcome img{display:block;width:280px;height:auto;margin:0 auto 18px auto}
.welcome .big-btn{display:inline-block;margin:26px 0 20px 0;height:96px;line-height:96px;padding:0 90px;font-size:36px}
.priv{font-size:20px;color:#33474f;max-width:640px;margin:0 auto}
.sigwrap{border:2px solid #9bbbd6;border-radius:14px;background:#fff;margin:6px 0 8px 0;max-width:760px;overflow:hidden}
#sigCanvas{display:block;width:100%;background:#fff}
.agree{margin:6px 0 12px 0}
.rsec{border:2px solid #d3e5f3;border-radius:14px;margin-bottom:16px;overflow:hidden}
.rhead{background:#e3f1fb;padding:10px 16px;font-weight:bold;font-size:22px;color:#14578f}
.rhead .edit{float:right;border:2px solid #1d7fd6;border-radius:10px;padding:4px 20px;background:#fff;cursor:pointer;font-size:20px;color:#14578f}
.rrow{padding:6px 14px;border-top:1px solid #d9e8f3;font-size:19px}
.rl{float:left;width:34%;font-weight:bold;color:#2b3d46}
.rv{margin-left:36%}
.thanks{text-align:center;padding:60px 0}
.thanks img{display:block;width:280px;height:auto;margin:0 auto 24px auto}
.tick{display:inline-block;width:120px;height:120px;line-height:120px;border-radius:60px;background:#1d7fd6;color:#fff;font-size:80px}
#overlay{display:none;position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(10,20,40,.82);z-index:9500}
#overlayCell{display:table;width:100%;height:100%}
#dialog{display:table-cell;vertical-align:middle;text-align:center}
.dlg{display:inline-block;width:680px;max-width:94%;background:#fff;border-radius:12px;padding:26px 30px;text-align:left}
.dlg h2{margin-bottom:10px}
.dlg p{margin:0 0 16px 0;font-size:22px}
.dlgbtns .btn{float:none;display:inline-block;margin:0 10px 8px 0;min-width:200px}
.pin{width:460px;text-align:center}
.pindots{height:56px;font-size:46px;letter-spacing:12px;color:#14578f;margin-bottom:6px}
.pinkeys{margin:0 -5px}
.pinkey{float:left;width:33.33%;padding:0 5px 10px 5px}
.pinkey div{height:96px;line-height:90px;font-size:40px;font-weight:bold;border:3px solid #1d7fd6;border-radius:12px;color:#14578f;background:#fff;cursor:pointer;text-align:center}
.pinmsg{color:#b3261e;font-weight:bold;min-height:28px;font-size:20px}
.compact #hdr,.compact #ftr{position:static}
.compact #hdr{height:auto}
.compact #brandBar{height:70px}
.compact #main{padding-top:8px;padding-bottom:8px}
.compact #ftr{height:auto;padding-bottom:14px}
.compact #ftr:after{content:"";display:block;clear:both}
/* Portrait (primary layout): single column, big targets */
@media (max-width:900px){
 .f{width:100% !important}
 .f.pw50{width:50% !important}
 .f.pw40{width:40% !important}
 .f.pw60{width:60% !important}
 .f.pw30{width:30% !important}
 .f.pw33{width:33.33% !important}
 .f.pw66{width:66.66% !important}
 .chipcell{width:50% !important}
 .chipcell.pc3{width:33.33% !important}
 .rl{float:none;width:100%}
 .rv{margin-left:0;margin-bottom:2px}
 .btn{min-width:150px}
 .btn-pri{min-width:260px}
 .seg{min-width:150px}
 .dlg{width:720px}
 .pin{width:520px}
}

/* picker sheet */
#sheet{position:fixed;left:0;top:0;right:0;bottom:0;background:rgba(10,20,40,.72);z-index:9400}
.sheetpanel{position:absolute;left:3%;right:3%;top:1.5%;height:97%;max-width:1000px;margin:0 auto;background:#fff;border-radius:18px;overflow:hidden}
.sheethead{border-radius:18px 18px 0 0;height:88px;padding:14px 18px;border-bottom:2px solid #d3e5f3;background:#fff}
.sheettitle{font-size:28px;font-weight:bold;color:#14578f;line-height:60px;white-space:nowrap;overflow:hidden;margin-right:150px}
.sheetclose{float:right;height:60px;line-height:56px;padding:0 28px;border:2px solid #1d7fd6;border-radius:12px;font-size:22px;font-weight:bold;color:#14578f;background:#fff;cursor:pointer}
.sheetclose:active{background:#e3f1fb}
.sheetbody{position:absolute;left:0;right:0;top:88px;bottom:0;padding:16px 12px 16px 12px;overflow-y:auto;-webkit-overflow-scrolling:touch;background:#f3f8fc}
.tilebox{margin:0}
.tilecell{float:left;padding:0 5px 8px 5px}
.tile{display:table;width:100%;height:68px;border:2px solid #bcd9ee;border-radius:14px;background:#fff;color:#0f2233;font-size:22px;text-align:center;cursor:pointer;position:relative;overflow:hidden}
.tile span{display:table-cell;vertical-align:middle;padding:0 6px;line-height:1.15}
.tile:active{background:#e3f1fb}
.tile.on{background:#1d7fd6;border-color:#1d7fd6;color:#fff;font-weight:bold}
.tile.back{border-color:#1d7fd6;color:#14578f;font-weight:bold}

/* address suggestions */
.suglist{border:2px solid #1d7fd6;border-radius:12px;background:#fff;margin-top:8px;overflow:hidden}
.sugrow{display:table;width:100%;height:64px;border-top:1px solid #d3e5f3;font-size:22px;line-height:1.2;color:#0f2233;cursor:pointer}
.sugrow:first-child{border-top:0}
.sugrow span{display:table-cell;vertical-align:middle;padding:0 16px}
.sugrow:active{background:#e3f1fb}
.sugattr{text-align:right;font-size:14px;color:#52687a;padding:4px 14px 6px 14px;background:#f3f8fc;border-top:1px solid #d3e5f3}
.segs.joined .seg:first-child{border-radius:12px 0 0 12px}
.segs.joined .seg:last-child{border-radius:0 12px 12px 0}
.chip span span{display:inline;height:auto;padding:0}
.chip.on .req{color:#ffd9d6}

/* language home page + switcher */
.pick{font-size:19px;color:#4a6072;margin:4px auto 14px auto;max-width:700px;line-height:1.5}
.langgrid{margin:0 -6px;text-align:left}
.langcell{float:left;width:50%;padding:0 6px 12px 6px}
.langtile{display:table;width:100%;height:96px;border:2px solid #bcd9ee;border-radius:16px;background:#fff;cursor:pointer;color:#0f2233}
.langtile:active{background:#e3f1fb}
.langtile img{display:table-cell;float:left;width:72px;height:48px;margin:23px 0 0 14px;border:1px solid #c5d3df}
.langtile span{display:block;padding:0 6px 0 12px;line-height:96px;font-size:23px;font-weight:bold;white-space:nowrap;overflow:hidden}
#langBtn{float:right;display:none;height:56px;margin-left:14px;padding:0 16px 0 12px;border:2px solid #1d7fd6;border-radius:12px;background:#fff;color:#14578f;font-size:20px;font-weight:bold;line-height:52px;cursor:pointer;white-space:nowrap}
#langBtn img{display:inline-block;width:36px;height:24px;margin:-4px 10px 0 0;vertical-align:middle;border:1px solid #c5d3df}
#langBtn:active{background:#e3f1fb}

/* right-to-left (Arabic) */
html[dir=rtl] body{text-align:right}
html[dir=rtl] .f,html[dir=rtl] .seg,html[dir=rtl] .chipcell,html[dir=rtl] .tilecell,html[dir=rtl] .pinkey,html[dir=rtl] .rl{float:right}
html[dir=rtl] .seg{margin:0 0 10px 10px}
html[dir=rtl] h2{border-left:0;padding-left:0;border-right:6px solid #1d7fd6;padding-right:14px}
html[dir=rtl] .intro{margin:0 20px 18px 0}
html[dir=rtl] .segs.joined .seg{border-right:0;border-left:2px solid #bcd9ee}
html[dir=rtl] .segs.joined .seg:last-child{border-left:0}
html[dir=rtl] .segs.joined .seg:first-child{border-radius:0 12px 12px 0}
html[dir=rtl] .segs.joined .seg:last-child{border-radius:12px 0 0 12px}
html[dir=rtl] .pickbtn{padding:15px 16px 15px 60px}
html[dir=rtl] .pickbtn:before{right:auto;left:0;border-left:0;border-right:2px solid #bcd9ee}
html[dir=rtl] .pickbtn:after{right:auto;left:19px}
html[dir=rtl] .chip{padding:8px 56px 8px 12px}
html[dir=rtl] .chip:before{left:auto;right:14px}
html[dir=rtl] .chip.on:after{left:auto;right:26px}
html[dir=rtl] .chip.cust{padding:8px 16px}
html[dir=rtl] .rl{width:34%}
html[dir=rtl] .rv{margin-left:0;margin-right:36%}
html[dir=rtl] .rhead .edit{float:left}
html[dir=rtl] .btn-pri{float:left}
html[dir=rtl] .btn-sec{float:right}
html[dir=rtl] #btnReview{margin-left:0;margin-right:16px}
html[dir=rtl] #progText{float:right;width:200px}
html[dir=rtl] #barOuter{margin-left:0;margin-right:200px}
html[dir=rtl] .dlg{text-align:right}
html[dir=rtl] .sheetclose{float:left}
html[dir=rtl] .sheettitle{margin-right:0;margin-left:150px}
html[dir=rtl] .sugattr{text-align:left}
html[dir=rtl] .langgrid,html[dir=rtl] .welcome{text-align:center}
html[dir=rtl] .langtile img{float:right;margin:23px 14px 0 0}
html[dir=rtl] .langtile span{padding:0 12px 0 6px}
html[dir=rtl] input[type=tel],html[dir=rtl] input[type=email]{direction:ltr;text-align:left}
html[dir=rtl] #sigCanvas{direction:ltr}
@media (max-width:900px){
 html[dir=rtl] .rl{float:none;width:100%}
 html[dir=rtl] .rv{margin-right:0}
}

/* Arabic glyphs come out about 30% smaller than Latin at the same size on this tablet's fallback font */
html[lang=ar] .lab,html[lang=ar] .intro,html[lang=ar] .legal,html[lang=ar] .rl,html[lang=ar] .rv,html[lang=ar] .rrow{font-size:25px}
html[lang=ar] .hint,html[lang=ar] .err,html[lang=ar] .note,html[lang=ar] .chip small,html[lang=ar] .pick{font-size:22px}
html[lang=ar] .seg,html[lang=ar] .chip,html[lang=ar] .tile,html[lang=ar] .pickbtn,html[lang=ar] input.t,html[lang=ar] textarea.t{font-size:27px}
html[lang=ar] .btn,html[lang=ar] #progText,html[lang=ar] #langBtn,html[lang=ar] .rhead,html[lang=ar] .sheetclose{font-size:27px}
html[lang=ar] h2{font-size:36px}
html[lang=ar] .langtile span{font-size:30px}
html[lang=ar] .dlg p{font-size:26px}