docs.css 48 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665166616671668166916701671167216731674167516761677167816791680168116821683168416851686168716881689169016911692169316941695169616971698169917001701170217031704170517061707170817091710171117121713171417151716171717181719172017211722172317241725172617271728172917301731173217331734173517361737173817391740174117421743174417451746174717481749175017511752175317541755175617571758175917601761176217631764176517661767176817691770177117721773177417751776177717781779178017811782178317841785178617871788178917901791179217931794179517961797179817991800180118021803180418051806180718081809181018111812181318141815181618171818181918201821182218231824182518261827182818291830183118321833183418351836183718381839184018411842184318441845184618471848184918501851185218531854185518561857185818591860186118621863186418651866186718681869187018711872187318741875187618771878187918801881188218831884188518861887188818891890189118921893189418951896189718981899190019011902190319041905190619071908190919101911191219131914191519161917191819191920192119221923192419251926192719281929193019311932193319341935193619371938193919401941194219431944194519461947194819491950195119521953195419551956195719581959196019611962196319641965196619671968196919701971197219731974197519761977197819791980198119821983198419851986198719881989199019911992199319941995199619971998199920002001200220032004200520062007200820092010201120122013201420152016201720182019202020212022202320242025202620272028202920302031203220332034203520362037203820392040204120422043204420452046204720482049205020512052205320542055205620572058205920602061206220632064206520662067206820692070207120722073
  1. /*!
  2. * =====================================================
  3. * Ratchet v2.0.2 (http://goratchet.com)
  4. * Copyright 2014 Connor Sears
  5. * Licensed under MIT (https://github.com/twbs/ratchet/blob/master/LICENSE)
  6. *
  7. * v2.0.2 designed by @connors.
  8. * =====================================================
  9. */
  10. html,
  11. body {
  12. width: 100%;
  13. height: 100%;
  14. }
  15. body {
  16. position: relative !important;
  17. font: 400 14px/1.5 "Open Sans", sans-serif;
  18. color: #333;
  19. -webkit-text-size-adjust: 100%;
  20. background-color: #fff;
  21. -webkit-font-smoothing: antialiased;
  22. }
  23. .docs-content {
  24. font-size: 14px;
  25. }
  26. @media screen and (min-width: 768px) {
  27. .docs-content {
  28. font-size: 18px;
  29. }
  30. }
  31. .docs-content h1, .docs-content h2, .docs-content h3, .docs-content h4, .docs-content h5, .docs-content h6 {
  32. font-weight: 400;
  33. color: #222;
  34. }
  35. .docs-content h2 {
  36. margin-bottom: .25em;
  37. font-size: 2em;
  38. }
  39. .docs-content h3 {
  40. margin-bottom: .5em;
  41. font-size: 1.25em;
  42. }
  43. .docs-content p {
  44. margin-bottom: 1.5em;
  45. font-size: 1em;
  46. color: #555;
  47. }
  48. .docs-content .lead {
  49. font-size: 1.1em;
  50. color: #777;
  51. }
  52. .docs-header,
  53. .docs-sub-header {
  54. position: relative;
  55. background-color: #0a1855;
  56. background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #0a1855), color-stop(100%, #da0024));
  57. background-image: -webkit-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
  58. background-image: -moz-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
  59. background-image: -ms-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
  60. background-image: -o-linear-gradient(45deg, #0a1855 0%, #da0024 100%);
  61. background-image: linear-gradient(45deg, #0a1855 0%, #da0024 100%);
  62. filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0a1855', endColorstr='#da0024', GradientType=1 );
  63. }
  64. .docs-header {
  65. height: 100vh;
  66. min-height: 750px;
  67. }
  68. .docs-header .carbonad {
  69. position: relative !important;
  70. margin-top: 0 !important;
  71. -webkit-animation-name: fadeintext;
  72. -moz-animation-name: fadeintext;
  73. animation-name: fadeintext;
  74. -webkit-animation-duration: 2s;
  75. -moz-animation-duration: 2s;
  76. animation-duration: 2s;
  77. }
  78. .docs-header .version {
  79. margin-top: 15px;
  80. color: rgba(255, 255, 255, .5);
  81. text-align: center;
  82. }
  83. .docs-header-bottom {
  84. position: absolute;
  85. right: 0;
  86. bottom: 0;
  87. left: 0;
  88. }
  89. @media screen and (min-width: 768px) {
  90. .docs-header {
  91. min-height: 870px;
  92. }
  93. .docs-header .carbonad {
  94. left: 50% !important;
  95. width: 330px !important;
  96. margin-bottom: 60px !important;
  97. margin-left: -165px !important;
  98. }
  99. .docs-sub-header .carbonad {
  100. position: absolute !important;
  101. top: 50% !important;
  102. right: 15px !important;
  103. margin-top: 0 !important;
  104. -webkit-transform: translateY(-50%) !important;
  105. -ms-transform: translateY(-50%) !important;
  106. transform: translateY(-50%) !important;
  107. }
  108. }
  109. .docs-masthead {
  110. position: relative;
  111. padding-top: 15px;
  112. padding-bottom: 15px;
  113. border-bottom: 1px solid rgba(255, 255, 255, .1);
  114. }
  115. .docs-title {
  116. position: absolute;
  117. left: 50%;
  118. z-index: 20;
  119. margin-bottom: 0;
  120. font-size: 22px;
  121. font-weight: 400;
  122. -webkit-transform: translateX(-50%);
  123. -ms-transform: translateX(-50%);
  124. transform: translateX(-50%);
  125. }
  126. .docs-nav .docs-nav-trigger {
  127. color: #fff;
  128. opacity: .7;
  129. }
  130. .docs-nav .docs-nav-trigger.active {
  131. opacity: 1;
  132. }
  133. .docs-nav .docs-nav-group {
  134. position: absolute;
  135. top: 40px;
  136. right: 0;
  137. left: 0;
  138. z-index: 20;
  139. height: 0;
  140. overflow: hidden;
  141. background-color: rgba(0, 0, 0, .9);
  142. opacity: 0;
  143. }
  144. .docs-nav .docs-nav-group.active {
  145. height: auto;
  146. opacity: 1;
  147. }
  148. .docs-nav .docs-nav-item {
  149. display: block;
  150. padding: 20px 15px;
  151. font-size: 22px;
  152. }
  153. .docs-jump-menu,
  154. .docs-component-group {
  155. display: none;
  156. }
  157. .docs-title a,
  158. .docs-nav-item {
  159. color: #fff;
  160. -webkit-transition: opacity .2s linear;
  161. -moz-transition: opacity .2s linear;
  162. transition: opacity .2s linear;
  163. }
  164. .docs-title a:active, .docs-title a:focus,
  165. .docs-nav-item:active,
  166. .docs-nav-item:focus {
  167. color: #fff;
  168. opacity: .5;
  169. }
  170. @media screen and (min-width: 768px) {
  171. .docs-title {
  172. position: static;
  173. float: left;
  174. font-weight: 300;
  175. -webkit-transform: translateX(0);
  176. -ms-transform: translateX(0);
  177. transform: translateX(0);
  178. }
  179. .docs-nav {
  180. float: right;
  181. }
  182. .docs-nav .docs-nav-trigger {
  183. display: none;
  184. }
  185. .docs-nav .docs-nav-group {
  186. position: static;
  187. display: block;
  188. height: auto;
  189. background-color: transparent;
  190. opacity: 1;
  191. }
  192. .docs-nav .docs-nav-item {
  193. position: relative;
  194. display: inline-block;
  195. padding: 0 15px;
  196. font-size: 14px;
  197. }
  198. .docs-jump-menu {
  199. position: absolute;
  200. left: 15px;
  201. display: block;
  202. color: #777;
  203. cursor: pointer;
  204. -webkit-transition: opacity .2 linear;
  205. -moz-transition: opacity .2 linear;
  206. transition: opacity .2 linear;
  207. }
  208. .docs-jump-menu:hover {
  209. color: #428bca;
  210. }
  211. .docs-jump-menu:active {
  212. opacity: .5;
  213. }
  214. .docs-jump-menu .icon-list {
  215. margin-right: 3px;
  216. font-size: 16px;
  217. }
  218. .docs-jump-menu .icon-caret {
  219. position: relative;
  220. top: 4px;
  221. margin-left: -5px;
  222. }
  223. .docs-component-group {
  224. position: absolute;
  225. top: 35px;
  226. left: 15px;
  227. padding-top: 10px;
  228. padding-bottom: 10px;
  229. background-color: #fff;
  230. background-clip: padding-box;
  231. border: 1px solid rgba(0, 0, 0, .2);
  232. border-radius: 3px;
  233. -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .05);
  234. box-shadow: 0 0 8px rgba(0, 0, 0, .05);
  235. }
  236. .docs-component-group.active {
  237. display: block;
  238. }
  239. .docs-component-group:before, .docs-component-group:after {
  240. position: absolute;
  241. left: 30px;
  242. width: 0;
  243. height: 0;
  244. content: '';
  245. }
  246. .docs-component-group:before {
  247. top: -11px;
  248. margin-left: -11px;
  249. border-right: 11px solid transparent;
  250. border-bottom: 11px solid rgba(0, 0, 0, .3);
  251. border-left: 11px solid transparent;
  252. }
  253. .docs-component-group:after {
  254. top: -10px;
  255. margin-left: -10px;
  256. border-right: 10px solid transparent;
  257. border-bottom: 10px solid #fff;
  258. border-left: 10px solid transparent;
  259. }
  260. .docs-component-group .docs-component-item {
  261. display: block;
  262. padding: 10px 20px;
  263. color: #777;
  264. }
  265. .docs-component-group .docs-component-item:hover {
  266. color: #fff;
  267. background-color: #428bca;
  268. }
  269. }
  270. .docs-header-content {
  271. position: relative;
  272. padding: 50px 10px;
  273. text-align: center;
  274. -webkit-animation-name: fadeintext;
  275. -moz-animation-name: fadeintext;
  276. animation-name: fadeintext;
  277. -webkit-animation-duration: 2s;
  278. -moz-animation-duration: 2s;
  279. animation-duration: 2s;
  280. }
  281. .docs-header-content .btn {
  282. display: block;
  283. padding: 15px 60px 16px;
  284. margin-bottom: 0;
  285. font-size: 18px;
  286. color: #0a1855;
  287. background-color: #fff;
  288. border: 0;
  289. -webkit-transition: all .2s linear;
  290. -moz-transition: all .2s linear;
  291. transition: all .2s linear;
  292. }
  293. .docs-header-content .btn:hover {
  294. background-color: #fff;
  295. -webkit-box-shadow: 0 0 50px rgba(255, 255, 255, .3);
  296. box-shadow: 0 0 50px rgba(255, 255, 255, .3);
  297. }
  298. .docs-header-content .btn:active {
  299. opacity: .5;
  300. }
  301. .docs-subtitle {
  302. max-width: 750px;
  303. margin: 0 auto 20px;
  304. font-size: 28px;
  305. font-weight: 300;
  306. line-height: 38px;
  307. color: #fff;
  308. }
  309. @media screen and (min-width: 768px) {
  310. .docs-header-content {
  311. top: 30%;
  312. -webkit-transform: translateY(-50%);
  313. -ms-transform: translateY(-50%);
  314. transform: translateY(-50%);
  315. }
  316. .docs-header-content .btn {
  317. display: inline-block;
  318. }
  319. .docs-subtitle {
  320. margin-bottom: 30px;
  321. font-size: 41px;
  322. line-height: 60px;
  323. }
  324. }
  325. .carbonad {
  326. width: 100% !important;
  327. height: auto !important;
  328. padding: 15px !important;
  329. font-size: 13px !important;
  330. line-height: 18px !important;
  331. background: transparent !important;
  332. border-top: 1px solid rgba(255, 255, 255, .1) !important;
  333. border-right: 0 !important;
  334. border-bottom: 0 !important;
  335. border-left: 0 !important;
  336. }
  337. .carbonad-img {
  338. margin: 0 !important;
  339. }
  340. .carbonad-text,
  341. .carbonad-tag {
  342. display: block !important;
  343. float: none !important;
  344. width: auto !important;
  345. height: auto !important;
  346. margin-left: 145px !important;
  347. font-family: "Open Sans", sans-serif !important;
  348. color: rgba(255, 255, 255, .65) !important;
  349. }
  350. .carbonad-text {
  351. padding-top: 0 !important;
  352. }
  353. .carbonad-tag {
  354. text-align: left !important;
  355. }
  356. .carbonad-text a,
  357. .carbonad-tag a {
  358. color: #fff !important;
  359. }
  360. .carbonad #azcarbon > img {
  361. display: none;
  362. }
  363. @media screen and (min-width: 768px) {
  364. .carbonad {
  365. width: 360px !important;
  366. border-right: 1px solid rgba(255, 255, 255, .1) !important;
  367. border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
  368. border-left: 1px solid rgba(255, 255, 255, .1) !important;
  369. border-radius: 3px !important;
  370. }
  371. }
  372. .docs-sub-content {
  373. position: relative;
  374. padding: 55px 15px 65px;
  375. overflow: hidden;
  376. color: #fff;
  377. text-align: center;
  378. }
  379. .docs-sub-content .page-title,
  380. .docs-sub-content .page-description {
  381. margin-top: 0;
  382. margin-bottom: 0;
  383. font-weight: 300;
  384. }
  385. .docs-sub-content .page-title {
  386. margin-bottom: 5px;
  387. font-size: 40px;
  388. }
  389. .docs-sub-content .page-description {
  390. font-size: 24px;
  391. color: #fff;
  392. opacity: .7;
  393. }
  394. @media screen and (min-width: 768px) {
  395. .docs-sub-content {
  396. margin-right: 380px;
  397. text-align: left;
  398. }
  399. }
  400. .docs-section {
  401. padding-top: 50px;
  402. padding-bottom: 50px;
  403. border-bottom: 1px solid #ddd;
  404. }
  405. .docs-section:last-child {
  406. border-bottom: 0;
  407. }
  408. @media screen and (min-width: 768px) {
  409. .docs-module {
  410. margin-top: 35px;
  411. }
  412. }
  413. .docs-module {
  414. padding: 20px;
  415. margin-top: 20px;
  416. border: 1px solid #ddd;
  417. border-radius: 3px;
  418. }
  419. .docs-module .btn-block {
  420. margin-bottom: 0;
  421. }
  422. .version {
  423. margin-top: 10px;
  424. margin-bottom: 0;
  425. font-size: 90%;
  426. color: #777;
  427. }
  428. .docs-footer {
  429. padding: 30px 20px;
  430. margin-top: 50px;
  431. font-size: 14px;
  432. color: #777;
  433. text-align: center;
  434. border-top: 1px solid #ddd;
  435. }
  436. .docs-footer .social {
  437. padding: 0 0 20px;
  438. margin: 0;
  439. list-style: none;
  440. }
  441. .docs-footer .social li {
  442. display: inline-block;
  443. height: 20px;
  444. vertical-align: top;
  445. }
  446. .docs-footer .social .twitter-follow-button {
  447. margin-top: 5px;
  448. }
  449. @media screen and (min-width: 768px) {
  450. .docs-footer .social .twitter-follow-button {
  451. margin-top: 0;
  452. }
  453. }
  454. .docs-footer-text {
  455. margin-top: 0;
  456. margin-bottom: 0;
  457. }
  458. @media screen and (min-width: 768px) {
  459. .docs-footer-text {
  460. width: 550px;
  461. padding-right: 0;
  462. padding-left: 0;
  463. margin: 0 auto;
  464. }
  465. }
  466. .docs-footer-links {
  467. padding-left: 0;
  468. }
  469. .docs-footer-links li {
  470. display: inline;
  471. padding-right: 3px;
  472. padding-left: 3px;
  473. }
  474. .docs-header .docs-footer {
  475. margin-top: 0;
  476. border-top: 1px solid rgba(255, 255, 255, .1);
  477. }
  478. .docs-header .docs-footer .docs-footer-text,
  479. .docs-header .docs-footer .docs-footer-links {
  480. color: rgba(255, 255, 255, .5);
  481. }
  482. .docs-header .docs-footer .docs-footer-text a,
  483. .docs-header .docs-footer .docs-footer-links a {
  484. color: rgba(255, 255, 255, .8);
  485. }
  486. .github-btn {
  487. overflow: hidden;
  488. border: 0;
  489. }
  490. .docs-component-toolbar {
  491. position: fixed;
  492. top: 0;
  493. right: 0;
  494. bottom: auto;
  495. left: 0;
  496. z-index: 20;
  497. height: 44px;
  498. padding-top: 8px;
  499. padding-bottom: 8px;
  500. background-color: #fff;
  501. border-bottom: 1px solid #ddd;
  502. -webkit-transition: -webkit-transform .5s;
  503. -moz-transition: -moz-transform .5s;
  504. transition: transform .5s;
  505. -webkit-transform: translate3d(0, -55px, 0);
  506. -ms-transform: translate3d(0, -55px, 0);
  507. transform: translate3d(0, -55px, 0);
  508. }
  509. .docs-component-toolbar.visible {
  510. -webkit-transform: translate3d(0, 0, 0);
  511. -ms-transform: translate3d(0, 0, 0);
  512. transform: translate3d(0, 0, 0);
  513. }
  514. .docs-component-toolbar .segmented-control {
  515. max-width: 300px;
  516. margin: 0 auto;
  517. }
  518. .docs-component-toolbar .segmented-control .control-item {
  519. cursor: pointer;
  520. }
  521. .docs-examples {
  522. margin-top: 30px;
  523. }
  524. .example-wrap {
  525. margin-bottom: 30px;
  526. }
  527. .example-wrap .example {
  528. display: block;
  529. width: 100%;
  530. padding: 3px;
  531. overflow: hidden;
  532. border: 1px solid #ddd;
  533. border-radius: 3px;
  534. }
  535. .example-wrap .example-title {
  536. margin-top: 10px;
  537. }
  538. .example-wrap img {
  539. display: block;
  540. width: 100%;
  541. height: auto;
  542. }
  543. code {
  544. padding: 2px 4px;
  545. font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  546. font-size: 90%;
  547. background-color: #f9f9f9;
  548. border-radius: 3px;
  549. }
  550. .component {
  551. padding: 50px 15px;
  552. margin-right: -15px;
  553. margin-left: -15px;
  554. border-bottom: 1px solid #ddd;
  555. }
  556. .component.no-border {
  557. border-bottom: 0;
  558. }
  559. @media screen and (min-width: 768px) {
  560. .component {
  561. border-bottom: 0;
  562. }
  563. }
  564. .component-title {
  565. margin-bottom: 10px;
  566. font-size: 24px;
  567. line-height: 34px;
  568. }
  569. .component-description {
  570. margin-bottom: 15px;
  571. font-size: 16px;
  572. }
  573. .component-example {
  574. font-family: "Helvetica Neue", Helvetica, sans-serif;
  575. font-size: 17px;
  576. line-height: 21px;
  577. }
  578. .component-example,
  579. .component-example .bar,
  580. .component-example .content {
  581. position: relative;
  582. }
  583. .component-example .bar {
  584. border-top: 1px solid #ddd;
  585. border-bottom: 1px solid #ddd;
  586. }
  587. .component-example .bar.bar-header-secondary {
  588. top: 0 !important;
  589. border-top: 0;
  590. }
  591. .component-example > .content-padded {
  592. margin: 15px;
  593. }
  594. .component-example > .card {
  595. margin: 15px 0 0;
  596. }
  597. .component-example > .card .control-content {
  598. padding: 15px;
  599. }
  600. .component-example > .btn,
  601. .component-example > .toggle {
  602. margin-bottom: 10px;
  603. }
  604. .component-example .slider {
  605. height: 300px;
  606. }
  607. .component-example .slider .slide {
  608. height: 300px;
  609. }
  610. .component-example .slide img {
  611. width: 100%;
  612. }
  613. .component-example .slide-text {
  614. position: absolute;
  615. top: 45%;
  616. left: 0;
  617. width: 100%;
  618. font-size: 24px;
  619. color: #fff;
  620. text-align: center;
  621. text-shadow: 0 0 10px rgba(0, 0, 0, .5);
  622. }
  623. .component-example-fullbleed,
  624. .highlight {
  625. margin-right: -15px;
  626. margin-left: -15px;
  627. }
  628. .bar-nav ~ .content {
  629. padding: 0;
  630. }
  631. .highlight pre {
  632. padding: 15px;
  633. margin-top: 15px;
  634. overflow-x: auto;
  635. font-size: 13px;
  636. color: #777;
  637. word-wrap: normal;
  638. white-space: pre;
  639. background-color: #fafafa;
  640. border-top: 1px solid #ddd;
  641. border-bottom: 1px solid #ddd;
  642. }
  643. .highlight pre code {
  644. padding: 0;
  645. }
  646. @media screen and (min-width: 768px) {
  647. .component,
  648. .component-example-fullbleed,
  649. .highlight {
  650. margin-right: 0;
  651. margin-left: 0;
  652. }
  653. .component {
  654. padding-right: 0;
  655. padding-left: 0;
  656. opacity: .3;
  657. -webkit-transition: opacity .2s ease-in-out;
  658. -moz-transition: opacity .2s ease-in-out;
  659. transition: opacity .2s ease-in-out;
  660. }
  661. .component.active {
  662. opacity: 1;
  663. }
  664. .component-example {
  665. display: none;
  666. }
  667. .highlight pre {
  668. border-right: 1px solid #ddd;
  669. border-left: 1px solid #ddd;
  670. border-radius: 3px;
  671. }
  672. }
  673. #ratchicons .icon,
  674. #ratchiconsInDevice .icon {
  675. width: 50px;
  676. height: 50px;
  677. margin: 3px;
  678. font-size: 24px;
  679. line-height: 50px;
  680. text-align: center;
  681. background-color: #fff;
  682. border: 1px solid #ddd;
  683. border-radius: 25px;
  684. }
  685. #modals .modal {
  686. left: 0;
  687. z-index: 50;
  688. }
  689. #push .component-example {
  690. height: 150px;
  691. overflow: hidden;
  692. }
  693. #buttonsInDevice .btn,
  694. #buttonsBadgesInDevice .btn,
  695. #buttonsWithIconsInDevice .btn {
  696. margin-top: 10px;
  697. margin-right: 100px;
  698. margin-left: 10px;
  699. }
  700. #blockButtonsInDevice .btn-block {
  701. width: 300px;
  702. margin: 10px auto;
  703. }
  704. #segmentedControlsInDevice .segmented-control {
  705. margin-top: 10px;
  706. margin-right: 10px;
  707. margin-left: 10px;
  708. }
  709. #segmentedControlsInDevice .card span {
  710. padding: 10px;
  711. }
  712. #badgesInDevice {
  713. text-align: center;
  714. }
  715. #badgesInDevice .badge {
  716. margin-top: 10px;
  717. }
  718. #formsInDevice form {
  719. margin: 10px;
  720. }
  721. #formsInDevice form.input-group {
  722. margin: 0;
  723. }
  724. #togglesInDevice .toggle {
  725. margin: 10px auto;
  726. }
  727. .toggle {
  728. cursor: pointer;
  729. }
  730. #popoversInDevice #iwindow:before {
  731. position: absolute;
  732. top: 0;
  733. right: 0;
  734. bottom: 0;
  735. left: 0;
  736. z-index: 11;
  737. content: '';
  738. background-color: rgba(0, 0, 0, .3);
  739. }
  740. @media screen and (min-width: 768px) {
  741. .popover {
  742. position: absolute;
  743. top: 72px;
  744. display: block;
  745. opacity: 1;
  746. }
  747. }
  748. #modalsInDevice #iwindow > .btn {
  749. margin: 10px;
  750. }
  751. @media screen and (min-width: 768px) {
  752. .slider .slide {
  753. cursor: -webkit-grab;
  754. cursor: -moz-grab;
  755. cursor: grab;
  756. }
  757. .slider .slide img {
  758. display: block;
  759. width: 100%;
  760. height: 570px;
  761. }
  762. .slider .slide-group .slide-text {
  763. position: absolute;
  764. top: 45%;
  765. left: 0;
  766. width: 100%;
  767. font-size: 24px;
  768. color: #fff;
  769. text-align: center;
  770. text-shadow: 0 0 10px rgba(0, 0, 0, .5);
  771. }
  772. }
  773. .device {
  774. display: none;
  775. font-family: "Helvetica Neue", Helvetica, sans-serif;
  776. font-size: 17px;
  777. line-height: 21px;
  778. }
  779. @media screen and (min-width: 768px) {
  780. .device {
  781. position: relative;
  782. top: 50px;
  783. display: block;
  784. width: 395px;
  785. height: 813px;
  786. margin-left: -20px;
  787. font-family: "Helvetica Neue", sans-serif;
  788. background-image: url("../img/device-sprite.png");
  789. background-repeat: no-repeat;
  790. background-position: 0 0;
  791. background-size: 300%;
  792. -webkit-transition: background-image .1s linear;
  793. -moz-transition: background-image .1s linear;
  794. transition: background-image .1s linear;
  795. }
  796. .device.device-fixed {
  797. position: fixed;
  798. right: auto;
  799. }
  800. .device .device-content {
  801. position: absolute;
  802. top: 117px;
  803. left: 37px;
  804. width: 321px;
  805. height: 569px;
  806. overflow: hidden;
  807. font-size: 17px;
  808. line-height: 21px;
  809. background-color: #fff;
  810. }
  811. .device .content,
  812. .device .bar,
  813. .device .modal {
  814. position: absolute;
  815. }
  816. .device .content {
  817. top: 44px;
  818. right: 0;
  819. bottom: 0;
  820. left: 0;
  821. }
  822. }
  823. @media screen and (min-width: 1200px) {
  824. .device {
  825. margin-left: 39px;
  826. }
  827. }
  828. hr {
  829. height: 0;
  830. margin: 10px 0 30px;
  831. clear: both;
  832. border: solid #ddd;
  833. border-width: 1px 0 0;
  834. }
  835. .column-group:before, .column-group:after {
  836. display: table;
  837. content: " ";
  838. }
  839. .column-group:after {
  840. clear: both;
  841. }
  842. .container {
  843. position: relative;
  844. padding-right: 0;
  845. padding-left: 0;
  846. margin-right: auto;
  847. margin-left: auto;
  848. }
  849. .column-group {
  850. width: auto;
  851. }
  852. .column {
  853. float: left;
  854. width: 100%;
  855. padding-right: 15px;
  856. padding-left: 15px;
  857. }
  858. .column.pull-right {
  859. float: right;
  860. }
  861. .column .column-group {
  862. margin-right: -15px;
  863. margin-left: -15px;
  864. }
  865. @media screen and (min-width: 768px) {
  866. .container {
  867. max-width: 940px;
  868. padding: 0;
  869. }
  870. .lg-units-4 {
  871. width: 33.333%;
  872. }
  873. .lg-units-5 {
  874. width: 41.666%;
  875. }
  876. .lg-units-7 {
  877. width: 58.333%;
  878. }
  879. .lg-units-8 {
  880. width: 66.666%;
  881. }
  882. }
  883. @media screen and (min-width: 1200px) {
  884. .container {
  885. max-width: 1170px;
  886. }
  887. }
  888. .platform-ios a {
  889. color: #007aff;
  890. }
  891. .platform-ios a:active {
  892. color: #0062cc;
  893. }
  894. .platform-ios .content {
  895. background-color: #efeff4;
  896. }
  897. .platform-ios .h5, .platform-ios h5,
  898. .platform-ios .h6, .platform-ios h6,
  899. .platform-ios p {
  900. color: #8f8f94;
  901. }
  902. .platform-ios .h5, .platform-ios h5,
  903. .platform-ios .h6, .platform-ios h6 {
  904. font-weight: normal;
  905. text-transform: uppercase;
  906. }
  907. .platform-ios .btn {
  908. color: #929292;
  909. background-color: rgba(247, 247, 247, .98);
  910. border: 1px solid #929292;
  911. -webkit-transition: all;
  912. -moz-transition: all;
  913. transition: all;
  914. -webkit-transition-timing-function: linear;
  915. -moz-transition-timing-function: linear;
  916. transition-timing-function: linear;
  917. -webkit-transition-duration: .2s;
  918. -moz-transition-duration: .2s;
  919. transition-duration: .2s;
  920. }
  921. .platform-ios .btn:active, .platform-ios .btn.active {
  922. color: #fff;
  923. background-color: #929292;
  924. }
  925. .platform-ios .btn-primary {
  926. color: #fff;
  927. background-color: #007aff;
  928. border: 1px solid #007aff;
  929. }
  930. .platform-ios .btn-primary:active, .platform-ios .btn-primary.active {
  931. background-color: #0062cc;
  932. border: 1px solid #0062cc;
  933. }
  934. .platform-ios .btn-positive {
  935. color: #fff;
  936. background-color: #4cd964;
  937. border: 1px solid #4cd964;
  938. }
  939. .platform-ios .btn-positive:active, .platform-ios .btn-positive.active {
  940. background-color: #2ac845;
  941. border: 1px solid #2ac845;
  942. }
  943. .platform-ios .btn-negative {
  944. color: #fff;
  945. background-color: #dd524d;
  946. border: 1px solid #dd524d;
  947. }
  948. .platform-ios .btn-negative:active, .platform-ios .btn-negative.active {
  949. background-color: #cf2d28;
  950. border: 1px solid #cf2d28;
  951. }
  952. .platform-ios .btn-outlined {
  953. background-color: transparent;
  954. }
  955. .platform-ios .btn-outlined.btn-primary {
  956. color: #007aff;
  957. }
  958. .platform-ios .btn-outlined.btn-positive {
  959. color: #4cd964;
  960. }
  961. .platform-ios .btn-outlined.btn-negative {
  962. color: #dd524d;
  963. }
  964. .platform-ios .btn-outlined.btn-primary:active, .platform-ios .btn-outlined.btn-positive:active, .platform-ios .btn-outlined.btn-negative:active {
  965. color: #fff;
  966. }
  967. .platform-ios .btn-link {
  968. color: #007aff;
  969. background-color: transparent;
  970. border: none;
  971. }
  972. .platform-ios .btn-link:active, .platform-ios .btn-link.active {
  973. color: #0062cc;
  974. background-color: transparent;
  975. }
  976. .platform-ios .btn .badge {
  977. background-color: rgba(0, 0, 0, .15);
  978. }
  979. .platform-ios .btn .badge.badge-inverted {
  980. background-color: transparent;
  981. }
  982. .platform-ios .btn:active .badge {
  983. color: #fff;
  984. }
  985. .platform-ios .bar {
  986. background-color: rgba(247, 247, 247, .98);
  987. border-bottom: 0;
  988. -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, .85);
  989. box-shadow: 0 0 1px rgba(0, 0, 0, .85);
  990. }
  991. .platform-ios .bar.bar-header-secondary {
  992. top: 44px;
  993. }
  994. .platform-ios .bar.bar-footer-secondary {
  995. bottom: 44px;
  996. }
  997. .platform-ios .bar.bar-footer-secondary-tab {
  998. bottom: 50px;
  999. }
  1000. .platform-ios .bar.bar-footer, .platform-ios .bar.bar-footer-secondary, .platform-ios .bar.bar-footer-secondary-tab {
  1001. border-top: 0;
  1002. }
  1003. .platform-ios .bar-tab {
  1004. border-top: 0;
  1005. }
  1006. .platform-ios .tab-item {
  1007. color: #929292;
  1008. }
  1009. .platform-ios .tab-item.active, .platform-ios .tab-item:active {
  1010. color: #007aff;
  1011. }
  1012. .platform-ios .bar-nav .btn-link {
  1013. color: #007aff;
  1014. }
  1015. .platform-ios .bar-nav .btn-link:active {
  1016. color: #007aff;
  1017. opacity: .6;
  1018. }
  1019. .platform-ios .badge.badge-inverted {
  1020. color: #929292;
  1021. background-color: transparent;
  1022. }
  1023. .platform-ios .badge-primary {
  1024. color: #fff;
  1025. background-color: #007aff;
  1026. }
  1027. .platform-ios .badge-primary.badge-inverted {
  1028. color: #007aff;
  1029. background-color: transparent;
  1030. }
  1031. .platform-ios .badge-positive {
  1032. color: #fff;
  1033. background-color: #4cd964;
  1034. }
  1035. .platform-ios .badge-positive.badge-inverted {
  1036. color: #4cd964;
  1037. background-color: transparent;
  1038. }
  1039. .platform-ios .badge-negative {
  1040. color: #fff;
  1041. background-color: #dd524d;
  1042. }
  1043. .platform-ios .badge-negative.badge-inverted {
  1044. color: #dd524d;
  1045. background-color: transparent;
  1046. }
  1047. .platform-ios .card .table-view {
  1048. background-image: none;
  1049. }
  1050. .platform-ios .card .table-view-cell:last-child {
  1051. background-image: none;
  1052. }
  1053. .platform-ios .table-view {
  1054. background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>"), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
  1055. background-repeat: no-repeat;
  1056. background-position: 0 100%, 0 0;
  1057. border-top: 0;
  1058. border-bottom: 0;
  1059. }
  1060. .platform-ios .table-view .table-view-cell {
  1061. background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
  1062. background-repeat: no-repeat;
  1063. background-position: 15px 100%;
  1064. border-bottom: 0;
  1065. }
  1066. .platform-ios .table-view .table-view-cell:last-child {
  1067. background-image: none;
  1068. }
  1069. .platform-ios .table-view .table-view-cell > a:not(.btn):active {
  1070. color: inherit;
  1071. }
  1072. .platform-ios .table-view .table-view-divider {
  1073. background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>"), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
  1074. background-repeat: no-repeat;
  1075. background-position: 0 100%, 0 0;
  1076. border-top: 0;
  1077. border-bottom: 0;
  1078. }
  1079. .platform-ios select,
  1080. .platform-ios textarea,
  1081. .platform-ios input[type="text"],
  1082. .platform-ios input[type="search"],
  1083. .platform-ios input[type="password"],
  1084. .platform-ios input[type="datetime"],
  1085. .platform-ios input[type="datetime-local"],
  1086. .platform-ios input[type="date"],
  1087. .platform-ios input[type="month"],
  1088. .platform-ios input[type="time"],
  1089. .platform-ios input[type="week"],
  1090. .platform-ios input[type="number"],
  1091. .platform-ios input[type="email"],
  1092. .platform-ios input[type="url"],
  1093. .platform-ios input[type="tel"],
  1094. .platform-ios input[type="color"],
  1095. .platform-ios .input-group {
  1096. height: 40px;
  1097. padding: 10px 15px;
  1098. border: 1px solid rgba(0, 0, 0, .2);
  1099. }
  1100. .platform-ios input[type="search"] {
  1101. height: 34px;
  1102. text-align: center;
  1103. background-color: rgba(0, 0, 0, .1);
  1104. border: 0;
  1105. border-radius: 6px;
  1106. }
  1107. .platform-ios input[type="search"]:focus {
  1108. text-align: left;
  1109. }
  1110. .platform-ios select,
  1111. .platform-ios textarea,
  1112. .platform-ios .input-group {
  1113. height: auto;
  1114. }
  1115. .platform-ios .input-group {
  1116. padding: 0;
  1117. background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>"), url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
  1118. background-repeat: no-repeat;
  1119. background-position: 0 100%, 0 0;
  1120. border: 0;
  1121. }
  1122. .platform-ios .input-group input {
  1123. background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
  1124. background-repeat: no-repeat;
  1125. background-position: 15px 100%;
  1126. border: 0;
  1127. }
  1128. .platform-ios .input-group input:last-child {
  1129. background-image: none;
  1130. }
  1131. .platform-ios .input-row {
  1132. background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='1'><rect fill='#c8c7cc' x='0' y='0' width='100%' height='0.5'/></svg>");
  1133. background-repeat: no-repeat;
  1134. background-position: 15px 100%;
  1135. border-bottom: 0;
  1136. }
  1137. .platform-ios .input-row:last-child,
  1138. .platform-ios .input-row label + input {
  1139. background-image: none;
  1140. }
  1141. .platform-ios .segmented-control {
  1142. background-color: transparent;
  1143. border: 1px solid #929292;
  1144. }
  1145. .platform-ios .segmented-control .control-item {
  1146. color: #929292;
  1147. border-color: #929292;
  1148. -webkit-transition: background-color .1s linear;
  1149. -moz-transition: background-color .1s linear;
  1150. transition: background-color .1s linear;
  1151. }
  1152. .platform-ios .segmented-control .control-item:active {
  1153. background-color: #ebebeb;
  1154. }
  1155. .platform-ios .segmented-control .control-item.active {
  1156. color: #fff;
  1157. background-color: #929292;
  1158. }
  1159. .platform-ios .segmented-control-primary {
  1160. border: 1px solid #007aff;
  1161. }
  1162. .platform-ios .segmented-control-primary .control-item {
  1163. color: #007aff;
  1164. border-color: inherit;
  1165. }
  1166. .platform-ios .segmented-control-primary .control-item:active {
  1167. background-color: #b3d7ff;
  1168. }
  1169. .platform-ios .segmented-control-primary .control-item.active {
  1170. color: #fff;
  1171. background-color: #007aff;
  1172. }
  1173. .platform-ios .segmented-control-positive {
  1174. border: 1px solid #4cd964;
  1175. }
  1176. .platform-ios .segmented-control-positive .control-item {
  1177. color: #4cd964;
  1178. border-color: inherit;
  1179. }
  1180. .platform-ios .segmented-control-positive .control-item:active {
  1181. background-color: #dff8e3;
  1182. }
  1183. .platform-ios .segmented-control-positive .control-item.active {
  1184. color: #fff;
  1185. background-color: #4cd964;
  1186. }
  1187. .platform-ios .segmented-control-negative {
  1188. border: 1px solid #dd524d;
  1189. }
  1190. .platform-ios .segmented-control-negative .control-item {
  1191. color: #dd524d;
  1192. border-color: inherit;
  1193. }
  1194. .platform-ios .segmented-control-negative .control-item:active {
  1195. background-color: #fae4e3;
  1196. }
  1197. .platform-ios .segmented-control-negative .control-item.active {
  1198. color: #fff;
  1199. background-color: #dd524d;
  1200. }
  1201. .platform-ios .popover {
  1202. border-radius: 12px;
  1203. -webkit-transition: -webkit-transform .2s ease-in-out, opacity .2s ease-in-out;
  1204. -moz-transition: -webkit-transform .2s ease-in-out, opacity .2s ease-in-out;
  1205. transition: -webkit-transform .2s ease-in-out, opacity .2s ease-in-out;
  1206. }
  1207. .platform-ios .popover:before {
  1208. border-bottom: 15px solid rgba(247, 247, 247, .98);
  1209. }
  1210. .platform-ios .popover .bar {
  1211. -webkit-box-shadow: none;
  1212. box-shadow: none;
  1213. }
  1214. .platform-ios .popover .bar-nav {
  1215. border-bottom: 1px solid rgba(0, 0, 0, .15);
  1216. }
  1217. .platform-ios .popover .table-view {
  1218. background-image: none;
  1219. border-radius: 12px;
  1220. }
  1221. .platform-ios .modal {
  1222. -webkit-transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1223. -moz-transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1224. transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1225. }
  1226. .platform-ios .modal.active {
  1227. -webkit-transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1228. -moz-transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1229. transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1230. }
  1231. .platform-ios .toggle {
  1232. width: 47px;
  1233. border: 2px solid #e6e6e6;
  1234. -webkit-box-shadow: inset 0 0 0 0 #e1e1e1;
  1235. box-shadow: inset 0 0 0 0 #e1e1e1;
  1236. -webkit-transition-duration: .2s;
  1237. -moz-transition-duration: .2s;
  1238. transition-duration: .2s;
  1239. -webkit-transition-property: box-shadow, border;
  1240. -moz-transition-property: box-shadow, border;
  1241. transition-property: box-shadow, border;
  1242. }
  1243. .platform-ios .toggle .toggle-handle {
  1244. border: 1px solid rgba(0, 0, 0, .2);
  1245. -webkit-box-shadow: 0 3px 3px rgba(0, 0, 0, .08);
  1246. box-shadow: 0 3px 3px rgba(0, 0, 0, .08);
  1247. -webkit-transition-property: -webkit-transform, border, width;
  1248. -moz-transition-property: -moz-transform, border, width;
  1249. transition-property: transform, border, width;
  1250. }
  1251. .platform-ios .toggle:before {
  1252. display: none;
  1253. }
  1254. .platform-ios .toggle.active {
  1255. background-color: transparent;
  1256. border: 2px solid #4cd964;
  1257. -webkit-box-shadow: inset 0 0 0 13px #4cd964;
  1258. box-shadow: inset 0 0 0 13px #4cd964;
  1259. }
  1260. .platform-ios .toggle.active .toggle-handle {
  1261. -webkit-transform: translate3d(17px, 0, 0);
  1262. -ms-transform: translate3d(17px, 0, 0);
  1263. transform: translate3d(17px, 0, 0);
  1264. }
  1265. .platform-ios .toggle.active .toggle-handle {
  1266. border-color: #4cd964;
  1267. }
  1268. .platform-ios .content.fade {
  1269. -webkit-transition: opacity .2s ease-in-out;
  1270. -moz-transition: opacity .2s ease-in-out;
  1271. transition: opacity .2s ease-in-out;
  1272. }
  1273. .platform-ios .content.sliding {
  1274. -webkit-transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1275. -moz-transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1276. transition-timing-function: cubic-bezier(.1, .5, .1, 1);
  1277. }
  1278. .platform-ios .content.sliding.sliding-in, .platform-ios .content.sliding.right:not([class*="sliding-in"]) {
  1279. -webkit-animation-name: fadeOverlay;
  1280. -moz-animation-name: fadeOverlay;
  1281. animation-name: fadeOverlay;
  1282. -webkit-animation-duration: .4s;
  1283. -moz-animation-duration: .4s;
  1284. animation-duration: .4s;
  1285. }
  1286. .platform-ios .content.sliding.right:not([class*="sliding-in"]) {
  1287. -webkit-animation-direction: reverse;
  1288. -moz-animation-direction: reverse;
  1289. animation-direction: reverse;
  1290. }
  1291. .platform-ios .content.sliding.left {
  1292. -webkit-transform: translate3d(-20%, 0, 0);
  1293. -ms-transform: translate3d(-20%, 0, 0);
  1294. transform: translate3d(-20%, 0, 0);
  1295. }
  1296. @-webkit-keyframes fadeOverlay {
  1297. from {
  1298. -webkit-box-shadow: 0 0 10px transparent, -320px 0 0 transparent;
  1299. box-shadow: 0 0 10px transparent, -320px 0 0 transparent;
  1300. }
  1301. to {
  1302. -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, .3), -320px 0 0 rgba(0, 0, 0, .1);
  1303. box-shadow: 0 0 10px rgba(0, 0, 0, .3), -320px 0 0 rgba(0, 0, 0, .1);
  1304. }
  1305. }
  1306. .platform-ios .device {
  1307. background-position: -395px 0;
  1308. }
  1309. .platform-ios .device .device-content {
  1310. background-color: #efeff4;
  1311. }
  1312. .platform-android body {
  1313. font-family: "Roboto", sans-serif;
  1314. font-size: 18px;
  1315. line-height: 22px;
  1316. color: #222;
  1317. }
  1318. .platform-android a {
  1319. color: #33b5e5;
  1320. }
  1321. .platform-android a:active {
  1322. color: #1a9bcb;
  1323. }
  1324. .platform-android .content {
  1325. background-color: #f2f2f2;
  1326. }
  1327. .platform-android .bar-nav ~ .content {
  1328. padding-top: 50px;
  1329. }
  1330. .platform-android .bar-header-secondary ~ .content {
  1331. padding-top: 100px;
  1332. }
  1333. .platform-android .bar-tab ~ .content {
  1334. padding-top: 50px;
  1335. padding-bottom: 0;
  1336. }
  1337. .platform-android .bar-footer ~ .content {
  1338. padding-bottom: 50px;
  1339. }
  1340. .platform-android .bar-footer-secondary ~ .content {
  1341. padding-bottom: 100px;
  1342. }
  1343. .platform-android .btn {
  1344. padding: 8px 15px;
  1345. font-size: 14px;
  1346. color: #222;
  1347. background-color: #cecece;
  1348. border: 0;
  1349. border-radius: 2px;
  1350. -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 1px rgba(0, 0, 0, .25);
  1351. box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2), 0 1px 1px rgba(0, 0, 0, .25);
  1352. }
  1353. .platform-android .btn:active, .platform-android .btn.active {
  1354. color: #222;
  1355. background-color: #999;
  1356. border: 0;
  1357. -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2);
  1358. box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2);
  1359. }
  1360. .platform-android .btn-primary {
  1361. color: #fff;
  1362. background-color: #33b5e5;
  1363. border: 0;
  1364. }
  1365. .platform-android .btn-primary:active, .platform-android .btn-primary.active {
  1366. color: #fff;
  1367. background-color: #1a9bcb;
  1368. border: 0;
  1369. }
  1370. .platform-android .btn-positive {
  1371. color: #fff;
  1372. background-color: #9c0;
  1373. border: 0;
  1374. }
  1375. .platform-android .btn-positive:active, .platform-android .btn-positive.active {
  1376. color: #fff;
  1377. background-color: #739900;
  1378. border: 0;
  1379. }
  1380. .platform-android .btn-negative {
  1381. color: #fff;
  1382. background-color: #f44;
  1383. border: 0;
  1384. }
  1385. .platform-android .btn-negative:active, .platform-android .btn-negative.active {
  1386. color: #fff;
  1387. background-color: #f11;
  1388. border: 0;
  1389. }
  1390. .platform-android .btn-outlined {
  1391. background-color: transparent;
  1392. border: 1px solid #999;
  1393. -webkit-box-shadow: none;
  1394. box-shadow: none;
  1395. }
  1396. .platform-android .btn-outlined.btn-primary {
  1397. color: #33b5e5;
  1398. border: 1px solid #33b5e5;
  1399. }
  1400. .platform-android .btn-outlined.btn-primary:active {
  1401. background-color: #33b5e5;
  1402. border: 1px solid #33b5e5;
  1403. }
  1404. .platform-android .btn-outlined.btn-positive {
  1405. color: #9c0;
  1406. border: 1px solid #9c0;
  1407. }
  1408. .platform-android .btn-outlined.btn-positive:active {
  1409. background-color: #9c0;
  1410. border: 1px solid #9c0;
  1411. }
  1412. .platform-android .btn-outlined.btn-negative {
  1413. color: #f44;
  1414. border: 1px solid #f44;
  1415. }
  1416. .platform-android .btn-outlined.btn-negative:active {
  1417. background-color: #f44;
  1418. border: 1px solid #f44;
  1419. }
  1420. .platform-android .btn-outlined:active {
  1421. background-color: #999;
  1422. border: 1px solid #999;
  1423. -webkit-box-shadow: none;
  1424. box-shadow: none;
  1425. }
  1426. .platform-android .btn-outlined.btn-primary:active, .platform-android .btn-outlined.btn-positive:active, .platform-android .btn-outlined.btn-negative:active {
  1427. color: #fff;
  1428. -webkit-box-shadow: none;
  1429. box-shadow: none;
  1430. }
  1431. .platform-android .btn-link {
  1432. color: #33b5e5;
  1433. background-color: transparent;
  1434. border: none;
  1435. -webkit-box-shadow: none;
  1436. box-shadow: none;
  1437. }
  1438. .platform-android .btn-link:active, .platform-android .btn-link.active {
  1439. color: #1a9bcb;
  1440. background-color: transparent;
  1441. -webkit-box-shadow: none;
  1442. box-shadow: none;
  1443. }
  1444. .platform-android .btn-block {
  1445. padding: 15px 0;
  1446. font-size: 18px;
  1447. }
  1448. .platform-android .btn .badge {
  1449. background-color: rgba(0, 0, 0, .15);
  1450. }
  1451. .platform-android .btn .badge.badge-inverted {
  1452. background-color: transparent;
  1453. }
  1454. .platform-android .btn:active .badge {
  1455. color: #fff;
  1456. }
  1457. .platform-android .bar {
  1458. height: 50px;
  1459. background-color: #ddd;
  1460. border-bottom: 1px solid #b1b1b1;
  1461. -webkit-box-shadow: inset 0 -2px 0 #d2d2d2, 0 3px 3px rgba(0, 0, 0, .07);
  1462. box-shadow: inset 0 -2px 0 #d2d2d2, 0 3px 3px rgba(0, 0, 0, .07);
  1463. }
  1464. .platform-android .bar.bar-header-secondary {
  1465. top: 50px;
  1466. }
  1467. .platform-android .bar.bar-footer-secondary {
  1468. bottom: 50px;
  1469. }
  1470. .platform-android .bar.bar-footer-secondary-tab {
  1471. bottom: 50px;
  1472. }
  1473. .platform-android .bar .bar-footer,
  1474. .platform-android .bar .bar-footer-secondary,
  1475. .platform-android .bar .bar-footer-secondary-tab {
  1476. border-top: 1px solid #b1b1b1;
  1477. border-bottom: 0;
  1478. -webkit-box-shadow: inset 0 -2px 0 #33b5e5;
  1479. box-shadow: inset 0 -2px 0 #33b5e5;
  1480. }
  1481. .platform-android .bar-tab {
  1482. top: 0;
  1483. bottom: auto;
  1484. height: 50px;
  1485. border-top: 0;
  1486. }
  1487. .platform-android .bar-tab .tab-item {
  1488. color: #929292;
  1489. }
  1490. .platform-android .bar-tab .tab-item.active {
  1491. color: #33b5e5;
  1492. -webkit-box-shadow: inset 0 -2px 0 #33b5e5;
  1493. box-shadow: inset 0 -2px 0 #33b5e5;
  1494. }
  1495. .platform-android .bar-tab .tab-item:active {
  1496. color: #929292;
  1497. background-color: #78c6e3;
  1498. }
  1499. .platform-android .bar-tab .tab-item .icon {
  1500. top: 3px;
  1501. padding-top: 0;
  1502. padding-bottom: 0;
  1503. }
  1504. .platform-android .title {
  1505. position: static;
  1506. padding-left: 15px;
  1507. font-size: 18px;
  1508. line-height: 49px;
  1509. text-align: left;
  1510. }
  1511. .platform-android .bar .btn {
  1512. top: 7px;
  1513. padding-top: 10px;
  1514. padding-bottom: 10px;
  1515. }
  1516. .platform-android .bar .btn-link {
  1517. top: 0;
  1518. padding: 0;
  1519. font-size: 18px;
  1520. line-height: 49px;
  1521. color: #33b5e5;
  1522. }
  1523. .platform-android .bar .btn-link:active, .platform-android .bar .btn-link.active {
  1524. color: #1a9bcb;
  1525. }
  1526. .platform-android .bar .btn-link .icon {
  1527. top: 2px;
  1528. padding: 0;
  1529. }
  1530. .platform-android .bar .btn-block {
  1531. top: 4px;
  1532. }
  1533. .platform-android .bar .segmented-control {
  1534. top: 7px;
  1535. }
  1536. .platform-android .bar .icon {
  1537. padding-top: 13px;
  1538. padding-bottom: 13px;
  1539. }
  1540. .platform-android .bar .title .icon {
  1541. padding: 0;
  1542. }
  1543. .platform-android .bar .title .icon.icon-caret {
  1544. top: 10px;
  1545. color: #777;
  1546. }
  1547. .platform-android .bar input[type="search"] {
  1548. height: 35px;
  1549. }
  1550. .platform-android .badge.badge-inverted {
  1551. color: #999;
  1552. background-color: transparent;
  1553. }
  1554. .platform-android .badge-primary {
  1555. color: #fff;
  1556. background-color: #33b5e5;
  1557. }
  1558. .platform-android .badge-primary.badge-inverted {
  1559. color: #33b5e5;
  1560. background-color: transparent;
  1561. }
  1562. .platform-android .badge-positive {
  1563. color: #fff;
  1564. background-color: #9c0;
  1565. }
  1566. .platform-android .badge-positive.badge-inverted {
  1567. color: #9c0;
  1568. background-color: transparent;
  1569. }
  1570. .platform-android .badge-negative {
  1571. color: #fff;
  1572. background-color: #f44;
  1573. }
  1574. .platform-android .badge-negative.badge-inverted {
  1575. color: #f44;
  1576. background-color: transparent;
  1577. }
  1578. .platform-android .card {
  1579. background-color: transparent;
  1580. border-color: #d9d9d9;
  1581. border-radius: 2px;
  1582. }
  1583. .platform-android .table-view {
  1584. background-color: transparent;
  1585. }
  1586. .platform-android .table-view .table-view-cell {
  1587. border-bottom: 1px solid #d9d9d9;
  1588. }
  1589. .platform-android .table-view .table-view-cell:last-child {
  1590. background-image: none;
  1591. }
  1592. .platform-android .table-view .table-view-cell > a:not(.btn):active {
  1593. color: inherit;
  1594. background-color: #e0e0e0;
  1595. }
  1596. .platform-android .table-view .table-view-cell > a:not(.btn):active .icon {
  1597. color: #fff;
  1598. }
  1599. .platform-android .table-view .table-view-divider {
  1600. padding-top: 25px;
  1601. font-size: 12px;
  1602. font-weight: bold;
  1603. text-transform: uppercase;
  1604. background-color: transparent;
  1605. border-top: 0;
  1606. border-bottom: 2px solid #a9a9a9;
  1607. }
  1608. .platform-android .table-view-cell .navigate-left > .btn,
  1609. .platform-android .table-view-cell .navigate-left > .badge,
  1610. .platform-android .table-view-cell .navigate-left > .toggle,
  1611. .platform-android .table-view-cell .navigate-right > .btn,
  1612. .platform-android .table-view-cell .navigate-right > .badge,
  1613. .platform-android .table-view-cell .navigate-right > .toggle,
  1614. .platform-android .table-view-cell .push-left > .btn,
  1615. .platform-android .table-view-cell .push-left > .badge,
  1616. .platform-android .table-view-cell .push-left > .toggle,
  1617. .platform-android .table-view-cell .push-right > .btn,
  1618. .platform-android .table-view-cell .push-right > .badge,
  1619. .platform-android .table-view-cell .push-right > .toggle,
  1620. .platform-android .table-view-cell > a .navigate-left > .btn,
  1621. .platform-android .table-view-cell > a .navigate-left > .badge,
  1622. .platform-android .table-view-cell > a .navigate-left > .toggle,
  1623. .platform-android .table-view-cell > a .navigate-right > .btn,
  1624. .platform-android .table-view-cell > a .navigate-right > .badge,
  1625. .platform-android .table-view-cell > a .navigate-right > .toggle,
  1626. .platform-android .table-view-cell > a .push-left > .btn,
  1627. .platform-android .table-view-cell > a .push-left > .badge,
  1628. .platform-android .table-view-cell > a .push-left > .toggle,
  1629. .platform-android .table-view-cell > a .push-right > .btn,
  1630. .platform-android .table-view-cell > a .push-right > .badge,
  1631. .platform-android .table-view-cell > a .push-right > .toggle {
  1632. right: 15px;
  1633. }
  1634. .platform-android select,
  1635. .platform-android textarea,
  1636. .platform-android input[type="text"],
  1637. .platform-android input[type="search"],
  1638. .platform-android input[type="password"],
  1639. .platform-android input[type="datetime"],
  1640. .platform-android input[type="datetime-local"],
  1641. .platform-android input[type="date"],
  1642. .platform-android input[type="month"],
  1643. .platform-android input[type="time"],
  1644. .platform-android input[type="week"],
  1645. .platform-android input[type="number"],
  1646. .platform-android input[type="email"],
  1647. .platform-android input[type="url"],
  1648. .platform-android input[type="tel"],
  1649. .platform-android input[type="color"],
  1650. .platform-android .input-group {
  1651. height: 40px;
  1652. padding: 10px 15px;
  1653. border: 1px solid rgba(0, 0, 0, .2);
  1654. -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
  1655. box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
  1656. }
  1657. .platform-android input[type="search"] {
  1658. border-radius: 2px;
  1659. }
  1660. .platform-android select,
  1661. .platform-android textarea,
  1662. .platform-android .input-group {
  1663. height: auto;
  1664. }
  1665. .platform-android .input-group {
  1666. padding: 0;
  1667. border: 0;
  1668. }
  1669. .platform-android .input-group input {
  1670. border: 0;
  1671. border-bottom: 1px solid #d9d9d9;
  1672. -webkit-box-shadow: none;
  1673. box-shadow: none;
  1674. }
  1675. .platform-android .input-group input:last-child {
  1676. background-image: none;
  1677. }
  1678. .platform-android .input-row {
  1679. height: 40px;
  1680. border-bottom: 1px solid #d9d9d9;
  1681. }
  1682. .platform-android .input-row label {
  1683. padding-top: 10px;
  1684. padding-bottom: 10px;
  1685. }
  1686. .platform-android .input-row label + input {
  1687. background-image: none;
  1688. border-bottom: 0;
  1689. }
  1690. .platform-android .segmented-control {
  1691. font-size: 14px;
  1692. background-color: #cecece;
  1693. border: 0;
  1694. border-radius: 2px;
  1695. -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .25);
  1696. box-shadow: 0 1px 1px rgba(0, 0, 0, .25);
  1697. }
  1698. .platform-android .segmented-control .control-item {
  1699. padding-top: 10px;
  1700. padding-bottom: 10px;
  1701. color: #222;
  1702. border-left: 1px solid #999;
  1703. -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2);
  1704. box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .2);
  1705. }
  1706. .platform-android .segmented-control .control-item:first-child {
  1707. border-left-width: 0;
  1708. }
  1709. .platform-android .segmented-control .control-item:active, .platform-android .segmented-control .control-item.active {
  1710. background-color: #999;
  1711. }
  1712. .platform-android .segmented-control-primary {
  1713. border: 0;
  1714. }
  1715. .platform-android .segmented-control-primary .control-item {
  1716. color: #fff;
  1717. border-color: inherit;
  1718. }
  1719. .platform-android .segmented-control-primary .control-item:active, .platform-android .segmented-control-primary .control-item.active {
  1720. color: #fff;
  1721. background-color: #33b5e5;
  1722. }
  1723. .platform-android .segmented-control-positive {
  1724. border: 0;
  1725. }
  1726. .platform-android .segmented-control-positive .control-item {
  1727. color: #fff;
  1728. border-color: inherit;
  1729. }
  1730. .platform-android .segmented-control-positive .control-item:active, .platform-android .segmented-control-positive .control-item.active {
  1731. color: #fff;
  1732. background-color: #9c0;
  1733. }
  1734. .platform-android .segmented-control-negative {
  1735. border: 0;
  1736. }
  1737. .platform-android .segmented-control-negative .control-item {
  1738. color: #fff;
  1739. border-color: inherit;
  1740. }
  1741. .platform-android .segmented-control-negative .control-item:active, .platform-android .segmented-control-negative .control-item.active {
  1742. color: #fff;
  1743. background-color: #f44;
  1744. }
  1745. .platform-android .popover {
  1746. top: 47px;
  1747. left: 15px;
  1748. width: 200px;
  1749. margin-left: 0;
  1750. border: 1px solid #9b9b9b;
  1751. border-radius: 0;
  1752. -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
  1753. box-shadow: 0 0 3px rgba(0, 0, 0, .2);
  1754. -webkit-transition: -webkit-transform .1s ease-in-out, opacity .2s ease-in-out;
  1755. -moz-transition: -moz-transform .1s ease-in-out, opacity .2s ease-in-out;
  1756. transition: transform .1s ease-in-out, opacity .2s ease-in-out;
  1757. -webkit-transform: scale(.75);
  1758. -ms-transform: scale(.75);
  1759. transform: scale(.75);
  1760. }
  1761. .platform-android .popover:before {
  1762. display: none;
  1763. }
  1764. .platform-android .popover.visible {
  1765. -webkit-transform: scale(1);
  1766. -ms-transform: scale(1);
  1767. transform: scale(1);
  1768. }
  1769. .platform-android .backdrop {
  1770. background-color: transparent;
  1771. }
  1772. .platform-android .popover .bar {
  1773. border-radius: 0;
  1774. }
  1775. .platform-android .popover .bar-nav ~ .table-view {
  1776. padding-top: 50px;
  1777. }
  1778. .platform-android .popover .table-view {
  1779. border-radius: 12px;
  1780. }
  1781. .platform-android .toggle {
  1782. width: 104px;
  1783. height: 28px;
  1784. background-color: #d7d7d7;
  1785. border: 2px solid #d7d7d7;
  1786. border-radius: 0;
  1787. }
  1788. .platform-android .toggle .toggle-handle {
  1789. top: 0;
  1790. left: 0;
  1791. width: 50px;
  1792. height: 24px;
  1793. background-color: #bebebe;
  1794. border: 1px solid #b5b5b5;
  1795. border-radius: 2px;
  1796. -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(0, 0, 0, .1);
  1797. box-shadow: inset 0 1px 0 rgba(255, 255, 255, .3), inset 0 -1px 0 rgba(0, 0, 0, .1);
  1798. }
  1799. .platform-android .toggle:before {
  1800. top: 1px;
  1801. right: auto;
  1802. left: 11px;
  1803. z-index: 3;
  1804. color: #fff;
  1805. }
  1806. .platform-android .toggle.active {
  1807. background-color: #d7d7d7;
  1808. border: 2px solid #d7d7d7;
  1809. }
  1810. .platform-android .toggle.active .toggle-handle {
  1811. margin-right: 2px;
  1812. background-color: #33b5e5;
  1813. border-color: #33b5e5;
  1814. -webkit-transform: translate3d(50px, 0, 0);
  1815. -ms-transform: translate3d(50px, 0, 0);
  1816. transform: translate3d(50px, 0, 0);
  1817. }
  1818. .platform-android .toggle.active:before {
  1819. right: 14px;
  1820. left: auto;
  1821. color: #fff;
  1822. }
  1823. .platform-android .navigate-left:after,
  1824. .platform-android .push-left:after {
  1825. content: '';
  1826. }
  1827. .platform-android .navigate-right:after,
  1828. .platform-android .push-right:after {
  1829. content: '';
  1830. }
  1831. .platform-android .icon-caret:before {
  1832. content: '\e800';
  1833. }
  1834. .platform-android .icon-down:before,
  1835. .platform-android .icon-down-nav:before {
  1836. content: '\e801';
  1837. }
  1838. .platform-android .icon-download:before {
  1839. content: '\e802';
  1840. }
  1841. .platform-android .icon-left:before,
  1842. .platform-android .icon-left-nav:before {
  1843. content: '\e803';
  1844. }
  1845. .platform-android .icon-more-vertical:before {
  1846. content: '\e804';
  1847. }
  1848. .platform-android .icon-more:before {
  1849. content: '\e805';
  1850. }
  1851. .platform-android .icon-right:before,
  1852. .platform-android .icon-right-nav:before {
  1853. content: '\e806';
  1854. }
  1855. .platform-android .icon-search:before {
  1856. content: '\e807';
  1857. }
  1858. .platform-android .icon-share:before {
  1859. content: '\e808';
  1860. }
  1861. .platform-android .icon-up:before,
  1862. .platform-android .icon-up-nav:before {
  1863. content: '\e809';
  1864. }
  1865. .platform-android .device {
  1866. font-family: 'Roboto', sans-serif;
  1867. background-position: -790px 0;
  1868. }
  1869. .platform-android .device .device-content {
  1870. font-size: 18px;
  1871. line-height: 22px;
  1872. background-color: #f2f2f2;
  1873. }
  1874. .platform-android .device .content {
  1875. top: 50px;
  1876. }
  1877. .platform-android .device .popover {
  1878. -webkit-transform: scale(1);
  1879. -ms-transform: scale(1);
  1880. transform: scale(1);
  1881. }
  1882. .platform-android .bar ~ .content {
  1883. padding: 0;
  1884. }
  1885. @-webkit-keyframes fadeintext {
  1886. 0% {
  1887. opacity: 0;
  1888. }
  1889. 100% {
  1890. opacity: 1;
  1891. }
  1892. }
  1893. .bs-callout {
  1894. padding: 20px;
  1895. margin: 20px 0;
  1896. border-left: 3px solid #eee;
  1897. }
  1898. .bs-callout h4 {
  1899. margin-top: 0;
  1900. margin-bottom: 5px;
  1901. }
  1902. .bs-callout p:last-child {
  1903. margin-bottom: 0;
  1904. }
  1905. .bs-callout code {
  1906. background-color: #fff;
  1907. border-radius: 3px;
  1908. }
  1909. .bs-callout-danger {
  1910. background-color: #fdf7f7;
  1911. border-color: #d9534f;
  1912. }
  1913. .bs-callout-danger h4 {
  1914. color: #d9534f;
  1915. }
  1916. .bs-callout-warning {
  1917. background-color: #fcf8f2;
  1918. border-color: #f0ad4e;
  1919. }
  1920. .bs-callout-warning h4 {
  1921. color: #f0ad4e;
  1922. }
  1923. .bs-callout-info {
  1924. background-color: #f4f8fa;
  1925. border-color: #5bc0de;
  1926. }
  1927. .bs-callout-info h4 {
  1928. color: #5bc0de;
  1929. }
  1930. .list-group {
  1931. padding-left: 0;
  1932. margin-bottom: 20px;
  1933. }
  1934. .list-group-item:first-child {
  1935. border-top-left-radius: 4px;
  1936. border-top-right-radius: 4px;
  1937. }
  1938. .list-group-item {
  1939. position: relative;
  1940. display: block;
  1941. padding: 10px 15px;
  1942. margin-bottom: -1px;
  1943. background-color: #fff;
  1944. border: 1px solid #ddd;
  1945. }
  1946. .list-group .team-member {
  1947. font-size: 14px;
  1948. line-height: 32px;
  1949. color: #555;
  1950. }
  1951. .list-group img {
  1952. float: left;
  1953. width: 32px;
  1954. margin-right: 10px;
  1955. border-radius: 4px;
  1956. }
  1957. .list-group .team-member-info {
  1958. overflow: hidden;
  1959. }
  1960. .list-group .github-btn {
  1961. float: right;
  1962. width: 121px;
  1963. height: 20px;
  1964. margin-top: 6px;
  1965. }