options.css 22 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121
  1. @charset "UTF-8";
  2. @font-face {
  3. font-family: 'Roboto-Light';
  4. src: url("/fonts/Roboto-Light.ttf") format("truetype"); }
  5. @font-face {
  6. font-family: 'Roboto';
  7. src: url("/fonts/Roboto-Regular.ttf") format("truetype"); }
  8. @font-face {
  9. font-family: 'Roboto';
  10. src: url("/fonts/Roboto-Italic.ttf") format("truetype");
  11. font-style: italic; }
  12. @font-face {
  13. font-family: 'Roboto';
  14. src: url("/fonts/Roboto-Bold.ttf") format("truetype");
  15. font-weight: bold; }
  16. .iti-flag {
  17. width: 16px;
  18. height: 11px;
  19. background: url("../img/flags.png"); }
  20. .iti-flag.ad {
  21. background-position: -16px 0; }
  22. .iti-flag.ae {
  23. background-position: -32px 0; }
  24. .iti-flag.af {
  25. background-position: -48px 0; }
  26. .iti-flag.ag {
  27. background-position: -64px 0; }
  28. .iti-flag.ai {
  29. background-position: -80px 0; }
  30. .iti-flag.al {
  31. background-position: -96px 0; }
  32. .iti-flag.am {
  33. background-position: -112px 0; }
  34. .iti-flag.ao {
  35. background-position: -128px 0; }
  36. .iti-flag.ar {
  37. background-position: -144px 0; }
  38. .iti-flag.as {
  39. background-position: -160px 0; }
  40. .iti-flag.at {
  41. background-position: -176px 0; }
  42. .iti-flag.au {
  43. background-position: -192px 0; }
  44. .iti-flag.aw {
  45. background-position: -208px 0; }
  46. .iti-flag.az {
  47. background-position: -224px 0; }
  48. .iti-flag.ba {
  49. background-position: -240px 0; }
  50. .iti-flag.bb {
  51. background-position: 0 -11px; }
  52. .iti-flag.bd {
  53. background-position: -16px -11px; }
  54. .iti-flag.be {
  55. background-position: -32px -11px; }
  56. .iti-flag.bf {
  57. background-position: -48px -11px; }
  58. .iti-flag.bg {
  59. background-position: -64px -11px; }
  60. .iti-flag.bh {
  61. background-position: -80px -11px; }
  62. .iti-flag.bi {
  63. background-position: -96px -11px; }
  64. .iti-flag.bj {
  65. background-position: -112px -11px; }
  66. .iti-flag.bm {
  67. background-position: -128px -11px; }
  68. .iti-flag.bn {
  69. background-position: -144px -11px; }
  70. .iti-flag.bo {
  71. background-position: -160px -11px; }
  72. .iti-flag.br {
  73. background-position: -176px -11px; }
  74. .iti-flag.bs {
  75. background-position: -192px -11px; }
  76. .iti-flag.bt {
  77. background-position: -208px -11px; }
  78. .iti-flag.bw {
  79. background-position: -224px -11px; }
  80. .iti-flag.by {
  81. background-position: -240px -11px; }
  82. .iti-flag.bz {
  83. background-position: 0 -22px; }
  84. .iti-flag.ca {
  85. background-position: -16px -22px; }
  86. .iti-flag.cd {
  87. background-position: -32px -22px; }
  88. .iti-flag.cf {
  89. background-position: -48px -22px; }
  90. .iti-flag.cg {
  91. background-position: -64px -22px; }
  92. .iti-flag.ch {
  93. background-position: -80px -22px; }
  94. .iti-flag.ci {
  95. background-position: -96px -22px; }
  96. .iti-flag.ck {
  97. background-position: -112px -22px; }
  98. .iti-flag.cl {
  99. background-position: -128px -22px; }
  100. .iti-flag.cm {
  101. background-position: -144px -22px; }
  102. .iti-flag.cn {
  103. background-position: -160px -22px; }
  104. .iti-flag.co {
  105. background-position: -176px -22px; }
  106. .iti-flag.cr {
  107. background-position: -192px -22px; }
  108. .iti-flag.cu {
  109. background-position: -208px -22px; }
  110. .iti-flag.cv {
  111. background-position: -224px -22px; }
  112. .iti-flag.cw {
  113. background-position: -240px -22px; }
  114. .iti-flag.cy {
  115. background-position: 0 -33px; }
  116. .iti-flag.cz {
  117. background-position: -16px -33px; }
  118. .iti-flag.de {
  119. background-position: -32px -33px; }
  120. .iti-flag.dj {
  121. background-position: -48px -33px; }
  122. .iti-flag.dk {
  123. background-position: -64px -33px; }
  124. .iti-flag.dm {
  125. background-position: -80px -33px; }
  126. .iti-flag.do {
  127. background-position: -96px -33px; }
  128. .iti-flag.dz {
  129. background-position: -112px -33px; }
  130. .iti-flag.ec {
  131. background-position: -128px -33px; }
  132. .iti-flag.ee {
  133. background-position: -144px -33px; }
  134. .iti-flag.eg {
  135. background-position: -160px -33px; }
  136. .iti-flag.er {
  137. background-position: -176px -33px; }
  138. .iti-flag.es {
  139. background-position: -192px -33px; }
  140. .iti-flag.et {
  141. background-position: -208px -33px; }
  142. .iti-flag.fi {
  143. background-position: -224px -33px; }
  144. .iti-flag.fj {
  145. background-position: -240px -33px; }
  146. .iti-flag.fk {
  147. background-position: 0 -44px; }
  148. .iti-flag.fm {
  149. background-position: -16px -44px; }
  150. .iti-flag.fo {
  151. background-position: -32px -44px; }
  152. .iti-flag.fr, .iti-flag.bl, .iti-flag.mf {
  153. background-position: -48px -44px; }
  154. .iti-flag.ga {
  155. background-position: -64px -44px; }
  156. .iti-flag.gb {
  157. background-position: -80px -44px; }
  158. .iti-flag.gd {
  159. background-position: -96px -44px; }
  160. .iti-flag.ge {
  161. background-position: -112px -44px; }
  162. .iti-flag.gf {
  163. background-position: -128px -44px; }
  164. .iti-flag.gh {
  165. background-position: -144px -44px; }
  166. .iti-flag.gi {
  167. background-position: -160px -44px; }
  168. .iti-flag.gl {
  169. background-position: -176px -44px; }
  170. .iti-flag.gm {
  171. background-position: -192px -44px; }
  172. .iti-flag.gn {
  173. background-position: -208px -44px; }
  174. .iti-flag.gp {
  175. background-position: -224px -44px; }
  176. .iti-flag.gq {
  177. background-position: -240px -44px; }
  178. .iti-flag.gr {
  179. background-position: 0 -55px; }
  180. .iti-flag.gt {
  181. background-position: -16px -55px; }
  182. .iti-flag.gu {
  183. background-position: -32px -55px; }
  184. .iti-flag.gw {
  185. background-position: -48px -55px; }
  186. .iti-flag.gy {
  187. background-position: -64px -55px; }
  188. .iti-flag.hk {
  189. background-position: -80px -55px; }
  190. .iti-flag.hn {
  191. background-position: -96px -55px; }
  192. .iti-flag.hr {
  193. background-position: -112px -55px; }
  194. .iti-flag.ht {
  195. background-position: -128px -55px; }
  196. .iti-flag.hu {
  197. background-position: -144px -55px; }
  198. .iti-flag.id {
  199. background-position: -160px -55px; }
  200. .iti-flag.ie {
  201. background-position: -176px -55px; }
  202. .iti-flag.il {
  203. background-position: -192px -55px; }
  204. .iti-flag.in {
  205. background-position: -208px -55px; }
  206. .iti-flag.io {
  207. background-position: -224px -55px; }
  208. .iti-flag.iq {
  209. background-position: -240px -55px; }
  210. .iti-flag.ir {
  211. background-position: 0 -66px; }
  212. .iti-flag.is {
  213. background-position: -16px -66px; }
  214. .iti-flag.it {
  215. background-position: -32px -66px; }
  216. .iti-flag.jm {
  217. background-position: -48px -66px; }
  218. .iti-flag.jo {
  219. background-position: -64px -66px; }
  220. .iti-flag.jp {
  221. background-position: -80px -66px; }
  222. .iti-flag.ke {
  223. background-position: -96px -66px; }
  224. .iti-flag.kg {
  225. background-position: -112px -66px; }
  226. .iti-flag.kh {
  227. background-position: -128px -66px; }
  228. .iti-flag.ki {
  229. background-position: -144px -66px; }
  230. .iti-flag.km {
  231. background-position: -160px -66px; }
  232. .iti-flag.kn {
  233. background-position: -176px -66px; }
  234. .iti-flag.kp {
  235. background-position: -192px -66px; }
  236. .iti-flag.kr {
  237. background-position: -208px -66px; }
  238. .iti-flag.kw {
  239. background-position: -224px -66px; }
  240. .iti-flag.ky {
  241. background-position: -240px -66px; }
  242. .iti-flag.kz {
  243. background-position: 0 -77px; }
  244. .iti-flag.la {
  245. background-position: -16px -77px; }
  246. .iti-flag.lb {
  247. background-position: -32px -77px; }
  248. .iti-flag.lc {
  249. background-position: -48px -77px; }
  250. .iti-flag.li {
  251. background-position: -64px -77px; }
  252. .iti-flag.lk {
  253. background-position: -80px -77px; }
  254. .iti-flag.lr {
  255. background-position: -96px -77px; }
  256. .iti-flag.ls {
  257. background-position: -112px -77px; }
  258. .iti-flag.lt {
  259. background-position: -128px -77px; }
  260. .iti-flag.lu {
  261. background-position: -144px -77px; }
  262. .iti-flag.lv {
  263. background-position: -160px -77px; }
  264. .iti-flag.ly {
  265. background-position: -176px -77px; }
  266. .iti-flag.ma {
  267. background-position: -192px -77px; }
  268. .iti-flag.mc {
  269. background-position: -208px -77px; }
  270. .iti-flag.md {
  271. background-position: -224px -77px; }
  272. .iti-flag.me {
  273. background-position: -112px -154px;
  274. height: 12px; }
  275. .iti-flag.mg {
  276. background-position: 0 -88px; }
  277. .iti-flag.mh {
  278. background-position: -16px -88px; }
  279. .iti-flag.mk {
  280. background-position: -32px -88px; }
  281. .iti-flag.ml {
  282. background-position: -48px -88px; }
  283. .iti-flag.mm {
  284. background-position: -64px -88px; }
  285. .iti-flag.mn {
  286. background-position: -80px -88px; }
  287. .iti-flag.mo {
  288. background-position: -96px -88px; }
  289. .iti-flag.mp {
  290. background-position: -112px -88px; }
  291. .iti-flag.mq {
  292. background-position: -128px -88px; }
  293. .iti-flag.mr {
  294. background-position: -144px -88px; }
  295. .iti-flag.ms {
  296. background-position: -160px -88px; }
  297. .iti-flag.mt {
  298. background-position: -176px -88px; }
  299. .iti-flag.mu {
  300. background-position: -192px -88px; }
  301. .iti-flag.mv {
  302. background-position: -208px -88px; }
  303. .iti-flag.mw {
  304. background-position: -224px -88px; }
  305. .iti-flag.mx {
  306. background-position: -240px -88px; }
  307. .iti-flag.my {
  308. background-position: 0 -99px; }
  309. .iti-flag.mz {
  310. background-position: -16px -99px; }
  311. .iti-flag.na {
  312. background-position: -32px -99px; }
  313. .iti-flag.nc {
  314. background-position: -48px -99px; }
  315. .iti-flag.ne {
  316. background-position: -64px -99px; }
  317. .iti-flag.nf {
  318. background-position: -80px -99px; }
  319. .iti-flag.ng {
  320. background-position: -96px -99px; }
  321. .iti-flag.ni {
  322. background-position: -112px -99px; }
  323. .iti-flag.nl, .iti-flag.bq {
  324. background-position: -128px -99px; }
  325. .iti-flag.no {
  326. background-position: -144px -99px; }
  327. .iti-flag.np {
  328. background-position: -160px -99px; }
  329. .iti-flag.nr {
  330. background-position: -176px -99px; }
  331. .iti-flag.nu {
  332. background-position: -192px -99px; }
  333. .iti-flag.nz {
  334. background-position: -208px -99px; }
  335. .iti-flag.om {
  336. background-position: -224px -99px; }
  337. .iti-flag.pa {
  338. background-position: -240px -99px; }
  339. .iti-flag.pe {
  340. background-position: 0 -110px; }
  341. .iti-flag.pf {
  342. background-position: -16px -110px; }
  343. .iti-flag.pg {
  344. background-position: -32px -110px; }
  345. .iti-flag.ph {
  346. background-position: -48px -110px; }
  347. .iti-flag.pk {
  348. background-position: -64px -110px; }
  349. .iti-flag.pl {
  350. background-position: -80px -110px; }
  351. .iti-flag.pm {
  352. background-position: -96px -110px; }
  353. .iti-flag.pr {
  354. background-position: -112px -110px; }
  355. .iti-flag.ps {
  356. background-position: -128px -110px; }
  357. .iti-flag.pt {
  358. background-position: -144px -110px; }
  359. .iti-flag.pw {
  360. background-position: -160px -110px; }
  361. .iti-flag.py {
  362. background-position: -176px -110px; }
  363. .iti-flag.qa {
  364. background-position: -192px -110px; }
  365. .iti-flag.re {
  366. background-position: -208px -110px; }
  367. .iti-flag.ro {
  368. background-position: -224px -110px; }
  369. .iti-flag.rs {
  370. background-position: -240px -110px; }
  371. .iti-flag.ru {
  372. background-position: 0 -121px; }
  373. .iti-flag.rw {
  374. background-position: -16px -121px; }
  375. .iti-flag.sa {
  376. background-position: -32px -121px; }
  377. .iti-flag.sb {
  378. background-position: -48px -121px; }
  379. .iti-flag.sc {
  380. background-position: -64px -121px; }
  381. .iti-flag.sd {
  382. background-position: -80px -121px; }
  383. .iti-flag.se {
  384. background-position: -96px -121px; }
  385. .iti-flag.sg {
  386. background-position: -112px -121px; }
  387. .iti-flag.sh {
  388. background-position: -128px -121px; }
  389. .iti-flag.si {
  390. background-position: -144px -121px; }
  391. .iti-flag.sk {
  392. background-position: -160px -121px; }
  393. .iti-flag.sl {
  394. background-position: -176px -121px; }
  395. .iti-flag.sm {
  396. background-position: -192px -121px; }
  397. .iti-flag.sn {
  398. background-position: -208px -121px; }
  399. .iti-flag.so {
  400. background-position: -224px -121px; }
  401. .iti-flag.sr {
  402. background-position: -240px -121px; }
  403. .iti-flag.ss {
  404. background-position: 0 -132px; }
  405. .iti-flag.st {
  406. background-position: -16px -132px; }
  407. .iti-flag.sv {
  408. background-position: -32px -132px; }
  409. .iti-flag.sx {
  410. background-position: -48px -132px; }
  411. .iti-flag.sy {
  412. background-position: -64px -132px; }
  413. .iti-flag.sz {
  414. background-position: -80px -132px; }
  415. .iti-flag.tc {
  416. background-position: -96px -132px; }
  417. .iti-flag.td {
  418. background-position: -112px -132px; }
  419. .iti-flag.tg {
  420. background-position: -128px -132px; }
  421. .iti-flag.th {
  422. background-position: -144px -132px; }
  423. .iti-flag.tj {
  424. background-position: -160px -132px; }
  425. .iti-flag.tk {
  426. background-position: -176px -132px; }
  427. .iti-flag.tl {
  428. background-position: -192px -132px; }
  429. .iti-flag.tm {
  430. background-position: -208px -132px; }
  431. .iti-flag.tn {
  432. background-position: -224px -132px; }
  433. .iti-flag.to {
  434. background-position: -240px -132px; }
  435. .iti-flag.tr {
  436. background-position: 0 -143px; }
  437. .iti-flag.tt {
  438. background-position: -16px -143px; }
  439. .iti-flag.tv {
  440. background-position: -32px -143px; }
  441. .iti-flag.tw {
  442. background-position: -48px -143px; }
  443. .iti-flag.tz {
  444. background-position: -64px -143px; }
  445. .iti-flag.ua {
  446. background-position: -80px -143px; }
  447. .iti-flag.ug {
  448. background-position: -96px -143px; }
  449. .iti-flag.us {
  450. background-position: -112px -143px; }
  451. .iti-flag.uy {
  452. background-position: -128px -143px; }
  453. .iti-flag.uz {
  454. background-position: -144px -143px; }
  455. .iti-flag.va {
  456. background-position: -160px -143px; }
  457. .iti-flag.vc {
  458. background-position: -176px -143px; }
  459. .iti-flag.ve {
  460. background-position: -192px -143px; }
  461. .iti-flag.vg {
  462. background-position: -208px -143px; }
  463. .iti-flag.vi {
  464. background-position: -224px -143px; }
  465. .iti-flag.vn {
  466. background-position: -240px -143px; }
  467. .iti-flag.vu {
  468. background-position: 0 -154px; }
  469. .iti-flag.wf {
  470. background-position: -16px -154px; }
  471. .iti-flag.ws {
  472. background-position: -32px -154px; }
  473. .iti-flag.ye {
  474. background-position: -48px -154px; }
  475. .iti-flag.za {
  476. background-position: -64px -154px; }
  477. .iti-flag.zm {
  478. background-position: -80px -154px; }
  479. .iti-flag.zw {
  480. background-position: -96px -154px; }
  481. .intl-tel-input {
  482. position: relative;
  483. display: inline-block; }
  484. .intl-tel-input * {
  485. box-sizing: border-box;
  486. -moz-box-sizing: border-box; }
  487. .intl-tel-input .hide {
  488. display: none; }
  489. .intl-tel-input .v-hide {
  490. visibility: hidden; }
  491. .intl-tel-input input, .intl-tel-input input[type=text], .intl-tel-input input[type=tel] {
  492. position: relative;
  493. z-index: 0;
  494. margin-top: 0 !important;
  495. margin-bottom: 0 !important;
  496. padding-left: 44px;
  497. margin-left: 0; }
  498. .intl-tel-input .flag-dropdown {
  499. position: absolute;
  500. top: 0;
  501. bottom: 0;
  502. padding: 1px; }
  503. .intl-tel-input .flag-dropdown:hover {
  504. cursor: pointer; }
  505. .intl-tel-input .flag-dropdown:hover .selected-flag {
  506. background-color: rgba(0, 0, 0, 0.05); }
  507. .intl-tel-input input[disabled] + .flag-dropdown:hover, .intl-tel-input input[readonly] + .flag-dropdown:hover {
  508. cursor: default; }
  509. .intl-tel-input input[disabled] + .flag-dropdown:hover .selected-flag, .intl-tel-input input[readonly] + .flag-dropdown:hover .selected-flag {
  510. background-color: transparent; }
  511. .intl-tel-input .selected-flag {
  512. z-index: 1;
  513. position: relative;
  514. width: 38px;
  515. height: 100%;
  516. padding: 0 0 0 8px; }
  517. .intl-tel-input .selected-flag .iti-flag {
  518. position: absolute;
  519. top: 50%;
  520. margin-top: -5px; }
  521. .intl-tel-input .selected-flag .arrow {
  522. position: relative;
  523. top: 50%;
  524. margin-top: -2px;
  525. left: 20px;
  526. width: 0;
  527. height: 0;
  528. border-left: 3px solid transparent;
  529. border-right: 3px solid transparent;
  530. border-top: 4px solid #555; }
  531. .intl-tel-input .selected-flag .arrow.up {
  532. border-top: none;
  533. border-bottom: 4px solid #555; }
  534. .intl-tel-input .country-list {
  535. list-style: none;
  536. position: absolute;
  537. z-index: 2;
  538. padding: 0;
  539. margin: 0 0 0 -1px;
  540. box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
  541. background-color: white;
  542. border: 1px solid #CCC;
  543. width: 430px;
  544. max-height: 200px;
  545. overflow-y: scroll; }
  546. .intl-tel-input .country-list .iti-flag {
  547. display: inline-block; }
  548. .intl-tel-input .country-list .divider {
  549. padding-bottom: 5px;
  550. margin-bottom: 5px;
  551. border-bottom: 1px solid #CCC; }
  552. .intl-tel-input .country-list .country {
  553. padding: 5px 10px; }
  554. .intl-tel-input .country-list .country .dial-code {
  555. color: #999; }
  556. .intl-tel-input .country-list .country.highlight {
  557. background-color: rgba(0, 0, 0, 0.05); }
  558. .intl-tel-input .country-list .iti-flag, .intl-tel-input .country-list .country-name {
  559. margin-right: 6px; }
  560. @keyframes progress-bar-stripes {
  561. from {
  562. background-position: 40px 0; }
  563. to {
  564. background-position: 0 0; } }
  565. .progress-bar-striped {
  566. background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent);
  567. background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent);
  568. background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent);
  569. -webkit-background-size: 40px 40px;
  570. background-size: 40px 40px; }
  571. .progress-bar-striped {
  572. background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent);
  573. background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent);
  574. background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.75) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.75) 50%, rgba(255, 255, 255, 0.75) 75%, transparent 75%, transparent); }
  575. .progress-bar.active {
  576. -webkit-animation: progress-bar-stripes 2s linear infinite;
  577. -o-animation: progress-bar-stripes 2s linear infinite;
  578. animation: progress-bar-stripes 2s linear infinite; }
  579. .bar-container {
  580. background: #a2d2f4; }
  581. .bar-container .progress-bar {
  582. height: 100%; }
  583. .iti-flag {
  584. background: url("/images/flags.png"); }
  585. * {
  586. box-sizing: border-box; }
  587. html, body {
  588. height: 100%; }
  589. body {
  590. margin: 0;
  591. font-family: Roboto, "Helvetica Neue", Arial, Helvetica, sans-serif;
  592. position: relative;
  593. background: #2090ea;
  594. color: white;
  595. text-align: center;
  596. font-size: 16px;
  597. overflow: auto; }
  598. .clearfix:before,
  599. .clearfix:after {
  600. display: table;
  601. content: " "; }
  602. .clearfix:after {
  603. clear: both; }
  604. input, button, select, textarea {
  605. font-family: inherit;
  606. font-size: inherit;
  607. line-height: inherit; }
  608. #install {
  609. display: none; }
  610. .main {
  611. padding: 70px 0 10em; }
  612. .step {
  613. display: none; }
  614. #signal-computer,
  615. #signal-phone {
  616. max-width: 50%;
  617. max-height: 250px; }
  618. p {
  619. max-width: 35em;
  620. margin: 1em auto;
  621. line-height: 1.5em;
  622. font-size: 1.2em;
  623. font-weight: bold; }
  624. a {
  625. cursor: pointer; }
  626. a, a:visited, a:hover {
  627. text-decoration: none; }
  628. .button {
  629. display: inline-block;
  630. text-transform: uppercase;
  631. border: none;
  632. font-weight: bold;
  633. min-width: 300px;
  634. padding: 0.5em;
  635. margin: 0.5em 0;
  636. background: white;
  637. color: #2090ea; }
  638. .nav {
  639. width: 100%;
  640. position: fixed;
  641. bottom: 50px;
  642. margin-top: 2em;
  643. padding: 0 20px; }
  644. .nav .button {
  645. margin-bottom: 3em; }
  646. .nav .dot {
  647. display: inline-block;
  648. cursor: pointer;
  649. margin: 10px;
  650. width: 20px;
  651. height: 20px;
  652. border-radius: 10px;
  653. background: white;
  654. border: solid 5px #2090ea; }
  655. .nav .dot.selected {
  656. background: #a2d2f4; }
  657. .link:hover, .link:focus {
  658. background: rgba(255, 255, 255, 0.3);
  659. outline: none; }
  660. .link, .link:visited, .link:hover {
  661. padding: 0 3px;
  662. color: white;
  663. font-weight: bold;
  664. border-bottom: dashed 2px white;
  665. text-decoration: none; }
  666. .container {
  667. min-width: 650px; }
  668. h1 {
  669. font-size: 30pt;
  670. font-weight: normal;
  671. padding-bottom: 10px; }
  672. #signal-icon {
  673. margin-top: 20px; }
  674. h3.step {
  675. margin-top: 0;
  676. font-weight: bold; }
  677. .help {
  678. border-top: 2px solid #f3f3f3;
  679. padding: 1.5em 0.1em; }
  680. .install {
  681. display: inline-block;
  682. margin-top: 90px; }
  683. #qr {
  684. display: inline-block;
  685. min-height: 266px; }
  686. #qr img {
  687. border: 5px solid white; }
  688. #qr canvas {
  689. display: none; }
  690. #device-name {
  691. border: none;
  692. border-bottom: 1px solid white;
  693. padding: 8px;
  694. background: transparent;
  695. color: white;
  696. font-weight: bold;
  697. text-align: center; }
  698. #device-name::selection, #device-name a::selection {
  699. color: #454545;
  700. background: white; }
  701. #device-name::-moz-selection, #device-name a::-moz-selection {
  702. color: #454545;
  703. background: white; }
  704. #device-name:focus {
  705. outline: none; }
  706. #device-name:hover, #device-name:focus {
  707. background: rgba(255, 255, 255, 0.1); }
  708. #verifyCode,
  709. #code,
  710. #number {
  711. box-sizing: border-box;
  712. width: 100%;
  713. display: block;
  714. margin-bottom: 0.5em;
  715. text-align: center; }
  716. #request-voice,
  717. #request-sms {
  718. box-sizing: border-box; }
  719. #request-sms {
  720. width: 57%;
  721. float: right; }
  722. #request-voice {
  723. width: 40%;
  724. float: left; }
  725. .number-container {
  726. position: relative;
  727. margin-bottom: 0.5em; }
  728. .number-container .intl-tel-input,
  729. .number-container .number {
  730. width: 100%; }
  731. .number-container::after {
  732. visibility: hidden;
  733. content: ' ';
  734. display: inline-block;
  735. border-radius: 1.5em;
  736. width: 1.5em;
  737. height: 1.5em;
  738. line-height: 1.5em;
  739. color: #ffffff;
  740. position: absolute;
  741. top: 0;
  742. left: 100%;
  743. margin: 3px 8px;
  744. text-align: center; }
  745. .number-container.valid::after {
  746. visibility: visible;
  747. content: '✓';
  748. background-color: #0f9d58;
  749. color: #ffffff; }
  750. .number-container.invalid::after {
  751. visibility: visible;
  752. content: '!';
  753. background-color: #f44336;
  754. color: #ffffff; }
  755. #error {
  756. color: white;
  757. font-weight: bold;
  758. padding: 0.5em;
  759. text-align: center; }
  760. #error {
  761. background-color: #f44336; }
  762. #error:before {
  763. content: '\26a0';
  764. padding-right: 0.5em; }
  765. .narrow {
  766. margin: auto;
  767. box-sizing: border-box;
  768. width: 275px;
  769. max-width: 100%; }
  770. ul.country-list {
  771. min-width: 197px !important; }
  772. .confirmation-dialog, .progress-dialog, .error-dialog {
  773. padding: 1em;
  774. text-align: left; }
  775. .number {
  776. text-align: center; }
  777. .confirmation-dialog button, .error-dialog button {
  778. float: right;
  779. margin-left: 10px; }
  780. .progress-dialog {
  781. text-align: center;
  782. padding: 1em;
  783. max-width: 600px;
  784. margin: auto; }
  785. .progress-dialog .status {
  786. padding: 1em; }
  787. .progress-dialog .bar-container {
  788. height: 1em;
  789. background-color: #f3f3f3;
  790. border: solid 1px white; }
  791. .progress-dialog .bar {
  792. width: 0;
  793. height: 100%;
  794. background-color: #a2d2f4;
  795. transition: width 0.25s; }
  796. .error-dialog {
  797. display: none; }
  798. .modal-container {
  799. display: none;
  800. position: absolute;
  801. width: 100%;
  802. height: 100%;
  803. background: rgba(0, 0, 0, 0.1);
  804. top: 0;
  805. padding-top: 10em;
  806. text-align: center; }
  807. .modal-container .modal-main {
  808. display: inline-block;
  809. width: 80%;
  810. max-width: 500px;
  811. border: solid 2px #2090ea;
  812. background: white;
  813. margin: 10% auto;
  814. box-shadow: 0 0 5px 3px rgba(10, 62, 103, 0.2); }
  815. .modal-container .modal-main h4 {
  816. background-color: #2090ea;
  817. color: white;
  818. padding: 1em;
  819. margin: 0;
  820. text-align: left; }
  821. /*# sourceMappingURL=options.css.map */