.flag {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  background-repeat: no-repeat;
  width: 24px;
  height: 24px;
  background-image: url('flags24.png');
}

.flag:not([data-country]) {
  background-image: none;
}

.flag[data-country="ad"] {
  background-position: 0 0;
}

.flag[data-country="ae"] {
  background-position: -24px 0;
}

.flag[data-country="af"] {
  background-position: -48px 0;
}

.flag[data-country="ag"] {
  background-position: -72px 0;
}

.flag[data-country="ai"] {
  background-position: -96px 0;
}

.flag[data-country="al"] {
  background-position: -120px 0;
}

.flag[data-country="am"] {
  background-position: -144px 0;
}

.flag[data-country="an"] {
  background-position: -168px 0;
}

.flag[data-country="ao"] {
  background-position: -192px 0;
}

.flag[data-country="aq"] {
  background-position: -216px 0;
}

.flag[data-country="ar"] {
  background-position: -240px 0;
}

.flag[data-country="as"] {
  background-position: -264px 0;
}

.flag[data-country="at"] {
  background-position: -288px 0;
}

.flag[data-country="au"] {
  background-position: -312px 0;
}

.flag[data-country="aw"] {
  background-position: -336px 0;
}

.flag[data-country="ax"] {
  background-position: -360px 0;
}

.flag[data-country="az"] {
  background-position: 0 -24px;
}

.flag[data-country="ba"] {
  background-position: -24px -24px;
}

.flag[data-country="bb"] {
  background-position: -48px -24px;
}

.flag[data-country="bd"] {
  background-position: -72px -24px;
}

.flag[data-country="be"] {
  background-position: -96px -24px;
}

.flag[data-country="bf"] {
  background-position: -120px -24px;
}

.flag[data-country="bg"] {
  background-position: -144px -24px;
}

.flag[data-country="bh"] {
  background-position: -168px -24px;
}

.flag[data-country="bi"] {
  background-position: -192px -24px;
}

.flag[data-country="bj"] {
  background-position: -216px -24px;
}

.flag[data-country="bl"] {
  background-position: -240px -24px;
}

.flag[data-country="bm"] {
  background-position: -264px -24px;
}

.flag[data-country="bn"] {
  background-position: -288px -24px;
}

.flag[data-country="bo"] {
  background-position: -312px -24px;
}

.flag[data-country="br"] {
  background-position: -336px -24px;
}

.flag[data-country="bs"] {
  background-position: -360px -24px;
}

.flag[data-country="bt"] {
  background-position: 0 -48px;
}

.flag[data-country="bv"] {
  background-position: -24px -48px;
}

.flag[data-country="bw"] {
  background-position: -48px -48px;
}

.flag[data-country="by"] {
  background-position: -72px -48px;
}

.flag[data-country="bz"] {
  background-position: -96px -48px;
}

.flag[data-country="ca"] {
  background-position: -120px -48px;
}

.flag[data-country="cc"] {
  background-position: -144px -48px;
}

.flag[data-country="cd"] {
  background-position: -168px -48px;
}

.flag[data-country="cf"] {
  background-position: -192px -48px;
}

.flag[data-country="cg"] {
  background-position: -216px -48px;
}

.flag[data-country="ch"] {
  background-position: -240px -48px;
}

.flag[data-country="ci"] {
  background-position: -264px -48px;
}

.flag[data-country="ck"] {
  background-position: -288px -48px;
}

.flag[data-country="cl"] {
  background-position: -312px -48px;
}

.flag[data-country="cm"] {
  background-position: -336px -48px;
}

.flag[data-country="cn"] {
  background-position: -360px -48px;
}

.flag[data-country="co"] {
  background-position: 0 -72px;
}

.flag[data-country="cr"] {
  background-position: -24px -72px;
}

.flag[data-country="cu"] {
  background-position: -48px -72px;
}

.flag[data-country="cv"] {
  background-position: -72px -72px;
}

.flag[data-country="cw"] {
  background-position: -96px -72px;
}

.flag[data-country="cx"] {
  background-position: -120px -72px;
}

.flag[data-country="cy"] {
  background-position: -144px -72px;
}

.flag[data-country="cz"] {
  background-position: -168px -72px;
}

.flag[data-country="de"] {
  background-position: -192px -72px;
}

.flag[data-country="dj"] {
  background-position: -216px -72px;
}

.flag[data-country="dk"] {
  background-position: -240px -72px;
}

.flag[data-country="dm"] {
  background-position: -264px -72px;
}

.flag[data-country="do"] {
  background-position: -288px -72px;
}

.flag[data-country="dz"] {
  background-position: -312px -72px;
}

.flag[data-country="ec"] {
  background-position: -336px -72px;
}

.flag[data-country="ee"] {
  background-position: -360px -72px;
}

.flag[data-country="eg"] {
  background-position: 0 -96px;
}

.flag[data-country="eh"] {
  background-position: -24px -96px;
}

.flag[data-country="er"] {
  background-position: -48px -96px;
}

.flag[data-country="es"] {
  background-position: -72px -96px;
}

.flag[data-country="et"] {
  background-position: -96px -96px;
}

.flag[data-country="fi"] {
  background-position: -120px -96px;
}

.flag[data-country="fj"] {
  background-position: -144px -96px;
}

.flag[data-country="fk"] {
  background-position: -168px -96px;
}

.flag[data-country="fm"] {
  background-position: -192px -96px;
}

.flag[data-country="fo"] {
  background-position: -216px -96px;
}

.flag[data-country="fr"] {
  background-position: -240px -96px;
}

.flag[data-country="ga"] {
  background-position: -264px -96px;
}

.flag[data-country="gb"] {
  background-position: -288px -96px;
}

.flag[data-country="gd"] {
  background-position: -312px -96px;
}

.flag[data-country="ge"] {
  background-position: -336px -96px;
}

.flag[data-country="gf"] {
  background-position: -360px -96px;
}

.flag[data-country="gg"] {
  background-position: 0 -120px;
}

.flag[data-country="gh"] {
  background-position: -24px -120px;
}

.flag[data-country="gi"] {
  background-position: -48px -120px;
}

.flag[data-country="gl"] {
  background-position: -72px -120px;
}

.flag[data-country="gm"] {
  background-position: -96px -120px;
}

.flag[data-country="gn"] {
  background-position: -120px -120px;
}

.flag[data-country="gp"] {
  background-position: -144px -120px;
}

.flag[data-country="gq"] {
  background-position: -168px -120px;
}

.flag[data-country="gr"] {
  background-position: -192px -120px;
}

.flag[data-country="gs"] {
  background-position: -216px -120px;
}

.flag[data-country="gt"] {
  background-position: -240px -120px;
}

.flag[data-country="gu"] {
  background-position: -264px -120px;
}

.flag[data-country="gw"] {
  background-position: -288px -120px;
}

.flag[data-country="gy"] {
  background-position: -312px -120px;
}

.flag[data-country="hk"] {
  background-position: -336px -120px;
}

.flag[data-country="hm"] {
  background-position: -360px -120px;
}

.flag[data-country="hn"] {
  background-position: 0 -144px;
}

.flag[data-country="hr"] {
  background-position: -24px -144px;
}

.flag[data-country="ht"] {
  background-position: -48px -144px;
}

.flag[data-country="hu"] {
  background-position: -72px -144px;
}

.flag[data-country="id"] {
  background-position: -96px -144px;
}

.flag[data-country="ie"] {
  background-position: -120px -144px;
}

.flag[data-country="il"] {
  background-position: -144px -144px;
}

.flag[data-country="im"] {
  background-position: -168px -144px;
}

.flag[data-country="in"] {
  background-position: -192px -144px;
}

.flag[data-country="io"] {
  background-position: -216px -144px;
}

.flag[data-country="iq"] {
  background-position: -240px -144px;
}

.flag[data-country="ir"] {
  background-position: -264px -144px;
}

.flag[data-country="is"] {
  background-position: -288px -144px;
}

.flag[data-country="it"] {
  background-position: -312px -144px;
}

.flag[data-country="je"] {
  background-position: -336px -144px;
}

.flag[data-country="jm"] {
  background-position: -360px -144px;
}

.flag[data-country="jo"] {
  background-position: 0 -168px;
}

.flag[data-country="jp"] {
  background-position: -24px -168px;
}

.flag[data-country="ke"] {
  background-position: -48px -168px;
}

.flag[data-country="kg"] {
  background-position: -72px -168px;
}

.flag[data-country="kh"] {
  background-position: -96px -168px;
}

.flag[data-country="ki"] {
  background-position: -120px -168px;
}

.flag[data-country="km"] {
  background-position: -144px -168px;
}

.flag[data-country="kn"] {
  background-position: -168px -168px;
}

.flag[data-country="kp"] {
  background-position: -192px -168px;
}

.flag[data-country="kr"] {
  background-position: -216px -168px;
}

.flag[data-country="kw"] {
  background-position: -240px -168px;
}

.flag[data-country="ky"] {
  background-position: -264px -168px;
}

.flag[data-country="kz"] {
  background-position: -288px -168px;
}

.flag[data-country="la"] {
  background-position: -312px -168px;
}

.flag[data-country="lb"] {
  background-position: -336px -168px;
}

.flag[data-country="lc"] {
  background-position: -360px -168px;
}

.flag[data-country="li"] {
  background-position: 0 -192px;
}

.flag[data-country="lk"] {
  background-position: -24px -192px;
}

.flag[data-country="lr"] {
  background-position: -48px -192px;
}

.flag[data-country="ls"] {
  background-position: -72px -192px;
}

.flag[data-country="lt"] {
  background-position: -96px -192px;
}

.flag[data-country="lu"] {
  background-position: -120px -192px;
}

.flag[data-country="lv"] {
  background-position: -144px -192px;
}

.flag[data-country="ly"] {
  background-position: -168px -192px;
}

.flag[data-country="ma"] {
  background-position: -192px -192px;
}

.flag[data-country="mc"] {
  background-position: -216px -192px;
}

.flag[data-country="md"] {
  background-position: -240px -192px;
}

.flag[data-country="me"] {
  background-position: -264px -192px;
}

.flag[data-country="mf"] {
  background-position: -288px -192px;
}

.flag[data-country="mg"] {
  background-position: -312px -192px;
}

.flag[data-country="mh"] {
  background-position: -336px -192px;
}

.flag[data-country="mk"] {
  background-position: -360px -192px;
}

.flag[data-country="ml"] {
  background-position: 0 -216px;
}

.flag[data-country="mm"] {
  background-position: -24px -216px;
}

.flag[data-country="mn"] {
  background-position: -48px -216px;
}

.flag[data-country="mo"] {
  background-position: -72px -216px;
}

.flag[data-country="mp"] {
  background-position: -96px -216px;
}

.flag[data-country="mq"] {
  background-position: -120px -216px;
}

.flag[data-country="mr"] {
  background-position: -144px -216px;
}

.flag[data-country="ms"] {
  background-position: -168px -216px;
}

.flag[data-country="mt"] {
  background-position: -192px -216px;
}

.flag[data-country="mu"] {
  background-position: -216px -216px;
}

.flag[data-country="mv"] {
  background-position: -240px -216px;
}

.flag[data-country="mw"] {
  background-position: -264px -216px;
}

.flag[data-country="mx"] {
  background-position: -288px -216px;
}

.flag[data-country="my"] {
  background-position: -312px -216px;
}

.flag[data-country="mz"] {
  background-position: -336px -216px;
}

.flag[data-country="na"] {
  background-position: -360px -216px;
}

.flag[data-country="nc"] {
  background-position: 0 -240px;
}

.flag[data-country="ne"] {
  background-position: -24px -240px;
}

.flag[data-country="nf"] {
  background-position: -48px -240px;
}

.flag[data-country="ng"] {
  background-position: -72px -240px;
}

.flag[data-country="ni"] {
  background-position: -96px -240px;
}

.flag[data-country="nl"] {
  background-position: -120px -240px;
}

.flag[data-country="no"] {
  background-position: -144px -240px;
}

.flag[data-country="np"] {
  background-position: -168px -240px;
}

.flag[data-country="nr"] {
  background-position: -192px -240px;
}

.flag[data-country="nu"] {
  background-position: -216px -240px;
}

.flag[data-country="nz"] {
  background-position: -240px -240px;
}

.flag[data-country="om"] {
  background-position: -264px -240px;
}

.flag[data-country="pa"] {
  background-position: -288px -240px;
}

.flag[data-country="pe"] {
  background-position: -312px -240px;
}

.flag[data-country="pf"] {
  background-position: -336px -240px;
}

.flag[data-country="pg"] {
  background-position: -360px -240px;
}

.flag[data-country="ph"] {
  background-position: 0 -264px;
}

.flag[data-country="pk"] {
  background-position: -24px -264px;
}

.flag[data-country="pl"] {
  background-position: -48px -264px;
}

.flag[data-country="pm"] {
  background-position: -72px -264px;
}

.flag[data-country="pn"] {
  background-position: -96px -264px;
}

.flag[data-country="pr"] {
  background-position: -120px -264px;
}

.flag[data-country="ps"] {
  background-position: -144px -264px;
}

.flag[data-country="pt"] {
  background-position: -168px -264px;
}

.flag[data-country="pw"] {
  background-position: -192px -264px;
}

.flag[data-country="py"] {
  background-position: -216px -264px;
}

.flag[data-country="qa"] {
  background-position: -240px -264px;
}

.flag[data-country="re"] {
  background-position: -264px -264px;
}

.flag[data-country="ro"] {
  background-position: -288px -264px;
}

.flag[data-country="rs"] {
  background-position: -312px -264px;
}

.flag[data-country="ru"] {
  background-position: -336px -264px;
}

.flag[data-country="rw"] {
  background-position: -360px -264px;
}

.flag[data-country="sa"] {
  background-position: 0 -288px;
}

.flag[data-country="sb"] {
  background-position: -24px -288px;
}

.flag[data-country="sc"] {
  background-position: -48px -288px;
}

.flag[data-country="sd"] {
  background-position: -72px -288px;
}

.flag[data-country="se"] {
  background-position: -96px -288px;
}

.flag[data-country="sg"] {
  background-position: -120px -288px;
}

.flag[data-country="sh"] {
  background-position: -144px -288px;
}

.flag[data-country="si"] {
  background-position: -168px -288px;
}

.flag[data-country="sj"] {
  background-position: -192px -288px;
}

.flag[data-country="sk"] {
  background-position: -216px -288px;
}

.flag[data-country="sl"] {
  background-position: -240px -288px;
}

.flag[data-country="sm"] {
  background-position: -264px -288px;
}

.flag[data-country="sn"] {
  background-position: -288px -288px;
}

.flag[data-country="so"] {
  background-position: -312px -288px;
}

.flag[data-country="sr"] {
  background-position: -336px -288px;
}

.flag[data-country="ss"] {
  background-position: -360px -288px;
}

.flag[data-country="st"] {
  background-position: 0 -312px;
}

.flag[data-country="sv"] {
  background-position: -24px -312px;
}

.flag[data-country="sw"] {
  background-position: -48px -312px;
}

.flag[data-country="sy"] {
  background-position: -72px -312px;
}

.flag[data-country="sz"] {
  background-position: -96px -312px;
}

.flag[data-country="tc"] {
  background-position: -120px -312px;
}

.flag[data-country="td"] {
  background-position: -144px -312px;
}

.flag[data-country="tf"] {
  background-position: -168px -312px;
}

.flag[data-country="tg"] {
  background-position: -192px -312px;
}

.flag[data-country="th"] {
  background-position: -216px -312px;
}

.flag[data-country="tj"] {
  background-position: -240px -312px;
}

.flag[data-country="tk"] {
  background-position: -264px -312px;
}

.flag[data-country="tl"] {
  background-position: -288px -312px;
}

.flag[data-country="tm"] {
  background-position: -312px -312px;
}

.flag[data-country="tn"] {
  background-position: -336px -312px;
}

.flag[data-country="to"] {
  background-position: -360px -312px;
}

.flag[data-country="tr"] {
  background-position: 0 -336px;
}

.flag[data-country="tt"] {
  background-position: -24px -336px;
}

.flag[data-country="tv"] {
  background-position: -48px -336px;
}

.flag[data-country="tw"] {
  background-position: -72px -336px;
}

.flag[data-country="tz"] {
  background-position: -96px -336px;
}

.flag[data-country="ua"] {
  background-position: -120px -336px;
}

.flag[data-country="ug"] {
  background-position: -144px -336px;
}

.flag[data-country="um"] {
  background-position: -168px -336px;
}

.flag[data-country="us"],
.flag[data-country="en"] {
  background-position: -192px -336px;
}

.flag[data-country="uy"] {
  background-position: -216px -336px;
}

.flag[data-country="uz"] {
  background-position: -240px -336px;
}

.flag[data-country="va"] {
  background-position: -264px -336px;
}

.flag[data-country="vc"] {
  background-position: -288px -336px;
}

.flag[data-country="ve"] {
  background-position: -312px -336px;
}

.flag[data-country="vg"] {
  background-position: -336px -336px;
}

.flag[data-country="vi"] {
  background-position: -360px -336px;
}

.flag[data-country="vn"] {
  background-position: 0 -360px;
}

.flag[data-country="vu"] {
  background-position: -24px -360px;
}

.flag[data-country="wf"] {
  background-position: -48px -360px;
}

.flag[data-country="ws"] {
  background-position: -72px -360px;
}

.flag[data-country="ye"] {
  background-position: -96px -360px;
}

.flag[data-country="yt"] {
  background-position: -120px -360px;
}

.flag[data-country="za"] {
  background-position: -144px -360px;
}

.flag[data-country="zm"] {
  background-position: -168px -360px;
}

.flag[data-country="zw"] {
  background-position: -192px -360px;
}