Você não pode selecionar mais de 25 tópicos Os tópicos devem começar com uma letra ou um número, podem incluir traços ('-') e podem ter até 35 caracteres.

9287 linhas
173KB

  1. /*!
  2. * Materialize v0.99.0 (http://materializecss.com)
  3. * Copyright 2014-2017 Materialize
  4. * MIT License (https://raw.githubusercontent.com/Dogfalo/materialize/master/LICENSE)
  5. */
  6. .materialize-red {
  7. background-color: #e51c23 !important;
  8. }
  9. .materialize-red-text {
  10. color: #e51c23 !important;
  11. }
  12. .materialize-red.lighten-5 {
  13. background-color: #fdeaeb !important;
  14. }
  15. .materialize-red-text.text-lighten-5 {
  16. color: #fdeaeb !important;
  17. }
  18. .materialize-red.lighten-4 {
  19. background-color: #f8c1c3 !important;
  20. }
  21. .materialize-red-text.text-lighten-4 {
  22. color: #f8c1c3 !important;
  23. }
  24. .materialize-red.lighten-3 {
  25. background-color: #f3989b !important;
  26. }
  27. .materialize-red-text.text-lighten-3 {
  28. color: #f3989b !important;
  29. }
  30. .materialize-red.lighten-2 {
  31. background-color: #ee6e73 !important;
  32. }
  33. .materialize-red-text.text-lighten-2 {
  34. color: #ee6e73 !important;
  35. }
  36. .materialize-red.lighten-1 {
  37. background-color: #ea454b !important;
  38. }
  39. .materialize-red-text.text-lighten-1 {
  40. color: #ea454b !important;
  41. }
  42. .materialize-red.darken-1 {
  43. background-color: #d0181e !important;
  44. }
  45. .materialize-red-text.text-darken-1 {
  46. color: #d0181e !important;
  47. }
  48. .materialize-red.darken-2 {
  49. background-color: #b9151b !important;
  50. }
  51. .materialize-red-text.text-darken-2 {
  52. color: #b9151b !important;
  53. }
  54. .materialize-red.darken-3 {
  55. background-color: #a21318 !important;
  56. }
  57. .materialize-red-text.text-darken-3 {
  58. color: #a21318 !important;
  59. }
  60. .materialize-red.darken-4 {
  61. background-color: #8b1014 !important;
  62. }
  63. .materialize-red-text.text-darken-4 {
  64. color: #8b1014 !important;
  65. }
  66. .red {
  67. background-color: #F44336 !important;
  68. }
  69. .red-text {
  70. color: #F44336 !important;
  71. }
  72. .red.lighten-5 {
  73. background-color: #FFEBEE !important;
  74. }
  75. .red-text.text-lighten-5 {
  76. color: #FFEBEE !important;
  77. }
  78. .red.lighten-4 {
  79. background-color: #FFCDD2 !important;
  80. }
  81. .red-text.text-lighten-4 {
  82. color: #FFCDD2 !important;
  83. }
  84. .red.lighten-3 {
  85. background-color: #EF9A9A !important;
  86. }
  87. .red-text.text-lighten-3 {
  88. color: #EF9A9A !important;
  89. }
  90. .red.lighten-2 {
  91. background-color: #E57373 !important;
  92. }
  93. .red-text.text-lighten-2 {
  94. color: #E57373 !important;
  95. }
  96. .red.lighten-1 {
  97. background-color: #EF5350 !important;
  98. }
  99. .red-text.text-lighten-1 {
  100. color: #EF5350 !important;
  101. }
  102. .red.darken-1 {
  103. background-color: #E53935 !important;
  104. }
  105. .red-text.text-darken-1 {
  106. color: #E53935 !important;
  107. }
  108. .red.darken-2 {
  109. background-color: #D32F2F !important;
  110. }
  111. .red-text.text-darken-2 {
  112. color: #D32F2F !important;
  113. }
  114. .red.darken-3 {
  115. background-color: #C62828 !important;
  116. }
  117. .red-text.text-darken-3 {
  118. color: #C62828 !important;
  119. }
  120. .red.darken-4 {
  121. background-color: #B71C1C !important;
  122. }
  123. .red-text.text-darken-4 {
  124. color: #B71C1C !important;
  125. }
  126. .red.accent-1 {
  127. background-color: #FF8A80 !important;
  128. }
  129. .red-text.text-accent-1 {
  130. color: #FF8A80 !important;
  131. }
  132. .red.accent-2 {
  133. background-color: #FF5252 !important;
  134. }
  135. .red-text.text-accent-2 {
  136. color: #FF5252 !important;
  137. }
  138. .red.accent-3 {
  139. background-color: #FF1744 !important;
  140. }
  141. .red-text.text-accent-3 {
  142. color: #FF1744 !important;
  143. }
  144. .red.accent-4 {
  145. background-color: #D50000 !important;
  146. }
  147. .red-text.text-accent-4 {
  148. color: #D50000 !important;
  149. }
  150. .pink {
  151. background-color: #e91e63 !important;
  152. }
  153. .pink-text {
  154. color: #e91e63 !important;
  155. }
  156. .pink.lighten-5 {
  157. background-color: #fce4ec !important;
  158. }
  159. .pink-text.text-lighten-5 {
  160. color: #fce4ec !important;
  161. }
  162. .pink.lighten-4 {
  163. background-color: #f8bbd0 !important;
  164. }
  165. .pink-text.text-lighten-4 {
  166. color: #f8bbd0 !important;
  167. }
  168. .pink.lighten-3 {
  169. background-color: #f48fb1 !important;
  170. }
  171. .pink-text.text-lighten-3 {
  172. color: #f48fb1 !important;
  173. }
  174. .pink.lighten-2 {
  175. background-color: #f06292 !important;
  176. }
  177. .pink-text.text-lighten-2 {
  178. color: #f06292 !important;
  179. }
  180. .pink.lighten-1 {
  181. background-color: #ec407a !important;
  182. }
  183. .pink-text.text-lighten-1 {
  184. color: #ec407a !important;
  185. }
  186. .pink.darken-1 {
  187. background-color: #d81b60 !important;
  188. }
  189. .pink-text.text-darken-1 {
  190. color: #d81b60 !important;
  191. }
  192. .pink.darken-2 {
  193. background-color: #c2185b !important;
  194. }
  195. .pink-text.text-darken-2 {
  196. color: #c2185b !important;
  197. }
  198. .pink.darken-3 {
  199. background-color: #ad1457 !important;
  200. }
  201. .pink-text.text-darken-3 {
  202. color: #ad1457 !important;
  203. }
  204. .pink.darken-4 {
  205. background-color: #880e4f !important;
  206. }
  207. .pink-text.text-darken-4 {
  208. color: #880e4f !important;
  209. }
  210. .pink.accent-1 {
  211. background-color: #ff80ab !important;
  212. }
  213. .pink-text.text-accent-1 {
  214. color: #ff80ab !important;
  215. }
  216. .pink.accent-2 {
  217. background-color: #ff4081 !important;
  218. }
  219. .pink-text.text-accent-2 {
  220. color: #ff4081 !important;
  221. }
  222. .pink.accent-3 {
  223. background-color: #f50057 !important;
  224. }
  225. .pink-text.text-accent-3 {
  226. color: #f50057 !important;
  227. }
  228. .pink.accent-4 {
  229. background-color: #c51162 !important;
  230. }
  231. .pink-text.text-accent-4 {
  232. color: #c51162 !important;
  233. }
  234. .purple {
  235. background-color: #9c27b0 !important;
  236. }
  237. .purple-text {
  238. color: #9c27b0 !important;
  239. }
  240. .purple.lighten-5 {
  241. background-color: #f3e5f5 !important;
  242. }
  243. .purple-text.text-lighten-5 {
  244. color: #f3e5f5 !important;
  245. }
  246. .purple.lighten-4 {
  247. background-color: #e1bee7 !important;
  248. }
  249. .purple-text.text-lighten-4 {
  250. color: #e1bee7 !important;
  251. }
  252. .purple.lighten-3 {
  253. background-color: #ce93d8 !important;
  254. }
  255. .purple-text.text-lighten-3 {
  256. color: #ce93d8 !important;
  257. }
  258. .purple.lighten-2 {
  259. background-color: #ba68c8 !important;
  260. }
  261. .purple-text.text-lighten-2 {
  262. color: #ba68c8 !important;
  263. }
  264. .purple.lighten-1 {
  265. background-color: #ab47bc !important;
  266. }
  267. .purple-text.text-lighten-1 {
  268. color: #ab47bc !important;
  269. }
  270. .purple.darken-1 {
  271. background-color: #8e24aa !important;
  272. }
  273. .purple-text.text-darken-1 {
  274. color: #8e24aa !important;
  275. }
  276. .purple.darken-2 {
  277. background-color: #7b1fa2 !important;
  278. }
  279. .purple-text.text-darken-2 {
  280. color: #7b1fa2 !important;
  281. }
  282. .purple.darken-3 {
  283. background-color: #6a1b9a !important;
  284. }
  285. .purple-text.text-darken-3 {
  286. color: #6a1b9a !important;
  287. }
  288. .purple.darken-4 {
  289. background-color: #4a148c !important;
  290. }
  291. .purple-text.text-darken-4 {
  292. color: #4a148c !important;
  293. }
  294. .purple.accent-1 {
  295. background-color: #ea80fc !important;
  296. }
  297. .purple-text.text-accent-1 {
  298. color: #ea80fc !important;
  299. }
  300. .purple.accent-2 {
  301. background-color: #e040fb !important;
  302. }
  303. .purple-text.text-accent-2 {
  304. color: #e040fb !important;
  305. }
  306. .purple.accent-3 {
  307. background-color: #d500f9 !important;
  308. }
  309. .purple-text.text-accent-3 {
  310. color: #d500f9 !important;
  311. }
  312. .purple.accent-4 {
  313. background-color: #aa00ff !important;
  314. }
  315. .purple-text.text-accent-4 {
  316. color: #aa00ff !important;
  317. }
  318. .deep-purple {
  319. background-color: #673ab7 !important;
  320. }
  321. .deep-purple-text {
  322. color: #673ab7 !important;
  323. }
  324. .deep-purple.lighten-5 {
  325. background-color: #ede7f6 !important;
  326. }
  327. .deep-purple-text.text-lighten-5 {
  328. color: #ede7f6 !important;
  329. }
  330. .deep-purple.lighten-4 {
  331. background-color: #d1c4e9 !important;
  332. }
  333. .deep-purple-text.text-lighten-4 {
  334. color: #d1c4e9 !important;
  335. }
  336. .deep-purple.lighten-3 {
  337. background-color: #b39ddb !important;
  338. }
  339. .deep-purple-text.text-lighten-3 {
  340. color: #b39ddb !important;
  341. }
  342. .deep-purple.lighten-2 {
  343. background-color: #9575cd !important;
  344. }
  345. .deep-purple-text.text-lighten-2 {
  346. color: #9575cd !important;
  347. }
  348. .deep-purple.lighten-1 {
  349. background-color: #7e57c2 !important;
  350. }
  351. .deep-purple-text.text-lighten-1 {
  352. color: #7e57c2 !important;
  353. }
  354. .deep-purple.darken-1 {
  355. background-color: #5e35b1 !important;
  356. }
  357. .deep-purple-text.text-darken-1 {
  358. color: #5e35b1 !important;
  359. }
  360. .deep-purple.darken-2 {
  361. background-color: #512da8 !important;
  362. }
  363. .deep-purple-text.text-darken-2 {
  364. color: #512da8 !important;
  365. }
  366. .deep-purple.darken-3 {
  367. background-color: #4527a0 !important;
  368. }
  369. .deep-purple-text.text-darken-3 {
  370. color: #4527a0 !important;
  371. }
  372. .deep-purple.darken-4 {
  373. background-color: #311b92 !important;
  374. }
  375. .deep-purple-text.text-darken-4 {
  376. color: #311b92 !important;
  377. }
  378. .deep-purple.accent-1 {
  379. background-color: #b388ff !important;
  380. }
  381. .deep-purple-text.text-accent-1 {
  382. color: #b388ff !important;
  383. }
  384. .deep-purple.accent-2 {
  385. background-color: #7c4dff !important;
  386. }
  387. .deep-purple-text.text-accent-2 {
  388. color: #7c4dff !important;
  389. }
  390. .deep-purple.accent-3 {
  391. background-color: #651fff !important;
  392. }
  393. .deep-purple-text.text-accent-3 {
  394. color: #651fff !important;
  395. }
  396. .deep-purple.accent-4 {
  397. background-color: #6200ea !important;
  398. }
  399. .deep-purple-text.text-accent-4 {
  400. color: #6200ea !important;
  401. }
  402. .indigo {
  403. background-color: #3f51b5 !important;
  404. }
  405. .indigo-text {
  406. color: #3f51b5 !important;
  407. }
  408. .indigo.lighten-5 {
  409. background-color: #e8eaf6 !important;
  410. }
  411. .indigo-text.text-lighten-5 {
  412. color: #e8eaf6 !important;
  413. }
  414. .indigo.lighten-4 {
  415. background-color: #c5cae9 !important;
  416. }
  417. .indigo-text.text-lighten-4 {
  418. color: #c5cae9 !important;
  419. }
  420. .indigo.lighten-3 {
  421. background-color: #9fa8da !important;
  422. }
  423. .indigo-text.text-lighten-3 {
  424. color: #9fa8da !important;
  425. }
  426. .indigo.lighten-2 {
  427. background-color: #7986cb !important;
  428. }
  429. .indigo-text.text-lighten-2 {
  430. color: #7986cb !important;
  431. }
  432. .indigo.lighten-1 {
  433. background-color: #5c6bc0 !important;
  434. }
  435. .indigo-text.text-lighten-1 {
  436. color: #5c6bc0 !important;
  437. }
  438. .indigo.darken-1 {
  439. background-color: #3949ab !important;
  440. }
  441. .indigo-text.text-darken-1 {
  442. color: #3949ab !important;
  443. }
  444. .indigo.darken-2 {
  445. background-color: #303f9f !important;
  446. }
  447. .indigo-text.text-darken-2 {
  448. color: #303f9f !important;
  449. }
  450. .indigo.darken-3 {
  451. background-color: #283593 !important;
  452. }
  453. .indigo-text.text-darken-3 {
  454. color: #283593 !important;
  455. }
  456. .indigo.darken-4 {
  457. background-color: #1a237e !important;
  458. }
  459. .indigo-text.text-darken-4 {
  460. color: #1a237e !important;
  461. }
  462. .indigo.accent-1 {
  463. background-color: #8c9eff !important;
  464. }
  465. .indigo-text.text-accent-1 {
  466. color: #8c9eff !important;
  467. }
  468. .indigo.accent-2 {
  469. background-color: #536dfe !important;
  470. }
  471. .indigo-text.text-accent-2 {
  472. color: #536dfe !important;
  473. }
  474. .indigo.accent-3 {
  475. background-color: #3d5afe !important;
  476. }
  477. .indigo-text.text-accent-3 {
  478. color: #3d5afe !important;
  479. }
  480. .indigo.accent-4 {
  481. background-color: #304ffe !important;
  482. }
  483. .indigo-text.text-accent-4 {
  484. color: #304ffe !important;
  485. }
  486. .blue {
  487. background-color: #2196F3 !important;
  488. }
  489. .blue-text {
  490. color: #2196F3 !important;
  491. }
  492. .blue.lighten-5 {
  493. background-color: #E3F2FD !important;
  494. }
  495. .blue-text.text-lighten-5 {
  496. color: #E3F2FD !important;
  497. }
  498. .blue.lighten-4 {
  499. background-color: #BBDEFB !important;
  500. }
  501. .blue-text.text-lighten-4 {
  502. color: #BBDEFB !important;
  503. }
  504. .blue.lighten-3 {
  505. background-color: #90CAF9 !important;
  506. }
  507. .blue-text.text-lighten-3 {
  508. color: #90CAF9 !important;
  509. }
  510. .blue.lighten-2 {
  511. background-color: #64B5F6 !important;
  512. }
  513. .blue-text.text-lighten-2 {
  514. color: #64B5F6 !important;
  515. }
  516. .blue.lighten-1 {
  517. background-color: #42A5F5 !important;
  518. }
  519. .blue-text.text-lighten-1 {
  520. color: #42A5F5 !important;
  521. }
  522. .blue.darken-1 {
  523. background-color: #1E88E5 !important;
  524. }
  525. .blue-text.text-darken-1 {
  526. color: #1E88E5 !important;
  527. }
  528. .blue.darken-2 {
  529. background-color: #1976D2 !important;
  530. }
  531. .blue-text.text-darken-2 {
  532. color: #1976D2 !important;
  533. }
  534. .blue.darken-3 {
  535. background-color: #1565C0 !important;
  536. }
  537. .blue-text.text-darken-3 {
  538. color: #1565C0 !important;
  539. }
  540. .blue.darken-4 {
  541. background-color: #0D47A1 !important;
  542. }
  543. .blue-text.text-darken-4 {
  544. color: #0D47A1 !important;
  545. }
  546. .blue.accent-1 {
  547. background-color: #82B1FF !important;
  548. }
  549. .blue-text.text-accent-1 {
  550. color: #82B1FF !important;
  551. }
  552. .blue.accent-2 {
  553. background-color: #448AFF !important;
  554. }
  555. .blue-text.text-accent-2 {
  556. color: #448AFF !important;
  557. }
  558. .blue.accent-3 {
  559. background-color: #2979FF !important;
  560. }
  561. .blue-text.text-accent-3 {
  562. color: #2979FF !important;
  563. }
  564. .blue.accent-4 {
  565. background-color: #2962FF !important;
  566. }
  567. .blue-text.text-accent-4 {
  568. color: #2962FF !important;
  569. }
  570. .light-blue {
  571. background-color: #03a9f4 !important;
  572. }
  573. .light-blue-text {
  574. color: #03a9f4 !important;
  575. }
  576. .light-blue.lighten-5 {
  577. background-color: #e1f5fe !important;
  578. }
  579. .light-blue-text.text-lighten-5 {
  580. color: #e1f5fe !important;
  581. }
  582. .light-blue.lighten-4 {
  583. background-color: #b3e5fc !important;
  584. }
  585. .light-blue-text.text-lighten-4 {
  586. color: #b3e5fc !important;
  587. }
  588. .light-blue.lighten-3 {
  589. background-color: #81d4fa !important;
  590. }
  591. .light-blue-text.text-lighten-3 {
  592. color: #81d4fa !important;
  593. }
  594. .light-blue.lighten-2 {
  595. background-color: #4fc3f7 !important;
  596. }
  597. .light-blue-text.text-lighten-2 {
  598. color: #4fc3f7 !important;
  599. }
  600. .light-blue.lighten-1 {
  601. background-color: #29b6f6 !important;
  602. }
  603. .light-blue-text.text-lighten-1 {
  604. color: #29b6f6 !important;
  605. }
  606. .light-blue.darken-1 {
  607. background-color: #039be5 !important;
  608. }
  609. .light-blue-text.text-darken-1 {
  610. color: #039be5 !important;
  611. }
  612. .light-blue.darken-2 {
  613. background-color: #0288d1 !important;
  614. }
  615. .light-blue-text.text-darken-2 {
  616. color: #0288d1 !important;
  617. }
  618. .light-blue.darken-3 {
  619. background-color: #0277bd !important;
  620. }
  621. .light-blue-text.text-darken-3 {
  622. color: #0277bd !important;
  623. }
  624. .light-blue.darken-4 {
  625. background-color: #01579b !important;
  626. }
  627. .light-blue-text.text-darken-4 {
  628. color: #01579b !important;
  629. }
  630. .light-blue.accent-1 {
  631. background-color: #80d8ff !important;
  632. }
  633. .light-blue-text.text-accent-1 {
  634. color: #80d8ff !important;
  635. }
  636. .light-blue.accent-2 {
  637. background-color: #40c4ff !important;
  638. }
  639. .light-blue-text.text-accent-2 {
  640. color: #40c4ff !important;
  641. }
  642. .light-blue.accent-3 {
  643. background-color: #00b0ff !important;
  644. }
  645. .light-blue-text.text-accent-3 {
  646. color: #00b0ff !important;
  647. }
  648. .light-blue.accent-4 {
  649. background-color: #0091ea !important;
  650. }
  651. .light-blue-text.text-accent-4 {
  652. color: #0091ea !important;
  653. }
  654. .cyan {
  655. background-color: #00bcd4 !important;
  656. }
  657. .cyan-text {
  658. color: #00bcd4 !important;
  659. }
  660. .cyan.lighten-5 {
  661. background-color: #e0f7fa !important;
  662. }
  663. .cyan-text.text-lighten-5 {
  664. color: #e0f7fa !important;
  665. }
  666. .cyan.lighten-4 {
  667. background-color: #b2ebf2 !important;
  668. }
  669. .cyan-text.text-lighten-4 {
  670. color: #b2ebf2 !important;
  671. }
  672. .cyan.lighten-3 {
  673. background-color: #80deea !important;
  674. }
  675. .cyan-text.text-lighten-3 {
  676. color: #80deea !important;
  677. }
  678. .cyan.lighten-2 {
  679. background-color: #4dd0e1 !important;
  680. }
  681. .cyan-text.text-lighten-2 {
  682. color: #4dd0e1 !important;
  683. }
  684. .cyan.lighten-1 {
  685. background-color: #26c6da !important;
  686. }
  687. .cyan-text.text-lighten-1 {
  688. color: #26c6da !important;
  689. }
  690. .cyan.darken-1 {
  691. background-color: #00acc1 !important;
  692. }
  693. .cyan-text.text-darken-1 {
  694. color: #00acc1 !important;
  695. }
  696. .cyan.darken-2 {
  697. background-color: #0097a7 !important;
  698. }
  699. .cyan-text.text-darken-2 {
  700. color: #0097a7 !important;
  701. }
  702. .cyan.darken-3 {
  703. background-color: #00838f !important;
  704. }
  705. .cyan-text.text-darken-3 {
  706. color: #00838f !important;
  707. }
  708. .cyan.darken-4 {
  709. background-color: #006064 !important;
  710. }
  711. .cyan-text.text-darken-4 {
  712. color: #006064 !important;
  713. }
  714. .cyan.accent-1 {
  715. background-color: #84ffff !important;
  716. }
  717. .cyan-text.text-accent-1 {
  718. color: #84ffff !important;
  719. }
  720. .cyan.accent-2 {
  721. background-color: #18ffff !important;
  722. }
  723. .cyan-text.text-accent-2 {
  724. color: #18ffff !important;
  725. }
  726. .cyan.accent-3 {
  727. background-color: #00e5ff !important;
  728. }
  729. .cyan-text.text-accent-3 {
  730. color: #00e5ff !important;
  731. }
  732. .cyan.accent-4 {
  733. background-color: #00b8d4 !important;
  734. }
  735. .cyan-text.text-accent-4 {
  736. color: #00b8d4 !important;
  737. }
  738. .teal {
  739. background-color: #009688 !important;
  740. }
  741. .teal-text {
  742. color: #009688 !important;
  743. }
  744. .teal.lighten-5 {
  745. background-color: #e0f2f1 !important;
  746. }
  747. .teal-text.text-lighten-5 {
  748. color: #e0f2f1 !important;
  749. }
  750. .teal.lighten-4 {
  751. background-color: #b2dfdb !important;
  752. }
  753. .teal-text.text-lighten-4 {
  754. color: #b2dfdb !important;
  755. }
  756. .teal.lighten-3 {
  757. background-color: #80cbc4 !important;
  758. }
  759. .teal-text.text-lighten-3 {
  760. color: #80cbc4 !important;
  761. }
  762. .teal.lighten-2 {
  763. background-color: #4db6ac !important;
  764. }
  765. .teal-text.text-lighten-2 {
  766. color: #4db6ac !important;
  767. }
  768. .teal.lighten-1 {
  769. background-color: #26a69a !important;
  770. }
  771. .teal-text.text-lighten-1 {
  772. color: #26a69a !important;
  773. }
  774. .teal.darken-1 {
  775. background-color: #00897b !important;
  776. }
  777. .teal-text.text-darken-1 {
  778. color: #00897b !important;
  779. }
  780. .teal.darken-2 {
  781. background-color: #00796b !important;
  782. }
  783. .teal-text.text-darken-2 {
  784. color: #00796b !important;
  785. }
  786. .teal.darken-3 {
  787. background-color: #00695c !important;
  788. }
  789. .teal-text.text-darken-3 {
  790. color: #00695c !important;
  791. }
  792. .teal.darken-4 {
  793. background-color: #004d40 !important;
  794. }
  795. .teal-text.text-darken-4 {
  796. color: #004d40 !important;
  797. }
  798. .teal.accent-1 {
  799. background-color: #a7ffeb !important;
  800. }
  801. .teal-text.text-accent-1 {
  802. color: #a7ffeb !important;
  803. }
  804. .teal.accent-2 {
  805. background-color: #64ffda !important;
  806. }
  807. .teal-text.text-accent-2 {
  808. color: #64ffda !important;
  809. }
  810. .teal.accent-3 {
  811. background-color: #1de9b6 !important;
  812. }
  813. .teal-text.text-accent-3 {
  814. color: #1de9b6 !important;
  815. }
  816. .teal.accent-4 {
  817. background-color: #00bfa5 !important;
  818. }
  819. .teal-text.text-accent-4 {
  820. color: #00bfa5 !important;
  821. }
  822. .green {
  823. background-color: #4CAF50 !important;
  824. }
  825. .green-text {
  826. color: #4CAF50 !important;
  827. }
  828. .green.lighten-5 {
  829. background-color: #E8F5E9 !important;
  830. }
  831. .green-text.text-lighten-5 {
  832. color: #E8F5E9 !important;
  833. }
  834. .green.lighten-4 {
  835. background-color: #C8E6C9 !important;
  836. }
  837. .green-text.text-lighten-4 {
  838. color: #C8E6C9 !important;
  839. }
  840. .green.lighten-3 {
  841. background-color: #A5D6A7 !important;
  842. }
  843. .green-text.text-lighten-3 {
  844. color: #A5D6A7 !important;
  845. }
  846. .green.lighten-2 {
  847. background-color: #81C784 !important;
  848. }
  849. .green-text.text-lighten-2 {
  850. color: #81C784 !important;
  851. }
  852. .green.lighten-1 {
  853. background-color: #66BB6A !important;
  854. }
  855. .green-text.text-lighten-1 {
  856. color: #66BB6A !important;
  857. }
  858. .green.darken-1 {
  859. background-color: #43A047 !important;
  860. }
  861. .green-text.text-darken-1 {
  862. color: #43A047 !important;
  863. }
  864. .green.darken-2 {
  865. background-color: #388E3C !important;
  866. }
  867. .green-text.text-darken-2 {
  868. color: #388E3C !important;
  869. }
  870. .green.darken-3 {
  871. background-color: #2E7D32 !important;
  872. }
  873. .green-text.text-darken-3 {
  874. color: #2E7D32 !important;
  875. }
  876. .green.darken-4 {
  877. background-color: #1B5E20 !important;
  878. }
  879. .green-text.text-darken-4 {
  880. color: #1B5E20 !important;
  881. }
  882. .green.accent-1 {
  883. background-color: #B9F6CA !important;
  884. }
  885. .green-text.text-accent-1 {
  886. color: #B9F6CA !important;
  887. }
  888. .green.accent-2 {
  889. background-color: #69F0AE !important;
  890. }
  891. .green-text.text-accent-2 {
  892. color: #69F0AE !important;
  893. }
  894. .green.accent-3 {
  895. background-color: #00E676 !important;
  896. }
  897. .green-text.text-accent-3 {
  898. color: #00E676 !important;
  899. }
  900. .green.accent-4 {
  901. background-color: #00C853 !important;
  902. }
  903. .green-text.text-accent-4 {
  904. color: #00C853 !important;
  905. }
  906. .light-green {
  907. background-color: #8bc34a !important;
  908. }
  909. .light-green-text {
  910. color: #8bc34a !important;
  911. }
  912. .light-green.lighten-5 {
  913. background-color: #f1f8e9 !important;
  914. }
  915. .light-green-text.text-lighten-5 {
  916. color: #f1f8e9 !important;
  917. }
  918. .light-green.lighten-4 {
  919. background-color: #dcedc8 !important;
  920. }
  921. .light-green-text.text-lighten-4 {
  922. color: #dcedc8 !important;
  923. }
  924. .light-green.lighten-3 {
  925. background-color: #c5e1a5 !important;
  926. }
  927. .light-green-text.text-lighten-3 {
  928. color: #c5e1a5 !important;
  929. }
  930. .light-green.lighten-2 {
  931. background-color: #aed581 !important;
  932. }
  933. .light-green-text.text-lighten-2 {
  934. color: #aed581 !important;
  935. }
  936. .light-green.lighten-1 {
  937. background-color: #9ccc65 !important;
  938. }
  939. .light-green-text.text-lighten-1 {
  940. color: #9ccc65 !important;
  941. }
  942. .light-green.darken-1 {
  943. background-color: #7cb342 !important;
  944. }
  945. .light-green-text.text-darken-1 {
  946. color: #7cb342 !important;
  947. }
  948. .light-green.darken-2 {
  949. background-color: #689f38 !important;
  950. }
  951. .light-green-text.text-darken-2 {
  952. color: #689f38 !important;
  953. }
  954. .light-green.darken-3 {
  955. background-color: #558b2f !important;
  956. }
  957. .light-green-text.text-darken-3 {
  958. color: #558b2f !important;
  959. }
  960. .light-green.darken-4 {
  961. background-color: #33691e !important;
  962. }
  963. .light-green-text.text-darken-4 {
  964. color: #33691e !important;
  965. }
  966. .light-green.accent-1 {
  967. background-color: #ccff90 !important;
  968. }
  969. .light-green-text.text-accent-1 {
  970. color: #ccff90 !important;
  971. }
  972. .light-green.accent-2 {
  973. background-color: #b2ff59 !important;
  974. }
  975. .light-green-text.text-accent-2 {
  976. color: #b2ff59 !important;
  977. }
  978. .light-green.accent-3 {
  979. background-color: #76ff03 !important;
  980. }
  981. .light-green-text.text-accent-3 {
  982. color: #76ff03 !important;
  983. }
  984. .light-green.accent-4 {
  985. background-color: #64dd17 !important;
  986. }
  987. .light-green-text.text-accent-4 {
  988. color: #64dd17 !important;
  989. }
  990. .lime {
  991. background-color: #cddc39 !important;
  992. }
  993. .lime-text {
  994. color: #cddc39 !important;
  995. }
  996. .lime.lighten-5 {
  997. background-color: #f9fbe7 !important;
  998. }
  999. .lime-text.text-lighten-5 {
  1000. color: #f9fbe7 !important;
  1001. }
  1002. .lime.lighten-4 {
  1003. background-color: #f0f4c3 !important;
  1004. }
  1005. .lime-text.text-lighten-4 {
  1006. color: #f0f4c3 !important;
  1007. }
  1008. .lime.lighten-3 {
  1009. background-color: #e6ee9c !important;
  1010. }
  1011. .lime-text.text-lighten-3 {
  1012. color: #e6ee9c !important;
  1013. }
  1014. .lime.lighten-2 {
  1015. background-color: #dce775 !important;
  1016. }
  1017. .lime-text.text-lighten-2 {
  1018. color: #dce775 !important;
  1019. }
  1020. .lime.lighten-1 {
  1021. background-color: #d4e157 !important;
  1022. }
  1023. .lime-text.text-lighten-1 {
  1024. color: #d4e157 !important;
  1025. }
  1026. .lime.darken-1 {
  1027. background-color: #c0ca33 !important;
  1028. }
  1029. .lime-text.text-darken-1 {
  1030. color: #c0ca33 !important;
  1031. }
  1032. .lime.darken-2 {
  1033. background-color: #afb42b !important;
  1034. }
  1035. .lime-text.text-darken-2 {
  1036. color: #afb42b !important;
  1037. }
  1038. .lime.darken-3 {
  1039. background-color: #9e9d24 !important;
  1040. }
  1041. .lime-text.text-darken-3 {
  1042. color: #9e9d24 !important;
  1043. }
  1044. .lime.darken-4 {
  1045. background-color: #827717 !important;
  1046. }
  1047. .lime-text.text-darken-4 {
  1048. color: #827717 !important;
  1049. }
  1050. .lime.accent-1 {
  1051. background-color: #f4ff81 !important;
  1052. }
  1053. .lime-text.text-accent-1 {
  1054. color: #f4ff81 !important;
  1055. }
  1056. .lime.accent-2 {
  1057. background-color: #eeff41 !important;
  1058. }
  1059. .lime-text.text-accent-2 {
  1060. color: #eeff41 !important;
  1061. }
  1062. .lime.accent-3 {
  1063. background-color: #c6ff00 !important;
  1064. }
  1065. .lime-text.text-accent-3 {
  1066. color: #c6ff00 !important;
  1067. }
  1068. .lime.accent-4 {
  1069. background-color: #aeea00 !important;
  1070. }
  1071. .lime-text.text-accent-4 {
  1072. color: #aeea00 !important;
  1073. }
  1074. .yellow {
  1075. background-color: #ffeb3b !important;
  1076. }
  1077. .yellow-text {
  1078. color: #ffeb3b !important;
  1079. }
  1080. .yellow.lighten-5 {
  1081. background-color: #fffde7 !important;
  1082. }
  1083. .yellow-text.text-lighten-5 {
  1084. color: #fffde7 !important;
  1085. }
  1086. .yellow.lighten-4 {
  1087. background-color: #fff9c4 !important;
  1088. }
  1089. .yellow-text.text-lighten-4 {
  1090. color: #fff9c4 !important;
  1091. }
  1092. .yellow.lighten-3 {
  1093. background-color: #fff59d !important;
  1094. }
  1095. .yellow-text.text-lighten-3 {
  1096. color: #fff59d !important;
  1097. }
  1098. .yellow.lighten-2 {
  1099. background-color: #fff176 !important;
  1100. }
  1101. .yellow-text.text-lighten-2 {
  1102. color: #fff176 !important;
  1103. }
  1104. .yellow.lighten-1 {
  1105. background-color: #ffee58 !important;
  1106. }
  1107. .yellow-text.text-lighten-1 {
  1108. color: #ffee58 !important;
  1109. }
  1110. .yellow.darken-1 {
  1111. background-color: #fdd835 !important;
  1112. }
  1113. .yellow-text.text-darken-1 {
  1114. color: #fdd835 !important;
  1115. }
  1116. .yellow.darken-2 {
  1117. background-color: #fbc02d !important;
  1118. }
  1119. .yellow-text.text-darken-2 {
  1120. color: #fbc02d !important;
  1121. }
  1122. .yellow.darken-3 {
  1123. background-color: #f9a825 !important;
  1124. }
  1125. .yellow-text.text-darken-3 {
  1126. color: #f9a825 !important;
  1127. }
  1128. .yellow.darken-4 {
  1129. background-color: #f57f17 !important;
  1130. }
  1131. .yellow-text.text-darken-4 {
  1132. color: #f57f17 !important;
  1133. }
  1134. .yellow.accent-1 {
  1135. background-color: #ffff8d !important;
  1136. }
  1137. .yellow-text.text-accent-1 {
  1138. color: #ffff8d !important;
  1139. }
  1140. .yellow.accent-2 {
  1141. background-color: #ffff00 !important;
  1142. }
  1143. .yellow-text.text-accent-2 {
  1144. color: #ffff00 !important;
  1145. }
  1146. .yellow.accent-3 {
  1147. background-color: #ffea00 !important;
  1148. }
  1149. .yellow-text.text-accent-3 {
  1150. color: #ffea00 !important;
  1151. }
  1152. .yellow.accent-4 {
  1153. background-color: #ffd600 !important;
  1154. }
  1155. .yellow-text.text-accent-4 {
  1156. color: #ffd600 !important;
  1157. }
  1158. .amber {
  1159. background-color: #ffc107 !important;
  1160. }
  1161. .amber-text {
  1162. color: #ffc107 !important;
  1163. }
  1164. .amber.lighten-5 {
  1165. background-color: #fff8e1 !important;
  1166. }
  1167. .amber-text.text-lighten-5 {
  1168. color: #fff8e1 !important;
  1169. }
  1170. .amber.lighten-4 {
  1171. background-color: #ffecb3 !important;
  1172. }
  1173. .amber-text.text-lighten-4 {
  1174. color: #ffecb3 !important;
  1175. }
  1176. .amber.lighten-3 {
  1177. background-color: #ffe082 !important;
  1178. }
  1179. .amber-text.text-lighten-3 {
  1180. color: #ffe082 !important;
  1181. }
  1182. .amber.lighten-2 {
  1183. background-color: #ffd54f !important;
  1184. }
  1185. .amber-text.text-lighten-2 {
  1186. color: #ffd54f !important;
  1187. }
  1188. .amber.lighten-1 {
  1189. background-color: #ffca28 !important;
  1190. }
  1191. .amber-text.text-lighten-1 {
  1192. color: #ffca28 !important;
  1193. }
  1194. .amber.darken-1 {
  1195. background-color: #ffb300 !important;
  1196. }
  1197. .amber-text.text-darken-1 {
  1198. color: #ffb300 !important;
  1199. }
  1200. .amber.darken-2 {
  1201. background-color: #ffa000 !important;
  1202. }
  1203. .amber-text.text-darken-2 {
  1204. color: #ffa000 !important;
  1205. }
  1206. .amber.darken-3 {
  1207. background-color: #ff8f00 !important;
  1208. }
  1209. .amber-text.text-darken-3 {
  1210. color: #ff8f00 !important;
  1211. }
  1212. .amber.darken-4 {
  1213. background-color: #ff6f00 !important;
  1214. }
  1215. .amber-text.text-darken-4 {
  1216. color: #ff6f00 !important;
  1217. }
  1218. .amber.accent-1 {
  1219. background-color: #ffe57f !important;
  1220. }
  1221. .amber-text.text-accent-1 {
  1222. color: #ffe57f !important;
  1223. }
  1224. .amber.accent-2 {
  1225. background-color: #ffd740 !important;
  1226. }
  1227. .amber-text.text-accent-2 {
  1228. color: #ffd740 !important;
  1229. }
  1230. .amber.accent-3 {
  1231. background-color: #ffc400 !important;
  1232. }
  1233. .amber-text.text-accent-3 {
  1234. color: #ffc400 !important;
  1235. }
  1236. .amber.accent-4 {
  1237. background-color: #ffab00 !important;
  1238. }
  1239. .amber-text.text-accent-4 {
  1240. color: #ffab00 !important;
  1241. }
  1242. .orange {
  1243. background-color: #ff9800 !important;
  1244. }
  1245. .orange-text {
  1246. color: #ff9800 !important;
  1247. }
  1248. .orange.lighten-5 {
  1249. background-color: #fff3e0 !important;
  1250. }
  1251. .orange-text.text-lighten-5 {
  1252. color: #fff3e0 !important;
  1253. }
  1254. .orange.lighten-4 {
  1255. background-color: #ffe0b2 !important;
  1256. }
  1257. .orange-text.text-lighten-4 {
  1258. color: #ffe0b2 !important;
  1259. }
  1260. .orange.lighten-3 {
  1261. background-color: #ffcc80 !important;
  1262. }
  1263. .orange-text.text-lighten-3 {
  1264. color: #ffcc80 !important;
  1265. }
  1266. .orange.lighten-2 {
  1267. background-color: #ffb74d !important;
  1268. }
  1269. .orange-text.text-lighten-2 {
  1270. color: #ffb74d !important;
  1271. }
  1272. .orange.lighten-1 {
  1273. background-color: #ffa726 !important;
  1274. }
  1275. .orange-text.text-lighten-1 {
  1276. color: #ffa726 !important;
  1277. }
  1278. .orange.darken-1 {
  1279. background-color: #fb8c00 !important;
  1280. }
  1281. .orange-text.text-darken-1 {
  1282. color: #fb8c00 !important;
  1283. }
  1284. .orange.darken-2 {
  1285. background-color: #f57c00 !important;
  1286. }
  1287. .orange-text.text-darken-2 {
  1288. color: #f57c00 !important;
  1289. }
  1290. .orange.darken-3 {
  1291. background-color: #ef6c00 !important;
  1292. }
  1293. .orange-text.text-darken-3 {
  1294. color: #ef6c00 !important;
  1295. }
  1296. .orange.darken-4 {
  1297. background-color: #e65100 !important;
  1298. }
  1299. .orange-text.text-darken-4 {
  1300. color: #e65100 !important;
  1301. }
  1302. .orange.accent-1 {
  1303. background-color: #ffd180 !important;
  1304. }
  1305. .orange-text.text-accent-1 {
  1306. color: #ffd180 !important;
  1307. }
  1308. .orange.accent-2 {
  1309. background-color: #ffab40 !important;
  1310. }
  1311. .orange-text.text-accent-2 {
  1312. color: #ffab40 !important;
  1313. }
  1314. .orange.accent-3 {
  1315. background-color: #ff9100 !important;
  1316. }
  1317. .orange-text.text-accent-3 {
  1318. color: #ff9100 !important;
  1319. }
  1320. .orange.accent-4 {
  1321. background-color: #ff6d00 !important;
  1322. }
  1323. .orange-text.text-accent-4 {
  1324. color: #ff6d00 !important;
  1325. }
  1326. .deep-orange {
  1327. background-color: #ff5722 !important;
  1328. }
  1329. .deep-orange-text {
  1330. color: #ff5722 !important;
  1331. }
  1332. .deep-orange.lighten-5 {
  1333. background-color: #fbe9e7 !important;
  1334. }
  1335. .deep-orange-text.text-lighten-5 {
  1336. color: #fbe9e7 !important;
  1337. }
  1338. .deep-orange.lighten-4 {
  1339. background-color: #ffccbc !important;
  1340. }
  1341. .deep-orange-text.text-lighten-4 {
  1342. color: #ffccbc !important;
  1343. }
  1344. .deep-orange.lighten-3 {
  1345. background-color: #ffab91 !important;
  1346. }
  1347. .deep-orange-text.text-lighten-3 {
  1348. color: #ffab91 !important;
  1349. }
  1350. .deep-orange.lighten-2 {
  1351. background-color: #ff8a65 !important;
  1352. }
  1353. .deep-orange-text.text-lighten-2 {
  1354. color: #ff8a65 !important;
  1355. }
  1356. .deep-orange.lighten-1 {
  1357. background-color: #ff7043 !important;
  1358. }
  1359. .deep-orange-text.text-lighten-1 {
  1360. color: #ff7043 !important;
  1361. }
  1362. .deep-orange.darken-1 {
  1363. background-color: #f4511e !important;
  1364. }
  1365. .deep-orange-text.text-darken-1 {
  1366. color: #f4511e !important;
  1367. }
  1368. .deep-orange.darken-2 {
  1369. background-color: #e64a19 !important;
  1370. }
  1371. .deep-orange-text.text-darken-2 {
  1372. color: #e64a19 !important;
  1373. }
  1374. .deep-orange.darken-3 {
  1375. background-color: #d84315 !important;
  1376. }
  1377. .deep-orange-text.text-darken-3 {
  1378. color: #d84315 !important;
  1379. }
  1380. .deep-orange.darken-4 {
  1381. background-color: #bf360c !important;
  1382. }
  1383. .deep-orange-text.text-darken-4 {
  1384. color: #bf360c !important;
  1385. }
  1386. .deep-orange.accent-1 {
  1387. background-color: #ff9e80 !important;
  1388. }
  1389. .deep-orange-text.text-accent-1 {
  1390. color: #ff9e80 !important;
  1391. }
  1392. .deep-orange.accent-2 {
  1393. background-color: #ff6e40 !important;
  1394. }
  1395. .deep-orange-text.text-accent-2 {
  1396. color: #ff6e40 !important;
  1397. }
  1398. .deep-orange.accent-3 {
  1399. background-color: #ff3d00 !important;
  1400. }
  1401. .deep-orange-text.text-accent-3 {
  1402. color: #ff3d00 !important;
  1403. }
  1404. .deep-orange.accent-4 {
  1405. background-color: #dd2c00 !important;
  1406. }
  1407. .deep-orange-text.text-accent-4 {
  1408. color: #dd2c00 !important;
  1409. }
  1410. .brown {
  1411. background-color: #795548 !important;
  1412. }
  1413. .brown-text {
  1414. color: #795548 !important;
  1415. }
  1416. .brown.lighten-5 {
  1417. background-color: #efebe9 !important;
  1418. }
  1419. .brown-text.text-lighten-5 {
  1420. color: #efebe9 !important;
  1421. }
  1422. .brown.lighten-4 {
  1423. background-color: #d7ccc8 !important;
  1424. }
  1425. .brown-text.text-lighten-4 {
  1426. color: #d7ccc8 !important;
  1427. }
  1428. .brown.lighten-3 {
  1429. background-color: #bcaaa4 !important;
  1430. }
  1431. .brown-text.text-lighten-3 {
  1432. color: #bcaaa4 !important;
  1433. }
  1434. .brown.lighten-2 {
  1435. background-color: #a1887f !important;
  1436. }
  1437. .brown-text.text-lighten-2 {
  1438. color: #a1887f !important;
  1439. }
  1440. .brown.lighten-1 {
  1441. background-color: #8d6e63 !important;
  1442. }
  1443. .brown-text.text-lighten-1 {
  1444. color: #8d6e63 !important;
  1445. }
  1446. .brown.darken-1 {
  1447. background-color: #6d4c41 !important;
  1448. }
  1449. .brown-text.text-darken-1 {
  1450. color: #6d4c41 !important;
  1451. }
  1452. .brown.darken-2 {
  1453. background-color: #5d4037 !important;
  1454. }
  1455. .brown-text.text-darken-2 {
  1456. color: #5d4037 !important;
  1457. }
  1458. .brown.darken-3 {
  1459. background-color: #4e342e !important;
  1460. }
  1461. .brown-text.text-darken-3 {
  1462. color: #4e342e !important;
  1463. }
  1464. .brown.darken-4 {
  1465. background-color: #3e2723 !important;
  1466. }
  1467. .brown-text.text-darken-4 {
  1468. color: #3e2723 !important;
  1469. }
  1470. .blue-grey {
  1471. background-color: #607d8b !important;
  1472. }
  1473. .blue-grey-text {
  1474. color: #607d8b !important;
  1475. }
  1476. .blue-grey.lighten-5 {
  1477. background-color: #eceff1 !important;
  1478. }
  1479. .blue-grey-text.text-lighten-5 {
  1480. color: #eceff1 !important;
  1481. }
  1482. .blue-grey.lighten-4 {
  1483. background-color: #cfd8dc !important;
  1484. }
  1485. .blue-grey-text.text-lighten-4 {
  1486. color: #cfd8dc !important;
  1487. }
  1488. .blue-grey.lighten-3 {
  1489. background-color: #b0bec5 !important;
  1490. }
  1491. .blue-grey-text.text-lighten-3 {
  1492. color: #b0bec5 !important;
  1493. }
  1494. .blue-grey.lighten-2 {
  1495. background-color: #90a4ae !important;
  1496. }
  1497. .blue-grey-text.text-lighten-2 {
  1498. color: #90a4ae !important;
  1499. }
  1500. .blue-grey.lighten-1 {
  1501. background-color: #78909c !important;
  1502. }
  1503. .blue-grey-text.text-lighten-1 {
  1504. color: #78909c !important;
  1505. }
  1506. .blue-grey.darken-1 {
  1507. background-color: #546e7a !important;
  1508. }
  1509. .blue-grey-text.text-darken-1 {
  1510. color: #546e7a !important;
  1511. }
  1512. .blue-grey.darken-2 {
  1513. background-color: #455a64 !important;
  1514. }
  1515. .blue-grey-text.text-darken-2 {
  1516. color: #455a64 !important;
  1517. }
  1518. .blue-grey.darken-3 {
  1519. background-color: #37474f !important;
  1520. }
  1521. .blue-grey-text.text-darken-3 {
  1522. color: #37474f !important;
  1523. }
  1524. .blue-grey.darken-4 {
  1525. background-color: #263238 !important;
  1526. }
  1527. .blue-grey-text.text-darken-4 {
  1528. color: #263238 !important;
  1529. }
  1530. .grey {
  1531. background-color: #9e9e9e !important;
  1532. }
  1533. .grey-text {
  1534. color: #9e9e9e !important;
  1535. }
  1536. .grey.lighten-5 {
  1537. background-color: #fafafa !important;
  1538. }
  1539. .grey-text.text-lighten-5 {
  1540. color: #fafafa !important;
  1541. }
  1542. .grey.lighten-4 {
  1543. background-color: #f5f5f5 !important;
  1544. }
  1545. .grey-text.text-lighten-4 {
  1546. color: #f5f5f5 !important;
  1547. }
  1548. .grey.lighten-3 {
  1549. background-color: #eeeeee !important;
  1550. }
  1551. .grey-text.text-lighten-3 {
  1552. color: #eeeeee !important;
  1553. }
  1554. .grey.lighten-2 {
  1555. background-color: #e0e0e0 !important;
  1556. }
  1557. .grey-text.text-lighten-2 {
  1558. color: #e0e0e0 !important;
  1559. }
  1560. .grey.lighten-1 {
  1561. background-color: #bdbdbd !important;
  1562. }
  1563. .grey-text.text-lighten-1 {
  1564. color: #bdbdbd !important;
  1565. }
  1566. .grey.darken-1 {
  1567. background-color: #757575 !important;
  1568. }
  1569. .grey-text.text-darken-1 {
  1570. color: #757575 !important;
  1571. }
  1572. .grey.darken-2 {
  1573. background-color: #616161 !important;
  1574. }
  1575. .grey-text.text-darken-2 {
  1576. color: #616161 !important;
  1577. }
  1578. .grey.darken-3 {
  1579. background-color: #424242 !important;
  1580. }
  1581. .grey-text.text-darken-3 {
  1582. color: #424242 !important;
  1583. }
  1584. .grey.darken-4 {
  1585. background-color: #212121 !important;
  1586. }
  1587. .grey-text.text-darken-4 {
  1588. color: #212121 !important;
  1589. }
  1590. .black {
  1591. background-color: #000000 !important;
  1592. }
  1593. .black-text {
  1594. color: #000000 !important;
  1595. }
  1596. .white {
  1597. background-color: #FFFFFF !important;
  1598. }
  1599. .white-text {
  1600. color: #FFFFFF !important;
  1601. }
  1602. .transparent {
  1603. background-color: transparent !important;
  1604. }
  1605. .transparent-text {
  1606. color: transparent !important;
  1607. }
  1608. /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
  1609. /**
  1610. * 1. Set default font family to sans-serif.
  1611. * 2. Prevent iOS and IE text size adjust after device orientation change,
  1612. * without disabling user zoom.
  1613. */
  1614. html {
  1615. font-family: sans-serif;
  1616. /* 1 */
  1617. -ms-text-size-adjust: 100%;
  1618. /* 2 */
  1619. -webkit-text-size-adjust: 100%;
  1620. /* 2 */
  1621. }
  1622. /**
  1623. * Remove default margin.
  1624. */
  1625. body {
  1626. margin: 0;
  1627. }
  1628. /* HTML5 display definitions
  1629. ========================================================================== */
  1630. /**
  1631. * Correct `block` display not defined for any HTML5 element in IE 8/9.
  1632. * Correct `block` display not defined for `details` or `summary` in IE 10/11
  1633. * and Firefox.
  1634. * Correct `block` display not defined for `main` in IE 11.
  1635. */
  1636. article,
  1637. aside,
  1638. details,
  1639. figcaption,
  1640. figure,
  1641. footer,
  1642. header,
  1643. hgroup,
  1644. main,
  1645. menu,
  1646. nav,
  1647. section,
  1648. summary {
  1649. display: block;
  1650. }
  1651. /**
  1652. * 1. Correct `inline-block` display not defined in IE 8/9.
  1653. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
  1654. */
  1655. audio,
  1656. canvas,
  1657. progress,
  1658. video {
  1659. display: inline-block;
  1660. /* 1 */
  1661. vertical-align: baseline;
  1662. /* 2 */
  1663. }
  1664. /**
  1665. * Prevent modern browsers from displaying `audio` without controls.
  1666. * Remove excess height in iOS 5 devices.
  1667. */
  1668. audio:not([controls]) {
  1669. display: none;
  1670. height: 0;
  1671. }
  1672. /**
  1673. * Address `[hidden]` styling not present in IE 8/9/10.
  1674. * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
  1675. */
  1676. [hidden],
  1677. template {
  1678. display: none;
  1679. }
  1680. /* Links
  1681. ========================================================================== */
  1682. /**
  1683. * Remove the gray background color from active links in IE 10.
  1684. */
  1685. a {
  1686. background-color: transparent;
  1687. }
  1688. /**
  1689. * Improve readability of focused elements when they are also in an
  1690. * active/hover state.
  1691. */
  1692. a:active,
  1693. a:hover {
  1694. outline: 0;
  1695. }
  1696. /* Text-level semantics
  1697. ========================================================================== */
  1698. /**
  1699. * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
  1700. */
  1701. abbr[title] {
  1702. border-bottom: 1px dotted;
  1703. }
  1704. /**
  1705. * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
  1706. */
  1707. b,
  1708. strong {
  1709. font-weight: bold;
  1710. }
  1711. /**
  1712. * Address styling not present in Safari and Chrome.
  1713. */
  1714. dfn {
  1715. font-style: italic;
  1716. }
  1717. /**
  1718. * Address variable `h1` font-size and margin within `section` and `article`
  1719. * contexts in Firefox 4+, Safari, and Chrome.
  1720. */
  1721. h1 {
  1722. font-size: 2em;
  1723. margin: 0.67em 0;
  1724. }
  1725. /**
  1726. * Address styling not present in IE 8/9.
  1727. */
  1728. mark {
  1729. background: #ff0;
  1730. color: #000;
  1731. }
  1732. /**
  1733. * Address inconsistent and variable font size in all browsers.
  1734. */
  1735. small {
  1736. font-size: 80%;
  1737. }
  1738. /**
  1739. * Prevent `sub` and `sup` affecting `line-height` in all browsers.
  1740. */
  1741. sub,
  1742. sup {
  1743. font-size: 75%;
  1744. line-height: 0;
  1745. position: relative;
  1746. vertical-align: baseline;
  1747. }
  1748. sup {
  1749. top: -0.5em;
  1750. }
  1751. sub {
  1752. bottom: -0.25em;
  1753. }
  1754. /* Embedded content
  1755. ========================================================================== */
  1756. /**
  1757. * Remove border when inside `a` element in IE 8/9/10.
  1758. */
  1759. img {
  1760. border: 0;
  1761. }
  1762. /**
  1763. * Correct overflow not hidden in IE 9/10/11.
  1764. */
  1765. svg:not(:root) {
  1766. overflow: hidden;
  1767. }
  1768. /* Grouping content
  1769. ========================================================================== */
  1770. /**
  1771. * Address margin not present in IE 8/9 and Safari.
  1772. */
  1773. figure {
  1774. margin: 1em 40px;
  1775. }
  1776. /**
  1777. * Address differences between Firefox and other browsers.
  1778. */
  1779. hr {
  1780. -webkit-box-sizing: content-box;
  1781. box-sizing: content-box;
  1782. height: 0;
  1783. }
  1784. /**
  1785. * Contain overflow in all browsers.
  1786. */
  1787. pre {
  1788. overflow: auto;
  1789. }
  1790. /**
  1791. * Address odd `em`-unit font size rendering in all browsers.
  1792. */
  1793. code,
  1794. kbd,
  1795. pre,
  1796. samp {
  1797. font-family: monospace, monospace;
  1798. font-size: 1em;
  1799. }
  1800. /* Forms
  1801. ========================================================================== */
  1802. /**
  1803. * Known limitation: by default, Chrome and Safari on OS X allow very limited
  1804. * styling of `select`, unless a `border` property is set.
  1805. */
  1806. /**
  1807. * 1. Correct color not being inherited.
  1808. * Known issue: affects color of disabled elements.
  1809. * 2. Correct font properties not being inherited.
  1810. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
  1811. */
  1812. button,
  1813. input,
  1814. optgroup,
  1815. select,
  1816. textarea {
  1817. color: inherit;
  1818. /* 1 */
  1819. font: inherit;
  1820. /* 2 */
  1821. margin: 0;
  1822. /* 3 */
  1823. }
  1824. /**
  1825. * Address `overflow` set to `hidden` in IE 8/9/10/11.
  1826. */
  1827. button {
  1828. overflow: visible;
  1829. }
  1830. /**
  1831. * Address inconsistent `text-transform` inheritance for `button` and `select`.
  1832. * All other form control elements do not inherit `text-transform` values.
  1833. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
  1834. * Correct `select` style inheritance in Firefox.
  1835. */
  1836. button,
  1837. select {
  1838. text-transform: none;
  1839. }
  1840. /**
  1841. * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
  1842. * and `video` controls.
  1843. * 2. Correct inability to style clickable `input` types in iOS.
  1844. * 3. Improve usability and consistency of cursor style between image-type
  1845. * `input` and others.
  1846. */
  1847. button,
  1848. html input[type="button"],
  1849. input[type="reset"],
  1850. input[type="submit"] {
  1851. -webkit-appearance: button;
  1852. /* 2 */
  1853. cursor: pointer;
  1854. /* 3 */
  1855. }
  1856. /**
  1857. * Re-set default cursor for disabled elements.
  1858. */
  1859. button[disabled],
  1860. html input[disabled] {
  1861. cursor: default;
  1862. }
  1863. /**
  1864. * Remove inner padding and border in Firefox 4+.
  1865. */
  1866. button::-moz-focus-inner,
  1867. input::-moz-focus-inner {
  1868. border: 0;
  1869. padding: 0;
  1870. }
  1871. /**
  1872. * Address Firefox 4+ setting `line-height` on `input` using `!important` in
  1873. * the UA stylesheet.
  1874. */
  1875. input {
  1876. line-height: normal;
  1877. }
  1878. /**
  1879. * It's recommended that you don't attempt to style these elements.
  1880. * Firefox's implementation doesn't respect box-sizing, padding, or width.
  1881. *
  1882. * 1. Address box sizing set to `content-box` in IE 8/9/10.
  1883. * 2. Remove excess padding in IE 8/9/10.
  1884. */
  1885. input[type="checkbox"],
  1886. input[type="radio"] {
  1887. -webkit-box-sizing: border-box;
  1888. box-sizing: border-box;
  1889. /* 1 */
  1890. padding: 0;
  1891. /* 2 */
  1892. }
  1893. /**
  1894. * Fix the cursor style for Chrome's increment/decrement buttons. For certain
  1895. * `font-size` values of the `input`, it causes the cursor style of the
  1896. * decrement button to change from `default` to `text`.
  1897. */
  1898. input[type="number"]::-webkit-inner-spin-button,
  1899. input[type="number"]::-webkit-outer-spin-button {
  1900. height: auto;
  1901. }
  1902. /**
  1903. * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
  1904. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
  1905. */
  1906. input[type="search"] {
  1907. -webkit-appearance: textfield;
  1908. /* 1 */
  1909. -webkit-box-sizing: content-box;
  1910. box-sizing: content-box;
  1911. /* 2 */
  1912. }
  1913. /**
  1914. * Remove inner padding and search cancel button in Safari and Chrome on OS X.
  1915. * Safari (but not Chrome) clips the cancel button when the search input has
  1916. * padding (and `textfield` appearance).
  1917. */
  1918. input[type="search"]::-webkit-search-cancel-button,
  1919. input[type="search"]::-webkit-search-decoration {
  1920. -webkit-appearance: none;
  1921. }
  1922. /**
  1923. * Define consistent border, margin, and padding.
  1924. */
  1925. fieldset {
  1926. border: 1px solid #c0c0c0;
  1927. margin: 0 2px;
  1928. padding: 0.35em 0.625em 0.75em;
  1929. }
  1930. /**
  1931. * 1. Correct `color` not being inherited in IE 8/9/10/11.
  1932. * 2. Remove padding so people aren't caught out if they zero out fieldsets.
  1933. */
  1934. legend {
  1935. border: 0;
  1936. /* 1 */
  1937. padding: 0;
  1938. /* 2 */
  1939. }
  1940. /**
  1941. * Remove default vertical scrollbar in IE 8/9/10/11.
  1942. */
  1943. textarea {
  1944. overflow: auto;
  1945. }
  1946. /**
  1947. * Don't inherit the `font-weight` (applied by a rule above).
  1948. * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
  1949. */
  1950. optgroup {
  1951. font-weight: bold;
  1952. }
  1953. /* Tables
  1954. ========================================================================== */
  1955. /**
  1956. * Remove most spacing between table cells.
  1957. */
  1958. table {
  1959. border-collapse: collapse;
  1960. border-spacing: 0;
  1961. }
  1962. td,
  1963. th {
  1964. padding: 0;
  1965. }
  1966. html {
  1967. -webkit-box-sizing: border-box;
  1968. box-sizing: border-box;
  1969. }
  1970. *, *:before, *:after {
  1971. -webkit-box-sizing: inherit;
  1972. box-sizing: inherit;
  1973. }
  1974. ul:not(.browser-default) {
  1975. padding-left: 0;
  1976. list-style-type: none;
  1977. }
  1978. ul:not(.browser-default) li {
  1979. list-style-type: none;
  1980. }
  1981. a {
  1982. color: #039be5;
  1983. text-decoration: none;
  1984. -webkit-tap-highlight-color: transparent;
  1985. }
  1986. .valign-wrapper {
  1987. display: -webkit-box;
  1988. display: -webkit-flex;
  1989. display: -ms-flexbox;
  1990. display: flex;
  1991. -webkit-box-align: center;
  1992. -webkit-align-items: center;
  1993. -ms-flex-align: center;
  1994. align-items: center;
  1995. }
  1996. .clearfix {
  1997. clear: both;
  1998. }
  1999. .z-depth-0 {
  2000. -webkit-box-shadow: none !important;
  2001. box-shadow: none !important;
  2002. }
  2003. .z-depth-1, nav, .card-panel, .card, .toast, .btn, .btn-large, .btn-floating, .dropdown-content, .collapsible, .side-nav {
  2004. -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  2005. box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
  2006. }
  2007. .z-depth-1-half, .btn:hover, .btn-large:hover, .btn-floating:hover {
  2008. -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
  2009. box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 7px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -1px rgba(0, 0, 0, 0.2);
  2010. }
  2011. .z-depth-2 {
  2012. -webkit-box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
  2013. box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3);
  2014. }
  2015. .z-depth-3 {
  2016. -webkit-box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.3);
  2017. box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14), 0 1px 18px 0 rgba(0, 0, 0, 0.12), 0 3px 5px -1px rgba(0, 0, 0, 0.3);
  2018. }
  2019. .z-depth-4, .modal {
  2020. -webkit-box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.3);
  2021. box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.3);
  2022. }
  2023. .z-depth-5 {
  2024. -webkit-box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.3);
  2025. box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.3);
  2026. }
  2027. .hoverable {
  2028. -webkit-transition: -webkit-box-shadow .25s;
  2029. transition: -webkit-box-shadow .25s;
  2030. transition: box-shadow .25s;
  2031. transition: box-shadow .25s, -webkit-box-shadow .25s;
  2032. -webkit-box-shadow: 0;
  2033. box-shadow: 0;
  2034. }
  2035. .hoverable:hover {
  2036. -webkit-transition: -webkit-box-shadow .25s;
  2037. transition: -webkit-box-shadow .25s;
  2038. transition: box-shadow .25s;
  2039. transition: box-shadow .25s, -webkit-box-shadow .25s;
  2040. -webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  2041. box-shadow: 0 8px 17px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  2042. }
  2043. .divider {
  2044. height: 1px;
  2045. overflow: hidden;
  2046. background-color: #e0e0e0;
  2047. }
  2048. blockquote {
  2049. margin: 20px 0;
  2050. padding-left: 1.5rem;
  2051. border-left: 5px solid #ee6e73;
  2052. }
  2053. i {
  2054. line-height: inherit;
  2055. }
  2056. i.left {
  2057. float: left;
  2058. margin-right: 15px;
  2059. }
  2060. i.right {
  2061. float: right;
  2062. margin-left: 15px;
  2063. }
  2064. i.tiny {
  2065. font-size: 1rem;
  2066. }
  2067. i.small {
  2068. font-size: 2rem;
  2069. }
  2070. i.medium {
  2071. font-size: 4rem;
  2072. }
  2073. i.large {
  2074. font-size: 6rem;
  2075. }
  2076. img.responsive-img,
  2077. video.responsive-video {
  2078. max-width: 100%;
  2079. height: auto;
  2080. }
  2081. .pagination li {
  2082. display: inline-block;
  2083. border-radius: 2px;
  2084. text-align: center;
  2085. vertical-align: top;
  2086. height: 30px;
  2087. }
  2088. .pagination li a {
  2089. color: #444;
  2090. display: inline-block;
  2091. font-size: 1.2rem;
  2092. padding: 0 10px;
  2093. line-height: 30px;
  2094. }
  2095. .pagination li.active a {
  2096. color: #fff;
  2097. }
  2098. .pagination li.active {
  2099. background-color: #ee6e73;
  2100. }
  2101. .pagination li.disabled a {
  2102. cursor: default;
  2103. color: #999;
  2104. }
  2105. .pagination li i {
  2106. font-size: 2rem;
  2107. }
  2108. .pagination li.pages ul li {
  2109. display: inline-block;
  2110. float: none;
  2111. }
  2112. @media only screen and (max-width: 992px) {
  2113. .pagination {
  2114. width: 100%;
  2115. }
  2116. .pagination li.prev,
  2117. .pagination li.next {
  2118. width: 10%;
  2119. }
  2120. .pagination li.pages {
  2121. width: 80%;
  2122. overflow: hidden;
  2123. white-space: nowrap;
  2124. }
  2125. }
  2126. .breadcrumb {
  2127. font-size: 18px;
  2128. color: rgba(255, 255, 255, 0.7);
  2129. }
  2130. .breadcrumb i,
  2131. .breadcrumb [class^="mdi-"], .breadcrumb [class*="mdi-"],
  2132. .breadcrumb i.material-icons {
  2133. display: inline-block;
  2134. float: left;
  2135. font-size: 24px;
  2136. }
  2137. .breadcrumb:before {
  2138. content: '\E5CC';
  2139. color: rgba(255, 255, 255, 0.7);
  2140. vertical-align: top;
  2141. display: inline-block;
  2142. font-family: 'Material Icons';
  2143. font-weight: normal;
  2144. font-style: normal;
  2145. font-size: 25px;
  2146. margin: 0 10px 0 8px;
  2147. -webkit-font-smoothing: antialiased;
  2148. }
  2149. .breadcrumb:first-child:before {
  2150. display: none;
  2151. }
  2152. .breadcrumb:last-child {
  2153. color: #fff;
  2154. }
  2155. .parallax-container {
  2156. position: relative;
  2157. overflow: hidden;
  2158. height: 500px;
  2159. }
  2160. .parallax-container .parallax {
  2161. position: absolute;
  2162. top: 0;
  2163. left: 0;
  2164. right: 0;
  2165. bottom: 0;
  2166. z-index: -1;
  2167. }
  2168. .parallax-container .parallax img {
  2169. display: none;
  2170. position: absolute;
  2171. left: 50%;
  2172. bottom: 0;
  2173. min-width: 100%;
  2174. min-height: 100%;
  2175. -webkit-transform: translate3d(0, 0, 0);
  2176. transform: translate3d(0, 0, 0);
  2177. -webkit-transform: translateX(-50%);
  2178. transform: translateX(-50%);
  2179. }
  2180. .pin-top, .pin-bottom {
  2181. position: relative;
  2182. }
  2183. .pinned {
  2184. position: fixed !important;
  2185. }
  2186. /*********************
  2187. Transition Classes
  2188. **********************/
  2189. ul.staggered-list li {
  2190. opacity: 0;
  2191. }
  2192. .fade-in {
  2193. opacity: 0;
  2194. -webkit-transform-origin: 0 50%;
  2195. transform-origin: 0 50%;
  2196. }
  2197. /*********************
  2198. Media Query Classes
  2199. **********************/
  2200. @media only screen and (max-width: 600px) {
  2201. .hide-on-small-only, .hide-on-small-and-down {
  2202. display: none !important;
  2203. }
  2204. }
  2205. @media only screen and (max-width: 992px) {
  2206. .hide-on-med-and-down {
  2207. display: none !important;
  2208. }
  2209. }
  2210. @media only screen and (min-width: 601px) {
  2211. .hide-on-med-and-up {
  2212. display: none !important;
  2213. }
  2214. }
  2215. @media only screen and (min-width: 600px) and (max-width: 992px) {
  2216. .hide-on-med-only {
  2217. display: none !important;
  2218. }
  2219. }
  2220. @media only screen and (min-width: 993px) {
  2221. .hide-on-large-only {
  2222. display: none !important;
  2223. }
  2224. }
  2225. @media only screen and (min-width: 993px) {
  2226. .show-on-large {
  2227. display: block !important;
  2228. }
  2229. }
  2230. @media only screen and (min-width: 600px) and (max-width: 992px) {
  2231. .show-on-medium {
  2232. display: block !important;
  2233. }
  2234. }
  2235. @media only screen and (max-width: 600px) {
  2236. .show-on-small {
  2237. display: block !important;
  2238. }
  2239. }
  2240. @media only screen and (min-width: 601px) {
  2241. .show-on-medium-and-up {
  2242. display: block !important;
  2243. }
  2244. }
  2245. @media only screen and (max-width: 992px) {
  2246. .show-on-medium-and-down {
  2247. display: block !important;
  2248. }
  2249. }
  2250. @media only screen and (max-width: 600px) {
  2251. .center-on-small-only {
  2252. text-align: center;
  2253. }
  2254. }
  2255. .page-footer {
  2256. padding-top: 20px;
  2257. color: #fff;
  2258. background-color: #ee6e73;
  2259. }
  2260. .page-footer .footer-copyright {
  2261. overflow: hidden;
  2262. min-height: 50px;
  2263. display: -webkit-box;
  2264. display: -webkit-flex;
  2265. display: -ms-flexbox;
  2266. display: flex;
  2267. -webkit-box-align: center;
  2268. -webkit-align-items: center;
  2269. -ms-flex-align: center;
  2270. align-items: center;
  2271. padding: 10px 0px;
  2272. color: rgba(255, 255, 255, 0.8);
  2273. background-color: rgba(51, 51, 51, 0.08);
  2274. }
  2275. table, th, td {
  2276. border: none;
  2277. }
  2278. table {
  2279. width: 100%;
  2280. display: table;
  2281. }
  2282. table.bordered > thead > tr,
  2283. table.bordered > tbody > tr {
  2284. border-bottom: 1px solid #d0d0d0;
  2285. }
  2286. table.striped > tbody > tr:nth-child(odd) {
  2287. background-color: #f2f2f2;
  2288. }
  2289. table.striped > tbody > tr > td {
  2290. border-radius: 0;
  2291. }
  2292. table.highlight > tbody > tr {
  2293. -webkit-transition: background-color .25s ease;
  2294. transition: background-color .25s ease;
  2295. }
  2296. table.highlight > tbody > tr:hover {
  2297. background-color: #f2f2f2;
  2298. }
  2299. table.centered thead tr th, table.centered tbody tr td {
  2300. text-align: center;
  2301. }
  2302. thead {
  2303. border-bottom: 1px solid #d0d0d0;
  2304. }
  2305. td, th {
  2306. padding: 15px 5px;
  2307. display: table-cell;
  2308. text-align: left;
  2309. vertical-align: middle;
  2310. border-radius: 2px;
  2311. }
  2312. @media only screen and (max-width: 992px) {
  2313. table.responsive-table {
  2314. width: 100%;
  2315. border-collapse: collapse;
  2316. border-spacing: 0;
  2317. display: block;
  2318. position: relative;
  2319. /* sort out borders */
  2320. }
  2321. table.responsive-table td:empty:before {
  2322. content: '\00a0';
  2323. }
  2324. table.responsive-table th,
  2325. table.responsive-table td {
  2326. margin: 0;
  2327. vertical-align: top;
  2328. }
  2329. table.responsive-table th {
  2330. text-align: left;
  2331. }
  2332. table.responsive-table thead {
  2333. display: block;
  2334. float: left;
  2335. }
  2336. table.responsive-table thead tr {
  2337. display: block;
  2338. padding: 0 10px 0 0;
  2339. }
  2340. table.responsive-table thead tr th::before {
  2341. content: "\00a0";
  2342. }
  2343. table.responsive-table tbody {
  2344. display: block;
  2345. width: auto;
  2346. position: relative;
  2347. overflow-x: auto;
  2348. white-space: nowrap;
  2349. }
  2350. table.responsive-table tbody tr {
  2351. display: inline-block;
  2352. vertical-align: top;
  2353. }
  2354. table.responsive-table th {
  2355. display: block;
  2356. text-align: right;
  2357. }
  2358. table.responsive-table td {
  2359. display: block;
  2360. min-height: 1.25em;
  2361. text-align: left;
  2362. }
  2363. table.responsive-table tr {
  2364. padding: 0 10px;
  2365. }
  2366. table.responsive-table thead {
  2367. border: 0;
  2368. border-right: 1px solid #d0d0d0;
  2369. }
  2370. table.responsive-table.bordered th {
  2371. border-bottom: 0;
  2372. border-left: 0;
  2373. }
  2374. table.responsive-table.bordered td {
  2375. border-left: 0;
  2376. border-right: 0;
  2377. border-bottom: 0;
  2378. }
  2379. table.responsive-table.bordered tr {
  2380. border: 0;
  2381. }
  2382. table.responsive-table.bordered tbody tr {
  2383. border-right: 1px solid #d0d0d0;
  2384. }
  2385. }
  2386. .collection {
  2387. margin: 0.5rem 0 1rem 0;
  2388. border: 1px solid #e0e0e0;
  2389. border-radius: 2px;
  2390. overflow: hidden;
  2391. position: relative;
  2392. }
  2393. .collection .collection-item {
  2394. background-color: #fff;
  2395. line-height: 1.5rem;
  2396. padding: 10px 20px;
  2397. margin: 0;
  2398. border-bottom: 1px solid #e0e0e0;
  2399. }
  2400. .collection .collection-item.avatar {
  2401. min-height: 84px;
  2402. padding-left: 72px;
  2403. position: relative;
  2404. }
  2405. .collection .collection-item.avatar .circle {
  2406. position: absolute;
  2407. width: 42px;
  2408. height: 42px;
  2409. overflow: hidden;
  2410. left: 15px;
  2411. display: inline-block;
  2412. vertical-align: middle;
  2413. }
  2414. .collection .collection-item.avatar i.circle {
  2415. font-size: 18px;
  2416. line-height: 42px;
  2417. color: #fff;
  2418. background-color: #999;
  2419. text-align: center;
  2420. }
  2421. .collection .collection-item.avatar .title {
  2422. font-size: 16px;
  2423. }
  2424. .collection .collection-item.avatar p {
  2425. margin: 0;
  2426. }
  2427. .collection .collection-item.avatar .secondary-content {
  2428. position: absolute;
  2429. top: 16px;
  2430. right: 16px;
  2431. }
  2432. .collection .collection-item:last-child {
  2433. border-bottom: none;
  2434. }
  2435. .collection .collection-item.active {
  2436. background-color: #26a69a;
  2437. color: #eafaf9;
  2438. }
  2439. .collection .collection-item.active .secondary-content {
  2440. color: #fff;
  2441. }
  2442. .collection a.collection-item {
  2443. display: block;
  2444. -webkit-transition: .25s;
  2445. transition: .25s;
  2446. color: #26a69a;
  2447. }
  2448. .collection a.collection-item:not(.active):hover {
  2449. background-color: #ddd;
  2450. }
  2451. .collection.with-header .collection-header {
  2452. background-color: #fff;
  2453. border-bottom: 1px solid #e0e0e0;
  2454. padding: 10px 20px;
  2455. }
  2456. .collection.with-header .collection-item {
  2457. padding-left: 30px;
  2458. }
  2459. .collection.with-header .collection-item.avatar {
  2460. padding-left: 72px;
  2461. }
  2462. .secondary-content {
  2463. float: right;
  2464. color: #26a69a;
  2465. }
  2466. .collapsible .collection {
  2467. margin: 0;
  2468. border: none;
  2469. }
  2470. .video-container {
  2471. position: relative;
  2472. padding-bottom: 56.25%;
  2473. height: 0;
  2474. overflow: hidden;
  2475. }
  2476. .video-container iframe, .video-container object, .video-container embed {
  2477. position: absolute;
  2478. top: 0;
  2479. left: 0;
  2480. width: 100%;
  2481. height: 100%;
  2482. }
  2483. .progress {
  2484. position: relative;
  2485. height: 4px;
  2486. display: block;
  2487. width: 100%;
  2488. background-color: #acece6;
  2489. border-radius: 2px;
  2490. margin: 0.5rem 0 1rem 0;
  2491. overflow: hidden;
  2492. }
  2493. .progress .determinate {
  2494. position: absolute;
  2495. top: 0;
  2496. left: 0;
  2497. bottom: 0;
  2498. background-color: #26a69a;
  2499. -webkit-transition: width .3s linear;
  2500. transition: width .3s linear;
  2501. }
  2502. .progress .indeterminate {
  2503. background-color: #26a69a;
  2504. }
  2505. .progress .indeterminate:before {
  2506. content: '';
  2507. position: absolute;
  2508. background-color: inherit;
  2509. top: 0;
  2510. left: 0;
  2511. bottom: 0;
  2512. will-change: left, right;
  2513. -webkit-animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
  2514. animation: indeterminate 2.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
  2515. }
  2516. .progress .indeterminate:after {
  2517. content: '';
  2518. position: absolute;
  2519. background-color: inherit;
  2520. top: 0;
  2521. left: 0;
  2522. bottom: 0;
  2523. will-change: left, right;
  2524. -webkit-animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  2525. animation: indeterminate-short 2.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
  2526. -webkit-animation-delay: 1.15s;
  2527. animation-delay: 1.15s;
  2528. }
  2529. @-webkit-keyframes indeterminate {
  2530. 0% {
  2531. left: -35%;
  2532. right: 100%;
  2533. }
  2534. 60% {
  2535. left: 100%;
  2536. right: -90%;
  2537. }
  2538. 100% {
  2539. left: 100%;
  2540. right: -90%;
  2541. }
  2542. }
  2543. @keyframes indeterminate {
  2544. 0% {
  2545. left: -35%;
  2546. right: 100%;
  2547. }
  2548. 60% {
  2549. left: 100%;
  2550. right: -90%;
  2551. }
  2552. 100% {
  2553. left: 100%;
  2554. right: -90%;
  2555. }
  2556. }
  2557. @-webkit-keyframes indeterminate-short {
  2558. 0% {
  2559. left: -200%;
  2560. right: 100%;
  2561. }
  2562. 60% {
  2563. left: 107%;
  2564. right: -8%;
  2565. }
  2566. 100% {
  2567. left: 107%;
  2568. right: -8%;
  2569. }
  2570. }
  2571. @keyframes indeterminate-short {
  2572. 0% {
  2573. left: -200%;
  2574. right: 100%;
  2575. }
  2576. 60% {
  2577. left: 107%;
  2578. right: -8%;
  2579. }
  2580. 100% {
  2581. left: 107%;
  2582. right: -8%;
  2583. }
  2584. }
  2585. /*******************
  2586. Utility Classes
  2587. *******************/
  2588. .hide {
  2589. display: none !important;
  2590. }
  2591. .left-align {
  2592. text-align: left;
  2593. }
  2594. .right-align {
  2595. text-align: right;
  2596. }
  2597. .center, .center-align {
  2598. text-align: center;
  2599. }
  2600. .left {
  2601. float: left !important;
  2602. }
  2603. .right {
  2604. float: right !important;
  2605. }
  2606. .no-select, input[type=range],
  2607. input[type=range] + .thumb {
  2608. -webkit-touch-callout: none;
  2609. -webkit-user-select: none;
  2610. -moz-user-select: none;
  2611. -ms-user-select: none;
  2612. user-select: none;
  2613. }
  2614. .circle {
  2615. border-radius: 50%;
  2616. }
  2617. .center-block {
  2618. display: block;
  2619. margin-left: auto;
  2620. margin-right: auto;
  2621. }
  2622. .truncate {
  2623. display: block;
  2624. white-space: nowrap;
  2625. overflow: hidden;
  2626. text-overflow: ellipsis;
  2627. }
  2628. .no-padding {
  2629. padding: 0 !important;
  2630. }
  2631. span.badge {
  2632. min-width: 3rem;
  2633. padding: 0 6px;
  2634. margin-left: 14px;
  2635. text-align: center;
  2636. font-size: 1rem;
  2637. line-height: 22px;
  2638. height: 22px;
  2639. color: #757575;
  2640. float: right;
  2641. -webkit-box-sizing: border-box;
  2642. box-sizing: border-box;
  2643. }
  2644. span.badge.new {
  2645. font-weight: 300;
  2646. font-size: 0.8rem;
  2647. color: #fff;
  2648. background-color: #26a69a;
  2649. border-radius: 2px;
  2650. }
  2651. span.badge.new:after {
  2652. content: " new";
  2653. }
  2654. span.badge[data-badge-caption]::after {
  2655. content: " " attr(data-badge-caption);
  2656. }
  2657. nav ul a span.badge {
  2658. display: inline-block;
  2659. float: none;
  2660. margin-left: 4px;
  2661. line-height: 22px;
  2662. height: 22px;
  2663. }
  2664. .collection-item span.badge {
  2665. margin-top: calc(0.75rem - 11px);
  2666. }
  2667. .collapsible span.badge {
  2668. margin-top: calc(1.5rem - 11px);
  2669. }
  2670. .side-nav span.badge {
  2671. margin-top: calc(24px - 11px);
  2672. }
  2673. /* This is needed for some mobile phones to display the Google Icon font properly */
  2674. .material-icons {
  2675. text-rendering: optimizeLegibility;
  2676. -webkit-font-feature-settings: 'liga';
  2677. -moz-font-feature-settings: 'liga';
  2678. font-feature-settings: 'liga';
  2679. }
  2680. .container {
  2681. margin: 0 auto;
  2682. max-width: 1280px;
  2683. width: 90%;
  2684. }
  2685. @media only screen and (min-width: 601px) {
  2686. .container {
  2687. width: 85%;
  2688. }
  2689. }
  2690. @media only screen and (min-width: 993px) {
  2691. .container {
  2692. width: 70%;
  2693. }
  2694. }
  2695. .container .row {
  2696. margin-left: -0.75rem;
  2697. margin-right: -0.75rem;
  2698. }
  2699. .section {
  2700. padding-top: 1rem;
  2701. padding-bottom: 1rem;
  2702. }
  2703. .section.no-pad {
  2704. padding: 0;
  2705. }
  2706. .section.no-pad-bot {
  2707. padding-bottom: 0;
  2708. }
  2709. .section.no-pad-top {
  2710. padding-top: 0;
  2711. }
  2712. .row {
  2713. margin-left: auto;
  2714. margin-right: auto;
  2715. margin-bottom: 20px;
  2716. }
  2717. .row:after {
  2718. content: "";
  2719. display: table;
  2720. clear: both;
  2721. }
  2722. .row .col {
  2723. float: left;
  2724. -webkit-box-sizing: border-box;
  2725. box-sizing: border-box;
  2726. padding: 0 0.75rem;
  2727. min-height: 1px;
  2728. }
  2729. .row .col[class*="push-"], .row .col[class*="pull-"] {
  2730. position: relative;
  2731. }
  2732. .row .col.s1 {
  2733. width: 8.3333333333%;
  2734. margin-left: auto;
  2735. left: auto;
  2736. right: auto;
  2737. }
  2738. .row .col.s2 {
  2739. width: 16.6666666667%;
  2740. margin-left: auto;
  2741. left: auto;
  2742. right: auto;
  2743. }
  2744. .row .col.s3 {
  2745. width: 25%;
  2746. margin-left: auto;
  2747. left: auto;
  2748. right: auto;
  2749. }
  2750. .row .col.s4 {
  2751. width: 33.3333333333%;
  2752. margin-left: auto;
  2753. left: auto;
  2754. right: auto;
  2755. }
  2756. .row .col.s5 {
  2757. width: 41.6666666667%;
  2758. margin-left: auto;
  2759. left: auto;
  2760. right: auto;
  2761. }
  2762. .row .col.s6 {
  2763. width: 50%;
  2764. margin-left: auto;
  2765. left: auto;
  2766. right: auto;
  2767. }
  2768. .row .col.s7 {
  2769. width: 58.3333333333%;
  2770. margin-left: auto;
  2771. left: auto;
  2772. right: auto;
  2773. }
  2774. .row .col.s8 {
  2775. width: 66.6666666667%;
  2776. margin-left: auto;
  2777. left: auto;
  2778. right: auto;
  2779. }
  2780. .row .col.s9 {
  2781. width: 75%;
  2782. margin-left: auto;
  2783. left: auto;
  2784. right: auto;
  2785. }
  2786. .row .col.s10 {
  2787. width: 83.3333333333%;
  2788. margin-left: auto;
  2789. left: auto;
  2790. right: auto;
  2791. }
  2792. .row .col.s11 {
  2793. width: 91.6666666667%;
  2794. margin-left: auto;
  2795. left: auto;
  2796. right: auto;
  2797. }
  2798. .row .col.s12 {
  2799. width: 100%;
  2800. margin-left: auto;
  2801. left: auto;
  2802. right: auto;
  2803. }
  2804. .row .col.offset-s1 {
  2805. margin-left: 8.3333333333%;
  2806. }
  2807. .row .col.pull-s1 {
  2808. right: 8.3333333333%;
  2809. }
  2810. .row .col.push-s1 {
  2811. left: 8.3333333333%;
  2812. }
  2813. .row .col.offset-s2 {
  2814. margin-left: 16.6666666667%;
  2815. }
  2816. .row .col.pull-s2 {
  2817. right: 16.6666666667%;
  2818. }
  2819. .row .col.push-s2 {
  2820. left: 16.6666666667%;
  2821. }
  2822. .row .col.offset-s3 {
  2823. margin-left: 25%;
  2824. }
  2825. .row .col.pull-s3 {
  2826. right: 25%;
  2827. }
  2828. .row .col.push-s3 {
  2829. left: 25%;
  2830. }
  2831. .row .col.offset-s4 {
  2832. margin-left: 33.3333333333%;
  2833. }
  2834. .row .col.pull-s4 {
  2835. right: 33.3333333333%;
  2836. }
  2837. .row .col.push-s4 {
  2838. left: 33.3333333333%;
  2839. }
  2840. .row .col.offset-s5 {
  2841. margin-left: 41.6666666667%;
  2842. }
  2843. .row .col.pull-s5 {
  2844. right: 41.6666666667%;
  2845. }
  2846. .row .col.push-s5 {
  2847. left: 41.6666666667%;
  2848. }
  2849. .row .col.offset-s6 {
  2850. margin-left: 50%;
  2851. }
  2852. .row .col.pull-s6 {
  2853. right: 50%;
  2854. }
  2855. .row .col.push-s6 {
  2856. left: 50%;
  2857. }
  2858. .row .col.offset-s7 {
  2859. margin-left: 58.3333333333%;
  2860. }
  2861. .row .col.pull-s7 {
  2862. right: 58.3333333333%;
  2863. }
  2864. .row .col.push-s7 {
  2865. left: 58.3333333333%;
  2866. }
  2867. .row .col.offset-s8 {
  2868. margin-left: 66.6666666667%;
  2869. }
  2870. .row .col.pull-s8 {
  2871. right: 66.6666666667%;
  2872. }
  2873. .row .col.push-s8 {
  2874. left: 66.6666666667%;
  2875. }
  2876. .row .col.offset-s9 {
  2877. margin-left: 75%;
  2878. }
  2879. .row .col.pull-s9 {
  2880. right: 75%;
  2881. }
  2882. .row .col.push-s9 {
  2883. left: 75%;
  2884. }
  2885. .row .col.offset-s10 {
  2886. margin-left: 83.3333333333%;
  2887. }
  2888. .row .col.pull-s10 {
  2889. right: 83.3333333333%;
  2890. }
  2891. .row .col.push-s10 {
  2892. left: 83.3333333333%;
  2893. }
  2894. .row .col.offset-s11 {
  2895. margin-left: 91.6666666667%;
  2896. }
  2897. .row .col.pull-s11 {
  2898. right: 91.6666666667%;
  2899. }
  2900. .row .col.push-s11 {
  2901. left: 91.6666666667%;
  2902. }
  2903. .row .col.offset-s12 {
  2904. margin-left: 100%;
  2905. }
  2906. .row .col.pull-s12 {
  2907. right: 100%;
  2908. }
  2909. .row .col.push-s12 {
  2910. left: 100%;
  2911. }
  2912. @media only screen and (min-width: 601px) {
  2913. .row .col.m1 {
  2914. width: 8.3333333333%;
  2915. margin-left: auto;
  2916. left: auto;
  2917. right: auto;
  2918. }
  2919. .row .col.m2 {
  2920. width: 16.6666666667%;
  2921. margin-left: auto;
  2922. left: auto;
  2923. right: auto;
  2924. }
  2925. .row .col.m3 {
  2926. width: 25%;
  2927. margin-left: auto;
  2928. left: auto;
  2929. right: auto;
  2930. }
  2931. .row .col.m4 {
  2932. width: 33.3333333333%;
  2933. margin-left: auto;
  2934. left: auto;
  2935. right: auto;
  2936. }
  2937. .row .col.m5 {
  2938. width: 41.6666666667%;
  2939. margin-left: auto;
  2940. left: auto;
  2941. right: auto;
  2942. }
  2943. .row .col.m6 {
  2944. width: 50%;
  2945. margin-left: auto;
  2946. left: auto;
  2947. right: auto;
  2948. }
  2949. .row .col.m7 {
  2950. width: 58.3333333333%;
  2951. margin-left: auto;
  2952. left: auto;
  2953. right: auto;
  2954. }
  2955. .row .col.m8 {
  2956. width: 66.6666666667%;
  2957. margin-left: auto;
  2958. left: auto;
  2959. right: auto;
  2960. }
  2961. .row .col.m9 {
  2962. width: 75%;
  2963. margin-left: auto;
  2964. left: auto;
  2965. right: auto;
  2966. }
  2967. .row .col.m10 {
  2968. width: 83.3333333333%;
  2969. margin-left: auto;
  2970. left: auto;
  2971. right: auto;
  2972. }
  2973. .row .col.m11 {
  2974. width: 91.6666666667%;
  2975. margin-left: auto;
  2976. left: auto;
  2977. right: auto;
  2978. }
  2979. .row .col.m12 {
  2980. width: 100%;
  2981. margin-left: auto;
  2982. left: auto;
  2983. right: auto;
  2984. }
  2985. .row .col.offset-m1 {
  2986. margin-left: 8.3333333333%;
  2987. }
  2988. .row .col.pull-m1 {
  2989. right: 8.3333333333%;
  2990. }
  2991. .row .col.push-m1 {
  2992. left: 8.3333333333%;
  2993. }
  2994. .row .col.offset-m2 {
  2995. margin-left: 16.6666666667%;
  2996. }
  2997. .row .col.pull-m2 {
  2998. right: 16.6666666667%;
  2999. }
  3000. .row .col.push-m2 {
  3001. left: 16.6666666667%;
  3002. }
  3003. .row .col.offset-m3 {
  3004. margin-left: 25%;
  3005. }
  3006. .row .col.pull-m3 {
  3007. right: 25%;
  3008. }
  3009. .row .col.push-m3 {
  3010. left: 25%;
  3011. }
  3012. .row .col.offset-m4 {
  3013. margin-left: 33.3333333333%;
  3014. }
  3015. .row .col.pull-m4 {
  3016. right: 33.3333333333%;
  3017. }
  3018. .row .col.push-m4 {
  3019. left: 33.3333333333%;
  3020. }
  3021. .row .col.offset-m5 {
  3022. margin-left: 41.6666666667%;
  3023. }
  3024. .row .col.pull-m5 {
  3025. right: 41.6666666667%;
  3026. }
  3027. .row .col.push-m5 {
  3028. left: 41.6666666667%;
  3029. }
  3030. .row .col.offset-m6 {
  3031. margin-left: 50%;
  3032. }
  3033. .row .col.pull-m6 {
  3034. right: 50%;
  3035. }
  3036. .row .col.push-m6 {
  3037. left: 50%;
  3038. }
  3039. .row .col.offset-m7 {
  3040. margin-left: 58.3333333333%;
  3041. }
  3042. .row .col.pull-m7 {
  3043. right: 58.3333333333%;
  3044. }
  3045. .row .col.push-m7 {
  3046. left: 58.3333333333%;
  3047. }
  3048. .row .col.offset-m8 {
  3049. margin-left: 66.6666666667%;
  3050. }
  3051. .row .col.pull-m8 {
  3052. right: 66.6666666667%;
  3053. }
  3054. .row .col.push-m8 {
  3055. left: 66.6666666667%;
  3056. }
  3057. .row .col.offset-m9 {
  3058. margin-left: 75%;
  3059. }
  3060. .row .col.pull-m9 {
  3061. right: 75%;
  3062. }
  3063. .row .col.push-m9 {
  3064. left: 75%;
  3065. }
  3066. .row .col.offset-m10 {
  3067. margin-left: 83.3333333333%;
  3068. }
  3069. .row .col.pull-m10 {
  3070. right: 83.3333333333%;
  3071. }
  3072. .row .col.push-m10 {
  3073. left: 83.3333333333%;
  3074. }
  3075. .row .col.offset-m11 {
  3076. margin-left: 91.6666666667%;
  3077. }
  3078. .row .col.pull-m11 {
  3079. right: 91.6666666667%;
  3080. }
  3081. .row .col.push-m11 {
  3082. left: 91.6666666667%;
  3083. }
  3084. .row .col.offset-m12 {
  3085. margin-left: 100%;
  3086. }
  3087. .row .col.pull-m12 {
  3088. right: 100%;
  3089. }
  3090. .row .col.push-m12 {
  3091. left: 100%;
  3092. }
  3093. }
  3094. @media only screen and (min-width: 993px) {
  3095. .row .col.l1 {
  3096. width: 8.3333333333%;
  3097. margin-left: auto;
  3098. left: auto;
  3099. right: auto;
  3100. }
  3101. .row .col.l2 {
  3102. width: 16.6666666667%;
  3103. margin-left: auto;
  3104. left: auto;
  3105. right: auto;
  3106. }
  3107. .row .col.l3 {
  3108. width: 25%;
  3109. margin-left: auto;
  3110. left: auto;
  3111. right: auto;
  3112. }
  3113. .row .col.l4 {
  3114. width: 33.3333333333%;
  3115. margin-left: auto;
  3116. left: auto;
  3117. right: auto;
  3118. }
  3119. .row .col.l5 {
  3120. width: 41.6666666667%;
  3121. margin-left: auto;
  3122. left: auto;
  3123. right: auto;
  3124. }
  3125. .row .col.l6 {
  3126. width: 50%;
  3127. margin-left: auto;
  3128. left: auto;
  3129. right: auto;
  3130. }
  3131. .row .col.l7 {
  3132. width: 58.3333333333%;
  3133. margin-left: auto;
  3134. left: auto;
  3135. right: auto;
  3136. }
  3137. .row .col.l8 {
  3138. width: 66.6666666667%;
  3139. margin-left: auto;
  3140. left: auto;
  3141. right: auto;
  3142. }
  3143. .row .col.l9 {
  3144. width: 75%;
  3145. margin-left: auto;
  3146. left: auto;
  3147. right: auto;
  3148. }
  3149. .row .col.l10 {
  3150. width: 83.3333333333%;
  3151. margin-left: auto;
  3152. left: auto;
  3153. right: auto;
  3154. }
  3155. .row .col.l11 {
  3156. width: 91.6666666667%;
  3157. margin-left: auto;
  3158. left: auto;
  3159. right: auto;
  3160. }
  3161. .row .col.l12 {
  3162. width: 100%;
  3163. margin-left: auto;
  3164. left: auto;
  3165. right: auto;
  3166. }
  3167. .row .col.offset-l1 {
  3168. margin-left: 8.3333333333%;
  3169. }
  3170. .row .col.pull-l1 {
  3171. right: 8.3333333333%;
  3172. }
  3173. .row .col.push-l1 {
  3174. left: 8.3333333333%;
  3175. }
  3176. .row .col.offset-l2 {
  3177. margin-left: 16.6666666667%;
  3178. }
  3179. .row .col.pull-l2 {
  3180. right: 16.6666666667%;
  3181. }
  3182. .row .col.push-l2 {
  3183. left: 16.6666666667%;
  3184. }
  3185. .row .col.offset-l3 {
  3186. margin-left: 25%;
  3187. }
  3188. .row .col.pull-l3 {
  3189. right: 25%;
  3190. }
  3191. .row .col.push-l3 {
  3192. left: 25%;
  3193. }
  3194. .row .col.offset-l4 {
  3195. margin-left: 33.3333333333%;
  3196. }
  3197. .row .col.pull-l4 {
  3198. right: 33.3333333333%;
  3199. }
  3200. .row .col.push-l4 {
  3201. left: 33.3333333333%;
  3202. }
  3203. .row .col.offset-l5 {
  3204. margin-left: 41.6666666667%;
  3205. }
  3206. .row .col.pull-l5 {
  3207. right: 41.6666666667%;
  3208. }
  3209. .row .col.push-l5 {
  3210. left: 41.6666666667%;
  3211. }
  3212. .row .col.offset-l6 {
  3213. margin-left: 50%;
  3214. }
  3215. .row .col.pull-l6 {
  3216. right: 50%;
  3217. }
  3218. .row .col.push-l6 {
  3219. left: 50%;
  3220. }
  3221. .row .col.offset-l7 {
  3222. margin-left: 58.3333333333%;
  3223. }
  3224. .row .col.pull-l7 {
  3225. right: 58.3333333333%;
  3226. }
  3227. .row .col.push-l7 {
  3228. left: 58.3333333333%;
  3229. }
  3230. .row .col.offset-l8 {
  3231. margin-left: 66.6666666667%;
  3232. }
  3233. .row .col.pull-l8 {
  3234. right: 66.6666666667%;
  3235. }
  3236. .row .col.push-l8 {
  3237. left: 66.6666666667%;
  3238. }
  3239. .row .col.offset-l9 {
  3240. margin-left: 75%;
  3241. }
  3242. .row .col.pull-l9 {
  3243. right: 75%;
  3244. }
  3245. .row .col.push-l9 {
  3246. left: 75%;
  3247. }
  3248. .row .col.offset-l10 {
  3249. margin-left: 83.3333333333%;
  3250. }
  3251. .row .col.pull-l10 {
  3252. right: 83.3333333333%;
  3253. }
  3254. .row .col.push-l10 {
  3255. left: 83.3333333333%;
  3256. }
  3257. .row .col.offset-l11 {
  3258. margin-left: 91.6666666667%;
  3259. }
  3260. .row .col.pull-l11 {
  3261. right: 91.6666666667%;
  3262. }
  3263. .row .col.push-l11 {
  3264. left: 91.6666666667%;
  3265. }
  3266. .row .col.offset-l12 {
  3267. margin-left: 100%;
  3268. }
  3269. .row .col.pull-l12 {
  3270. right: 100%;
  3271. }
  3272. .row .col.push-l12 {
  3273. left: 100%;
  3274. }
  3275. }
  3276. @media only screen and (min-width: 1201px) {
  3277. .row .col.xl1 {
  3278. width: 8.3333333333%;
  3279. margin-left: auto;
  3280. left: auto;
  3281. right: auto;
  3282. }
  3283. .row .col.xl2 {
  3284. width: 16.6666666667%;
  3285. margin-left: auto;
  3286. left: auto;
  3287. right: auto;
  3288. }
  3289. .row .col.xl3 {
  3290. width: 25%;
  3291. margin-left: auto;
  3292. left: auto;
  3293. right: auto;
  3294. }
  3295. .row .col.xl4 {
  3296. width: 33.3333333333%;
  3297. margin-left: auto;
  3298. left: auto;
  3299. right: auto;
  3300. }
  3301. .row .col.xl5 {
  3302. width: 41.6666666667%;
  3303. margin-left: auto;
  3304. left: auto;
  3305. right: auto;
  3306. }
  3307. .row .col.xl6 {
  3308. width: 50%;
  3309. margin-left: auto;
  3310. left: auto;
  3311. right: auto;
  3312. }
  3313. .row .col.xl7 {
  3314. width: 58.3333333333%;
  3315. margin-left: auto;
  3316. left: auto;
  3317. right: auto;
  3318. }
  3319. .row .col.xl8 {
  3320. width: 66.6666666667%;
  3321. margin-left: auto;
  3322. left: auto;
  3323. right: auto;
  3324. }
  3325. .row .col.xl9 {
  3326. width: 75%;
  3327. margin-left: auto;
  3328. left: auto;
  3329. right: auto;
  3330. }
  3331. .row .col.xl10 {
  3332. width: 83.3333333333%;
  3333. margin-left: auto;
  3334. left: auto;
  3335. right: auto;
  3336. }
  3337. .row .col.xl11 {
  3338. width: 91.6666666667%;
  3339. margin-left: auto;
  3340. left: auto;
  3341. right: auto;
  3342. }
  3343. .row .col.xl12 {
  3344. width: 100%;
  3345. margin-left: auto;
  3346. left: auto;
  3347. right: auto;
  3348. }
  3349. .row .col.offset-xl1 {
  3350. margin-left: 8.3333333333%;
  3351. }
  3352. .row .col.pull-xl1 {
  3353. right: 8.3333333333%;
  3354. }
  3355. .row .col.push-xl1 {
  3356. left: 8.3333333333%;
  3357. }
  3358. .row .col.offset-xl2 {
  3359. margin-left: 16.6666666667%;
  3360. }
  3361. .row .col.pull-xl2 {
  3362. right: 16.6666666667%;
  3363. }
  3364. .row .col.push-xl2 {
  3365. left: 16.6666666667%;
  3366. }
  3367. .row .col.offset-xl3 {
  3368. margin-left: 25%;
  3369. }
  3370. .row .col.pull-xl3 {
  3371. right: 25%;
  3372. }
  3373. .row .col.push-xl3 {
  3374. left: 25%;
  3375. }
  3376. .row .col.offset-xl4 {
  3377. margin-left: 33.3333333333%;
  3378. }
  3379. .row .col.pull-xl4 {
  3380. right: 33.3333333333%;
  3381. }
  3382. .row .col.push-xl4 {
  3383. left: 33.3333333333%;
  3384. }
  3385. .row .col.offset-xl5 {
  3386. margin-left: 41.6666666667%;
  3387. }
  3388. .row .col.pull-xl5 {
  3389. right: 41.6666666667%;
  3390. }
  3391. .row .col.push-xl5 {
  3392. left: 41.6666666667%;
  3393. }
  3394. .row .col.offset-xl6 {
  3395. margin-left: 50%;
  3396. }
  3397. .row .col.pull-xl6 {
  3398. right: 50%;
  3399. }
  3400. .row .col.push-xl6 {
  3401. left: 50%;
  3402. }
  3403. .row .col.offset-xl7 {
  3404. margin-left: 58.3333333333%;
  3405. }
  3406. .row .col.pull-xl7 {
  3407. right: 58.3333333333%;
  3408. }
  3409. .row .col.push-xl7 {
  3410. left: 58.3333333333%;
  3411. }
  3412. .row .col.offset-xl8 {
  3413. margin-left: 66.6666666667%;
  3414. }
  3415. .row .col.pull-xl8 {
  3416. right: 66.6666666667%;
  3417. }
  3418. .row .col.push-xl8 {
  3419. left: 66.6666666667%;
  3420. }
  3421. .row .col.offset-xl9 {
  3422. margin-left: 75%;
  3423. }
  3424. .row .col.pull-xl9 {
  3425. right: 75%;
  3426. }
  3427. .row .col.push-xl9 {
  3428. left: 75%;
  3429. }
  3430. .row .col.offset-xl10 {
  3431. margin-left: 83.3333333333%;
  3432. }
  3433. .row .col.pull-xl10 {
  3434. right: 83.3333333333%;
  3435. }
  3436. .row .col.push-xl10 {
  3437. left: 83.3333333333%;
  3438. }
  3439. .row .col.offset-xl11 {
  3440. margin-left: 91.6666666667%;
  3441. }
  3442. .row .col.pull-xl11 {
  3443. right: 91.6666666667%;
  3444. }
  3445. .row .col.push-xl11 {
  3446. left: 91.6666666667%;
  3447. }
  3448. .row .col.offset-xl12 {
  3449. margin-left: 100%;
  3450. }
  3451. .row .col.pull-xl12 {
  3452. right: 100%;
  3453. }
  3454. .row .col.push-xl12 {
  3455. left: 100%;
  3456. }
  3457. }
  3458. nav {
  3459. color: #fff;
  3460. background-color: #ee6e73;
  3461. width: 100%;
  3462. height: 56px;
  3463. line-height: 56px;
  3464. }
  3465. nav.nav-extended {
  3466. height: auto;
  3467. }
  3468. nav.nav-extended .nav-wrapper {
  3469. min-height: 56px;
  3470. height: auto;
  3471. }
  3472. nav.nav-extended .nav-content {
  3473. position: relative;
  3474. line-height: normal;
  3475. }
  3476. nav a {
  3477. color: #fff;
  3478. }
  3479. nav i,
  3480. nav [class^="mdi-"], nav [class*="mdi-"],
  3481. nav i.material-icons {
  3482. display: block;
  3483. font-size: 24px;
  3484. height: 56px;
  3485. line-height: 56px;
  3486. }
  3487. nav .nav-wrapper {
  3488. position: relative;
  3489. height: 100%;
  3490. }
  3491. @media only screen and (min-width: 993px) {
  3492. nav a.button-collapse {
  3493. display: none;
  3494. }
  3495. }
  3496. nav .button-collapse {
  3497. float: left;
  3498. position: relative;
  3499. z-index: 1;
  3500. height: 56px;
  3501. margin: 0 18px;
  3502. }
  3503. nav .button-collapse i {
  3504. height: 56px;
  3505. line-height: 56px;
  3506. }
  3507. nav .brand-logo {
  3508. position: absolute;
  3509. color: #fff;
  3510. display: inline-block;
  3511. font-size: 2.1rem;
  3512. padding: 0;
  3513. white-space: nowrap;
  3514. }
  3515. nav .brand-logo.center {
  3516. left: 50%;
  3517. -webkit-transform: translateX(-50%);
  3518. transform: translateX(-50%);
  3519. }
  3520. @media only screen and (max-width: 992px) {
  3521. nav .brand-logo {
  3522. left: 50%;
  3523. -webkit-transform: translateX(-50%);
  3524. transform: translateX(-50%);
  3525. }
  3526. nav .brand-logo.left, nav .brand-logo.right {
  3527. padding: 0;
  3528. -webkit-transform: none;
  3529. transform: none;
  3530. }
  3531. nav .brand-logo.left {
  3532. left: 0.5rem;
  3533. }
  3534. nav .brand-logo.right {
  3535. right: 0.5rem;
  3536. left: auto;
  3537. }
  3538. }
  3539. nav .brand-logo.right {
  3540. right: 0.5rem;
  3541. padding: 0;
  3542. }
  3543. nav .brand-logo i,
  3544. nav .brand-logo [class^="mdi-"], nav .brand-logo [class*="mdi-"],
  3545. nav .brand-logo i.material-icons {
  3546. float: left;
  3547. margin-right: 15px;
  3548. }
  3549. nav .nav-title {
  3550. display: inline-block;
  3551. font-size: 32px;
  3552. padding: 28px 0;
  3553. }
  3554. nav ul {
  3555. margin: 0;
  3556. }
  3557. nav ul li {
  3558. -webkit-transition: background-color .3s;
  3559. transition: background-color .3s;
  3560. float: left;
  3561. padding: 0;
  3562. }
  3563. nav ul li.active {
  3564. background-color: rgba(0, 0, 0, 0.1);
  3565. }
  3566. nav ul a {
  3567. -webkit-transition: background-color .3s;
  3568. transition: background-color .3s;
  3569. font-size: 1rem;
  3570. color: #fff;
  3571. display: block;
  3572. padding: 0 15px;
  3573. cursor: pointer;
  3574. }
  3575. nav ul a.btn, nav ul a.btn-large, nav ul a.btn-large, nav ul a.btn-flat, nav ul a.btn-floating {
  3576. margin-top: -2px;
  3577. margin-left: 15px;
  3578. margin-right: 15px;
  3579. }
  3580. nav ul a.btn > .material-icons, nav ul a.btn-large > .material-icons, nav ul a.btn-large > .material-icons, nav ul a.btn-flat > .material-icons, nav ul a.btn-floating > .material-icons {
  3581. height: inherit;
  3582. line-height: inherit;
  3583. }
  3584. nav ul a:hover {
  3585. background-color: rgba(0, 0, 0, 0.1);
  3586. }
  3587. nav ul.left {
  3588. float: left;
  3589. }
  3590. nav form {
  3591. height: 100%;
  3592. }
  3593. nav .input-field {
  3594. margin: 0;
  3595. height: 100%;
  3596. }
  3597. nav .input-field input {
  3598. height: 100%;
  3599. font-size: 1.2rem;
  3600. border: none;
  3601. padding-left: 2rem;
  3602. }
  3603. nav .input-field input:focus, nav .input-field input[type=text]:valid, nav .input-field input[type=password]:valid, nav .input-field input[type=email]:valid, nav .input-field input[type=url]:valid, nav .input-field input[type=date]:valid {
  3604. border: none;
  3605. -webkit-box-shadow: none;
  3606. box-shadow: none;
  3607. }
  3608. nav .input-field label {
  3609. top: 0;
  3610. left: 0;
  3611. }
  3612. nav .input-field label i {
  3613. color: rgba(255, 255, 255, 0.7);
  3614. -webkit-transition: color .3s;
  3615. transition: color .3s;
  3616. }
  3617. nav .input-field label.active i {
  3618. color: #fff;
  3619. }
  3620. .navbar-fixed {
  3621. position: relative;
  3622. height: 56px;
  3623. z-index: 997;
  3624. }
  3625. .navbar-fixed nav {
  3626. position: fixed;
  3627. }
  3628. @media only screen and (min-width: 601px) {
  3629. nav.nav-extended .nav-wrapper {
  3630. min-height: 64px;
  3631. }
  3632. nav, nav .nav-wrapper i, nav a.button-collapse, nav a.button-collapse i {
  3633. height: 64px;
  3634. line-height: 64px;
  3635. }
  3636. .navbar-fixed {
  3637. height: 64px;
  3638. }
  3639. }
  3640. @font-face {
  3641. font-family: "Roboto";
  3642. src: local(Roboto Thin), url("../fonts/roboto/Roboto-Thin.woff2") format("woff2"), url("../fonts/roboto/Roboto-Thin.woff") format("woff");
  3643. font-weight: 100;
  3644. }
  3645. @font-face {
  3646. font-family: "Roboto";
  3647. src: local(Roboto Light), url("../fonts/roboto/Roboto-Light.woff2") format("woff2"), url("../fonts/roboto/Roboto-Light.woff") format("woff");
  3648. font-weight: 300;
  3649. }
  3650. @font-face {
  3651. font-family: "Roboto";
  3652. src: local(Roboto Regular), url("../fonts/roboto/Roboto-Regular.woff2") format("woff2"), url("../fonts/roboto/Roboto-Regular.woff") format("woff");
  3653. font-weight: 400;
  3654. }
  3655. @font-face {
  3656. font-family: "Roboto";
  3657. src: local(Roboto Medium), url("../fonts/roboto/Roboto-Medium.woff2") format("woff2"), url("../fonts/roboto/Roboto-Medium.woff") format("woff");
  3658. font-weight: 500;
  3659. }
  3660. @font-face {
  3661. font-family: "Roboto";
  3662. src: local(Roboto Bold), url("../fonts/roboto/Roboto-Bold.woff2") format("woff2"), url("../fonts/roboto/Roboto-Bold.woff") format("woff");
  3663. font-weight: 700;
  3664. }
  3665. a {
  3666. text-decoration: none;
  3667. }
  3668. html {
  3669. line-height: 1.5;
  3670. font-family: "Roboto", sans-serif;
  3671. font-weight: normal;
  3672. color: rgba(0, 0, 0, 0.87);
  3673. }
  3674. @media only screen and (min-width: 0) {
  3675. html {
  3676. font-size: 14px;
  3677. }
  3678. }
  3679. @media only screen and (min-width: 992px) {
  3680. html {
  3681. font-size: 14.5px;
  3682. }
  3683. }
  3684. @media only screen and (min-width: 1200px) {
  3685. html {
  3686. font-size: 15px;
  3687. }
  3688. }
  3689. h1, h2, h3, h4, h5, h6 {
  3690. font-weight: 400;
  3691. line-height: 1.1;
  3692. }
  3693. h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  3694. font-weight: inherit;
  3695. }
  3696. h1 {
  3697. font-size: 4.2rem;
  3698. line-height: 110%;
  3699. margin: 2.1rem 0 1.68rem 0;
  3700. }
  3701. h2 {
  3702. font-size: 3.56rem;
  3703. line-height: 110%;
  3704. margin: 1.78rem 0 1.424rem 0;
  3705. }
  3706. h3 {
  3707. font-size: 2.92rem;
  3708. line-height: 110%;
  3709. margin: 1.46rem 0 1.168rem 0;
  3710. }
  3711. h4 {
  3712. font-size: 2.28rem;
  3713. line-height: 110%;
  3714. margin: 1.14rem 0 0.912rem 0;
  3715. }
  3716. h5 {
  3717. font-size: 1.64rem;
  3718. line-height: 110%;
  3719. margin: 0.82rem 0 0.656rem 0;
  3720. }
  3721. h6 {
  3722. font-size: 1rem;
  3723. line-height: 110%;
  3724. margin: 0.5rem 0 0.4rem 0;
  3725. }
  3726. em {
  3727. font-style: italic;
  3728. }
  3729. strong {
  3730. font-weight: 500;
  3731. }
  3732. small {
  3733. font-size: 75%;
  3734. }
  3735. .light, .page-footer .footer-copyright {
  3736. font-weight: 300;
  3737. }
  3738. .thin {
  3739. font-weight: 200;
  3740. }
  3741. .flow-text {
  3742. font-weight: 300;
  3743. }
  3744. @media only screen and (min-width: 360px) {
  3745. .flow-text {
  3746. font-size: 1.2rem;
  3747. }
  3748. }
  3749. @media only screen and (min-width: 390px) {
  3750. .flow-text {
  3751. font-size: 1.224rem;
  3752. }
  3753. }
  3754. @media only screen and (min-width: 420px) {
  3755. .flow-text {
  3756. font-size: 1.248rem;
  3757. }
  3758. }
  3759. @media only screen and (min-width: 450px) {
  3760. .flow-text {
  3761. font-size: 1.272rem;
  3762. }
  3763. }
  3764. @media only screen and (min-width: 480px) {
  3765. .flow-text {
  3766. font-size: 1.296rem;
  3767. }
  3768. }
  3769. @media only screen and (min-width: 510px) {
  3770. .flow-text {
  3771. font-size: 1.32rem;
  3772. }
  3773. }
  3774. @media only screen and (min-width: 540px) {
  3775. .flow-text {
  3776. font-size: 1.344rem;
  3777. }
  3778. }
  3779. @media only screen and (min-width: 570px) {
  3780. .flow-text {
  3781. font-size: 1.368rem;
  3782. }
  3783. }
  3784. @media only screen and (min-width: 600px) {
  3785. .flow-text {
  3786. font-size: 1.392rem;
  3787. }
  3788. }
  3789. @media only screen and (min-width: 630px) {
  3790. .flow-text {
  3791. font-size: 1.416rem;
  3792. }
  3793. }
  3794. @media only screen and (min-width: 660px) {
  3795. .flow-text {
  3796. font-size: 1.44rem;
  3797. }
  3798. }
  3799. @media only screen and (min-width: 690px) {
  3800. .flow-text {
  3801. font-size: 1.464rem;
  3802. }
  3803. }
  3804. @media only screen and (min-width: 720px) {
  3805. .flow-text {
  3806. font-size: 1.488rem;
  3807. }
  3808. }
  3809. @media only screen and (min-width: 750px) {
  3810. .flow-text {
  3811. font-size: 1.512rem;
  3812. }
  3813. }
  3814. @media only screen and (min-width: 780px) {
  3815. .flow-text {
  3816. font-size: 1.536rem;
  3817. }
  3818. }
  3819. @media only screen and (min-width: 810px) {
  3820. .flow-text {
  3821. font-size: 1.56rem;
  3822. }
  3823. }
  3824. @media only screen and (min-width: 840px) {
  3825. .flow-text {
  3826. font-size: 1.584rem;
  3827. }
  3828. }
  3829. @media only screen and (min-width: 870px) {
  3830. .flow-text {
  3831. font-size: 1.608rem;
  3832. }
  3833. }
  3834. @media only screen and (min-width: 900px) {
  3835. .flow-text {
  3836. font-size: 1.632rem;
  3837. }
  3838. }
  3839. @media only screen and (min-width: 930px) {
  3840. .flow-text {
  3841. font-size: 1.656rem;
  3842. }
  3843. }
  3844. @media only screen and (min-width: 960px) {
  3845. .flow-text {
  3846. font-size: 1.68rem;
  3847. }
  3848. }
  3849. @media only screen and (max-width: 360px) {
  3850. .flow-text {
  3851. font-size: 1.2rem;
  3852. }
  3853. }
  3854. .scale-transition {
  3855. -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  3856. transition: -webkit-transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  3857. transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  3858. transition: transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63), -webkit-transform 0.3s cubic-bezier(0.53, 0.01, 0.36, 1.63) !important;
  3859. }
  3860. .scale-transition.scale-out {
  3861. -webkit-transform: scale(0);
  3862. transform: scale(0);
  3863. -webkit-transition: -webkit-transform .2s !important;
  3864. transition: -webkit-transform .2s !important;
  3865. transition: transform .2s !important;
  3866. transition: transform .2s, -webkit-transform .2s !important;
  3867. }
  3868. .scale-transition.scale-in {
  3869. -webkit-transform: scale(1);
  3870. transform: scale(1);
  3871. }
  3872. .card-panel {
  3873. -webkit-transition: -webkit-box-shadow .25s;
  3874. transition: -webkit-box-shadow .25s;
  3875. transition: box-shadow .25s;
  3876. transition: box-shadow .25s, -webkit-box-shadow .25s;
  3877. padding: 24px;
  3878. margin: 0.5rem 0 1rem 0;
  3879. border-radius: 2px;
  3880. background-color: #fff;
  3881. }
  3882. .card {
  3883. position: relative;
  3884. margin: 0.5rem 0 1rem 0;
  3885. background-color: #fff;
  3886. -webkit-transition: -webkit-box-shadow .25s;
  3887. transition: -webkit-box-shadow .25s;
  3888. transition: box-shadow .25s;
  3889. transition: box-shadow .25s, -webkit-box-shadow .25s;
  3890. border-radius: 2px;
  3891. }
  3892. .card .card-title {
  3893. font-size: 24px;
  3894. font-weight: 300;
  3895. }
  3896. .card .card-title.activator {
  3897. cursor: pointer;
  3898. }
  3899. .card.small, .card.medium, .card.large {
  3900. position: relative;
  3901. }
  3902. .card.small .card-image, .card.medium .card-image, .card.large .card-image {
  3903. max-height: 60%;
  3904. overflow: hidden;
  3905. }
  3906. .card.small .card-image + .card-content, .card.medium .card-image + .card-content, .card.large .card-image + .card-content {
  3907. max-height: 40%;
  3908. }
  3909. .card.small .card-content, .card.medium .card-content, .card.large .card-content {
  3910. max-height: 100%;
  3911. overflow: hidden;
  3912. }
  3913. .card.small .card-action, .card.medium .card-action, .card.large .card-action {
  3914. position: absolute;
  3915. bottom: 0;
  3916. left: 0;
  3917. right: 0;
  3918. }
  3919. .card.small {
  3920. height: 300px;
  3921. }
  3922. .card.medium {
  3923. height: 400px;
  3924. }
  3925. .card.large {
  3926. height: 500px;
  3927. }
  3928. .card.horizontal {
  3929. display: -webkit-box;
  3930. display: -webkit-flex;
  3931. display: -ms-flexbox;
  3932. display: flex;
  3933. }
  3934. .card.horizontal.small .card-image, .card.horizontal.medium .card-image, .card.horizontal.large .card-image {
  3935. height: 100%;
  3936. max-height: none;
  3937. overflow: visible;
  3938. }
  3939. .card.horizontal.small .card-image img, .card.horizontal.medium .card-image img, .card.horizontal.large .card-image img {
  3940. height: 100%;
  3941. }
  3942. .card.horizontal .card-image {
  3943. max-width: 50%;
  3944. }
  3945. .card.horizontal .card-image img {
  3946. border-radius: 2px 0 0 2px;
  3947. max-width: 100%;
  3948. width: auto;
  3949. }
  3950. .card.horizontal .card-stacked {
  3951. display: -webkit-box;
  3952. display: -webkit-flex;
  3953. display: -ms-flexbox;
  3954. display: flex;
  3955. -webkit-box-orient: vertical;
  3956. -webkit-box-direction: normal;
  3957. -webkit-flex-direction: column;
  3958. -ms-flex-direction: column;
  3959. flex-direction: column;
  3960. -webkit-box-flex: 1;
  3961. -webkit-flex: 1;
  3962. -ms-flex: 1;
  3963. flex: 1;
  3964. position: relative;
  3965. }
  3966. .card.horizontal .card-stacked .card-content {
  3967. -webkit-box-flex: 1;
  3968. -webkit-flex-grow: 1;
  3969. -ms-flex-positive: 1;
  3970. flex-grow: 1;
  3971. }
  3972. .card.sticky-action .card-action {
  3973. z-index: 2;
  3974. }
  3975. .card.sticky-action .card-reveal {
  3976. z-index: 1;
  3977. padding-bottom: 64px;
  3978. }
  3979. .card .card-image {
  3980. position: relative;
  3981. }
  3982. .card .card-image img {
  3983. display: block;
  3984. border-radius: 2px 2px 0 0;
  3985. position: relative;
  3986. left: 0;
  3987. right: 0;
  3988. top: 0;
  3989. bottom: 0;
  3990. width: 100%;
  3991. }
  3992. .card .card-image .card-title {
  3993. color: #fff;
  3994. position: absolute;
  3995. bottom: 0;
  3996. left: 0;
  3997. max-width: 100%;
  3998. padding: 24px;
  3999. }
  4000. .card .card-content {
  4001. padding: 24px;
  4002. border-radius: 0 0 2px 2px;
  4003. }
  4004. .card .card-content p {
  4005. margin: 0;
  4006. color: inherit;
  4007. }
  4008. .card .card-content .card-title {
  4009. display: block;
  4010. line-height: 32px;
  4011. margin-bottom: 8px;
  4012. }
  4013. .card .card-content .card-title i {
  4014. line-height: 32px;
  4015. }
  4016. .card .card-action {
  4017. position: relative;
  4018. background-color: inherit;
  4019. border-top: 1px solid rgba(160, 160, 160, 0.2);
  4020. padding: 16px 24px;
  4021. }
  4022. .card .card-action:last-child {
  4023. border-radius: 0 0 2px 2px;
  4024. }
  4025. .card .card-action a:not(.btn):not(.btn-large):not(.btn-large):not(.btn-floating) {
  4026. color: #ffab40;
  4027. margin-right: 24px;
  4028. -webkit-transition: color .3s ease;
  4029. transition: color .3s ease;
  4030. text-transform: uppercase;
  4031. }
  4032. .card .card-action a:not(.btn):not(.btn-large):not(.btn-large):not(.btn-floating):hover {
  4033. color: #ffd8a6;
  4034. }
  4035. .card .card-reveal {
  4036. padding: 24px;
  4037. position: absolute;
  4038. background-color: #fff;
  4039. width: 100%;
  4040. overflow-y: auto;
  4041. left: 0;
  4042. top: 100%;
  4043. height: 100%;
  4044. z-index: 3;
  4045. display: none;
  4046. }
  4047. .card .card-reveal .card-title {
  4048. cursor: pointer;
  4049. display: block;
  4050. }
  4051. #toast-container {
  4052. display: block;
  4053. position: fixed;
  4054. z-index: 10000;
  4055. }
  4056. @media only screen and (max-width: 600px) {
  4057. #toast-container {
  4058. min-width: 100%;
  4059. bottom: 0%;
  4060. }
  4061. }
  4062. @media only screen and (min-width: 601px) and (max-width: 992px) {
  4063. #toast-container {
  4064. left: 5%;
  4065. bottom: 7%;
  4066. max-width: 90%;
  4067. }
  4068. }
  4069. @media only screen and (min-width: 993px) {
  4070. #toast-container {
  4071. top: 10%;
  4072. right: 7%;
  4073. max-width: 86%;
  4074. }
  4075. }
  4076. .toast {
  4077. border-radius: 2px;
  4078. top: 35px;
  4079. width: auto;
  4080. clear: both;
  4081. margin-top: 10px;
  4082. position: relative;
  4083. max-width: 100%;
  4084. height: auto;
  4085. min-height: 48px;
  4086. line-height: 1.5em;
  4087. word-break: break-all;
  4088. background-color: #323232;
  4089. padding: 10px 25px;
  4090. font-size: 1.1rem;
  4091. font-weight: 300;
  4092. color: #fff;
  4093. display: -webkit-box;
  4094. display: -webkit-flex;
  4095. display: -ms-flexbox;
  4096. display: flex;
  4097. -webkit-box-align: center;
  4098. -webkit-align-items: center;
  4099. -ms-flex-align: center;
  4100. align-items: center;
  4101. -webkit-box-pack: justify;
  4102. -webkit-justify-content: space-between;
  4103. -ms-flex-pack: justify;
  4104. justify-content: space-between;
  4105. }
  4106. .toast .btn, .toast .btn-large, .toast .btn-flat {
  4107. margin: 0;
  4108. margin-left: 3rem;
  4109. }
  4110. .toast.rounded {
  4111. border-radius: 24px;
  4112. }
  4113. @media only screen and (max-width: 600px) {
  4114. .toast {
  4115. width: 100%;
  4116. border-radius: 0;
  4117. }
  4118. }
  4119. @media only screen and (min-width: 601px) and (max-width: 992px) {
  4120. .toast {
  4121. float: left;
  4122. }
  4123. }
  4124. @media only screen and (min-width: 993px) {
  4125. .toast {
  4126. float: right;
  4127. }
  4128. }
  4129. .tabs {
  4130. position: relative;
  4131. overflow-x: auto;
  4132. overflow-y: hidden;
  4133. height: 48px;
  4134. width: 100%;
  4135. background-color: #fff;
  4136. margin: 0 auto;
  4137. white-space: nowrap;
  4138. }
  4139. .tabs.tabs-transparent {
  4140. background-color: transparent;
  4141. }
  4142. .tabs.tabs-transparent .tab a,
  4143. .tabs.tabs-transparent .tab.disabled a,
  4144. .tabs.tabs-transparent .tab.disabled a:hover {
  4145. color: rgba(255, 255, 255, 0.7);
  4146. }
  4147. .tabs.tabs-transparent .tab a:hover,
  4148. .tabs.tabs-transparent .tab a.active {
  4149. color: #fff;
  4150. }
  4151. .tabs.tabs-transparent .indicator {
  4152. background-color: #fff;
  4153. }
  4154. .tabs.tabs-fixed-width {
  4155. display: -webkit-box;
  4156. display: -webkit-flex;
  4157. display: -ms-flexbox;
  4158. display: flex;
  4159. }
  4160. .tabs.tabs-fixed-width .tab {
  4161. -webkit-box-flex: 1;
  4162. -webkit-flex-grow: 1;
  4163. -ms-flex-positive: 1;
  4164. flex-grow: 1;
  4165. }
  4166. .tabs .tab {
  4167. display: inline-block;
  4168. text-align: center;
  4169. line-height: 48px;
  4170. height: 48px;
  4171. padding: 0;
  4172. margin: 0;
  4173. text-transform: uppercase;
  4174. }
  4175. .tabs .tab a {
  4176. color: rgba(238, 110, 115, 0.7);
  4177. display: block;
  4178. width: 100%;
  4179. height: 100%;
  4180. padding: 0 24px;
  4181. font-size: 14px;
  4182. text-overflow: ellipsis;
  4183. overflow: hidden;
  4184. -webkit-transition: color .28s ease;
  4185. transition: color .28s ease;
  4186. }
  4187. .tabs .tab a:hover, .tabs .tab a.active {
  4188. background-color: transparent;
  4189. color: #ee6e73;
  4190. }
  4191. .tabs .tab.disabled a,
  4192. .tabs .tab.disabled a:hover {
  4193. color: rgba(238, 110, 115, 0.7);
  4194. cursor: default;
  4195. }
  4196. .tabs .indicator {
  4197. position: absolute;
  4198. bottom: 0;
  4199. height: 2px;
  4200. background-color: #f6b2b5;
  4201. will-change: left, right;
  4202. }
  4203. @media only screen and (max-width: 992px) {
  4204. .tabs {
  4205. display: -webkit-box;
  4206. display: -webkit-flex;
  4207. display: -ms-flexbox;
  4208. display: flex;
  4209. }
  4210. .tabs .tab {
  4211. -webkit-box-flex: 1;
  4212. -webkit-flex-grow: 1;
  4213. -ms-flex-positive: 1;
  4214. flex-grow: 1;
  4215. }
  4216. .tabs .tab a {
  4217. padding: 0 12px;
  4218. }
  4219. }
  4220. .material-tooltip {
  4221. padding: 10px 8px;
  4222. font-size: 1rem;
  4223. z-index: 2000;
  4224. background-color: transparent;
  4225. border-radius: 2px;
  4226. color: #fff;
  4227. min-height: 36px;
  4228. line-height: 120%;
  4229. opacity: 0;
  4230. position: absolute;
  4231. text-align: center;
  4232. max-width: calc(100% - 4px);
  4233. overflow: hidden;
  4234. left: 0;
  4235. top: 0;
  4236. pointer-events: none;
  4237. visibility: hidden;
  4238. }
  4239. .backdrop {
  4240. position: absolute;
  4241. opacity: 0;
  4242. height: 7px;
  4243. width: 14px;
  4244. border-radius: 0 0 50% 50%;
  4245. background-color: #323232;
  4246. z-index: -1;
  4247. -webkit-transform-origin: 50% 0%;
  4248. transform-origin: 50% 0%;
  4249. visibility: hidden;
  4250. }
  4251. .btn, .btn-large,
  4252. .btn-flat {
  4253. border: none;
  4254. border-radius: 2px;
  4255. display: inline-block;
  4256. height: 36px;
  4257. line-height: 36px;
  4258. padding: 0 2rem;
  4259. text-transform: uppercase;
  4260. vertical-align: middle;
  4261. -webkit-tap-highlight-color: transparent;
  4262. }
  4263. .btn.disabled, .disabled.btn-large,
  4264. .btn-floating.disabled,
  4265. .btn-large.disabled,
  4266. .btn-flat.disabled,
  4267. .btn:disabled,
  4268. .btn-large:disabled,
  4269. .btn-floating:disabled,
  4270. .btn-large:disabled,
  4271. .btn-flat:disabled,
  4272. .btn[disabled],
  4273. [disabled].btn-large,
  4274. .btn-floating[disabled],
  4275. .btn-large[disabled],
  4276. .btn-flat[disabled] {
  4277. pointer-events: none;
  4278. background-color: #DFDFDF !important;
  4279. -webkit-box-shadow: none;
  4280. box-shadow: none;
  4281. color: #9F9F9F !important;
  4282. cursor: default;
  4283. }
  4284. .btn.disabled:hover, .disabled.btn-large:hover,
  4285. .btn-floating.disabled:hover,
  4286. .btn-large.disabled:hover,
  4287. .btn-flat.disabled:hover,
  4288. .btn:disabled:hover,
  4289. .btn-large:disabled:hover,
  4290. .btn-floating:disabled:hover,
  4291. .btn-large:disabled:hover,
  4292. .btn-flat:disabled:hover,
  4293. .btn[disabled]:hover,
  4294. [disabled].btn-large:hover,
  4295. .btn-floating[disabled]:hover,
  4296. .btn-large[disabled]:hover,
  4297. .btn-flat[disabled]:hover {
  4298. background-color: #DFDFDF !important;
  4299. color: #9F9F9F !important;
  4300. }
  4301. .btn, .btn-large,
  4302. .btn-floating,
  4303. .btn-large,
  4304. .btn-flat {
  4305. font-size: 1rem;
  4306. outline: 0;
  4307. }
  4308. .btn i, .btn-large i,
  4309. .btn-floating i,
  4310. .btn-large i,
  4311. .btn-flat i {
  4312. font-size: 1.3rem;
  4313. line-height: inherit;
  4314. }
  4315. .btn:focus, .btn-large:focus,
  4316. .btn-floating:focus {
  4317. background-color: #1d7d74;
  4318. }
  4319. .btn, .btn-large {
  4320. text-decoration: none;
  4321. color: #fff;
  4322. background-color: #26a69a;
  4323. text-align: center;
  4324. letter-spacing: .5px;
  4325. -webkit-transition: .2s ease-out;
  4326. transition: .2s ease-out;
  4327. cursor: pointer;
  4328. }
  4329. .btn:hover, .btn-large:hover {
  4330. background-color: #2bbbad;
  4331. }
  4332. .btn-floating {
  4333. display: inline-block;
  4334. color: #fff;
  4335. position: relative;
  4336. overflow: hidden;
  4337. z-index: 1;
  4338. width: 40px;
  4339. height: 40px;
  4340. line-height: 40px;
  4341. padding: 0;
  4342. background-color: #26a69a;
  4343. border-radius: 50%;
  4344. -webkit-transition: .3s;
  4345. transition: .3s;
  4346. cursor: pointer;
  4347. vertical-align: middle;
  4348. }
  4349. .btn-floating:hover {
  4350. background-color: #26a69a;
  4351. }
  4352. .btn-floating:before {
  4353. border-radius: 0;
  4354. }
  4355. .btn-floating.btn-large {
  4356. width: 56px;
  4357. height: 56px;
  4358. }
  4359. .btn-floating.btn-large.halfway-fab {
  4360. bottom: -28px;
  4361. }
  4362. .btn-floating.btn-large i {
  4363. line-height: 56px;
  4364. }
  4365. .btn-floating.halfway-fab {
  4366. position: absolute;
  4367. right: 24px;
  4368. bottom: -20px;
  4369. }
  4370. .btn-floating.halfway-fab.left {
  4371. right: auto;
  4372. left: 24px;
  4373. }
  4374. .btn-floating i {
  4375. width: inherit;
  4376. display: inline-block;
  4377. text-align: center;
  4378. color: #fff;
  4379. font-size: 1.6rem;
  4380. line-height: 40px;
  4381. }
  4382. button.btn-floating {
  4383. border: none;
  4384. }
  4385. .fixed-action-btn {
  4386. position: fixed;
  4387. right: 23px;
  4388. bottom: 23px;
  4389. padding-top: 15px;
  4390. margin-bottom: 0;
  4391. z-index: 998;
  4392. }
  4393. .fixed-action-btn.active ul {
  4394. visibility: visible;
  4395. }
  4396. .fixed-action-btn.horizontal {
  4397. padding: 0 0 0 15px;
  4398. }
  4399. .fixed-action-btn.horizontal ul {
  4400. text-align: right;
  4401. right: 64px;
  4402. top: 50%;
  4403. -webkit-transform: translateY(-50%);
  4404. transform: translateY(-50%);
  4405. height: 100%;
  4406. left: auto;
  4407. width: 500px;
  4408. /*width 100% only goes to width of button container */
  4409. }
  4410. .fixed-action-btn.horizontal ul li {
  4411. display: inline-block;
  4412. margin: 15px 15px 0 0;
  4413. }
  4414. .fixed-action-btn.toolbar {
  4415. padding: 0;
  4416. height: 56px;
  4417. }
  4418. .fixed-action-btn.toolbar.active > a i {
  4419. opacity: 0;
  4420. }
  4421. .fixed-action-btn.toolbar ul {
  4422. display: -webkit-box;
  4423. display: -webkit-flex;
  4424. display: -ms-flexbox;
  4425. display: flex;
  4426. top: 0;
  4427. bottom: 0;
  4428. z-index: 1;
  4429. }
  4430. .fixed-action-btn.toolbar ul li {
  4431. -webkit-box-flex: 1;
  4432. -webkit-flex: 1;
  4433. -ms-flex: 1;
  4434. flex: 1;
  4435. display: inline-block;
  4436. margin: 0;
  4437. height: 100%;
  4438. -webkit-transition: none;
  4439. transition: none;
  4440. }
  4441. .fixed-action-btn.toolbar ul li a {
  4442. display: block;
  4443. overflow: hidden;
  4444. position: relative;
  4445. width: 100%;
  4446. height: 100%;
  4447. background-color: transparent;
  4448. -webkit-box-shadow: none;
  4449. box-shadow: none;
  4450. color: #fff;
  4451. line-height: 56px;
  4452. z-index: 1;
  4453. }
  4454. .fixed-action-btn.toolbar ul li a i {
  4455. line-height: inherit;
  4456. }
  4457. .fixed-action-btn ul {
  4458. left: 0;
  4459. right: 0;
  4460. text-align: center;
  4461. position: absolute;
  4462. bottom: 64px;
  4463. margin: 0;
  4464. visibility: hidden;
  4465. }
  4466. .fixed-action-btn ul li {
  4467. margin-bottom: 15px;
  4468. }
  4469. .fixed-action-btn ul a.btn-floating {
  4470. opacity: 0;
  4471. }
  4472. .fixed-action-btn .fab-backdrop {
  4473. position: absolute;
  4474. top: 0;
  4475. left: 0;
  4476. z-index: -1;
  4477. width: 40px;
  4478. height: 40px;
  4479. background-color: #26a69a;
  4480. border-radius: 50%;
  4481. -webkit-transform: scale(0);
  4482. transform: scale(0);
  4483. }
  4484. .btn-flat {
  4485. -webkit-box-shadow: none;
  4486. box-shadow: none;
  4487. background-color: transparent;
  4488. color: #343434;
  4489. cursor: pointer;
  4490. -webkit-transition: background-color .2s;
  4491. transition: background-color .2s;
  4492. }
  4493. .btn-flat:focus, .btn-flat:hover {
  4494. -webkit-box-shadow: none;
  4495. box-shadow: none;
  4496. }
  4497. .btn-flat:focus {
  4498. background-color: rgba(0, 0, 0, 0.1);
  4499. }
  4500. .btn-flat.disabled {
  4501. background-color: transparent !important;
  4502. color: #b3b2b2 !important;
  4503. cursor: default;
  4504. }
  4505. .btn-large {
  4506. height: 54px;
  4507. line-height: 54px;
  4508. }
  4509. .btn-large i {
  4510. font-size: 1.6rem;
  4511. }
  4512. .btn-block {
  4513. display: block;
  4514. }
  4515. .dropdown-content {
  4516. background-color: #fff;
  4517. margin: 0;
  4518. display: none;
  4519. min-width: 100px;
  4520. max-height: 650px;
  4521. overflow-y: auto;
  4522. opacity: 0;
  4523. position: absolute;
  4524. z-index: 999;
  4525. will-change: width, height;
  4526. }
  4527. .dropdown-content li {
  4528. clear: both;
  4529. color: rgba(0, 0, 0, 0.87);
  4530. cursor: pointer;
  4531. min-height: 50px;
  4532. line-height: 1.5rem;
  4533. width: 100%;
  4534. text-align: left;
  4535. text-transform: none;
  4536. }
  4537. .dropdown-content li:hover, .dropdown-content li.active, .dropdown-content li.selected {
  4538. background-color: #eee;
  4539. }
  4540. .dropdown-content li.active.selected {
  4541. background-color: #e1e1e1;
  4542. }
  4543. .dropdown-content li.divider {
  4544. min-height: 0;
  4545. height: 1px;
  4546. }
  4547. .dropdown-content li > a, .dropdown-content li > span {
  4548. font-size: 16px;
  4549. color: #26a69a;
  4550. display: block;
  4551. line-height: 22px;
  4552. padding: 14px 16px;
  4553. }
  4554. .dropdown-content li > span > label {
  4555. top: 1px;
  4556. left: 0;
  4557. height: 18px;
  4558. }
  4559. .dropdown-content li > a > i {
  4560. height: inherit;
  4561. line-height: inherit;
  4562. float: left;
  4563. margin: 0 24px 0 0;
  4564. width: 24px;
  4565. }
  4566. .input-field.col .dropdown-content [type="checkbox"] + label {
  4567. top: 1px;
  4568. left: 0;
  4569. height: 18px;
  4570. }
  4571. /*!
  4572. * Waves v0.6.0
  4573. * http://fian.my.id/Waves
  4574. *
  4575. * Copyright 2014 Alfiana E. Sibuea and other contributors
  4576. * Released under the MIT license
  4577. * https://github.com/fians/Waves/blob/master/LICENSE
  4578. */
  4579. .waves-effect {
  4580. position: relative;
  4581. cursor: pointer;
  4582. display: inline-block;
  4583. overflow: hidden;
  4584. -webkit-user-select: none;
  4585. -moz-user-select: none;
  4586. -ms-user-select: none;
  4587. user-select: none;
  4588. -webkit-tap-highlight-color: transparent;
  4589. vertical-align: middle;
  4590. z-index: 1;
  4591. -webkit-transition: .3s ease-out;
  4592. transition: .3s ease-out;
  4593. }
  4594. .waves-effect .waves-ripple {
  4595. position: absolute;
  4596. border-radius: 50%;
  4597. width: 20px;
  4598. height: 20px;
  4599. margin-top: -10px;
  4600. margin-left: -10px;
  4601. opacity: 0;
  4602. background: rgba(0, 0, 0, 0.2);
  4603. -webkit-transition: all 0.7s ease-out;
  4604. transition: all 0.7s ease-out;
  4605. -webkit-transition-property: opacity, -webkit-transform;
  4606. transition-property: opacity, -webkit-transform;
  4607. transition-property: transform, opacity;
  4608. transition-property: transform, opacity, -webkit-transform;
  4609. -webkit-transform: scale(0);
  4610. transform: scale(0);
  4611. pointer-events: none;
  4612. }
  4613. .waves-effect.waves-light .waves-ripple {
  4614. background-color: rgba(255, 255, 255, 0.45);
  4615. }
  4616. .waves-effect.waves-red .waves-ripple {
  4617. background-color: rgba(244, 67, 54, 0.7);
  4618. }
  4619. .waves-effect.waves-yellow .waves-ripple {
  4620. background-color: rgba(255, 235, 59, 0.7);
  4621. }
  4622. .waves-effect.waves-orange .waves-ripple {
  4623. background-color: rgba(255, 152, 0, 0.7);
  4624. }
  4625. .waves-effect.waves-purple .waves-ripple {
  4626. background-color: rgba(156, 39, 176, 0.7);
  4627. }
  4628. .waves-effect.waves-green .waves-ripple {
  4629. background-color: rgba(76, 175, 80, 0.7);
  4630. }
  4631. .waves-effect.waves-teal .waves-ripple {
  4632. background-color: rgba(0, 150, 136, 0.7);
  4633. }
  4634. .waves-effect input[type="button"], .waves-effect input[type="reset"], .waves-effect input[type="submit"] {
  4635. border: 0;
  4636. font-style: normal;
  4637. font-size: inherit;
  4638. text-transform: inherit;
  4639. background: none;
  4640. }
  4641. .waves-effect img {
  4642. position: relative;
  4643. z-index: -1;
  4644. }
  4645. .waves-notransition {
  4646. -webkit-transition: none !important;
  4647. transition: none !important;
  4648. }
  4649. .waves-circle {
  4650. -webkit-transform: translateZ(0);
  4651. transform: translateZ(0);
  4652. -webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
  4653. }
  4654. .waves-input-wrapper {
  4655. border-radius: 0.2em;
  4656. vertical-align: bottom;
  4657. }
  4658. .waves-input-wrapper .waves-button-input {
  4659. position: relative;
  4660. top: 0;
  4661. left: 0;
  4662. z-index: 1;
  4663. }
  4664. .waves-circle {
  4665. text-align: center;
  4666. width: 2.5em;
  4667. height: 2.5em;
  4668. line-height: 2.5em;
  4669. border-radius: 50%;
  4670. -webkit-mask-image: none;
  4671. }
  4672. .waves-block {
  4673. display: block;
  4674. }
  4675. /* Firefox Bug: link not triggered */
  4676. .waves-effect .waves-ripple {
  4677. z-index: -1;
  4678. }
  4679. .modal {
  4680. display: none;
  4681. position: fixed;
  4682. left: 0;
  4683. right: 0;
  4684. background-color: #fafafa;
  4685. padding: 0;
  4686. max-height: 70%;
  4687. width: 55%;
  4688. margin: auto;
  4689. overflow-y: auto;
  4690. border-radius: 2px;
  4691. will-change: top, opacity;
  4692. }
  4693. @media only screen and (max-width: 992px) {
  4694. .modal {
  4695. width: 80%;
  4696. }
  4697. }
  4698. .modal h1, .modal h2, .modal h3, .modal h4 {
  4699. margin-top: 0;
  4700. }
  4701. .modal .modal-content {
  4702. padding: 24px;
  4703. }
  4704. .modal .modal-close {
  4705. cursor: pointer;
  4706. }
  4707. .modal .modal-footer {
  4708. border-radius: 0 0 2px 2px;
  4709. background-color: #fafafa;
  4710. padding: 4px 6px;
  4711. height: 56px;
  4712. width: 100%;
  4713. text-align: right;
  4714. }
  4715. .modal .modal-footer .btn, .modal .modal-footer .btn-large, .modal .modal-footer .btn-flat {
  4716. margin: 6px 0;
  4717. }
  4718. .modal-overlay {
  4719. position: fixed;
  4720. z-index: 999;
  4721. top: -25%;
  4722. left: 0;
  4723. bottom: 0;
  4724. right: 0;
  4725. height: 125%;
  4726. width: 100%;
  4727. background: #000;
  4728. display: none;
  4729. will-change: opacity;
  4730. }
  4731. .modal.modal-fixed-footer {
  4732. padding: 0;
  4733. height: 70%;
  4734. }
  4735. .modal.modal-fixed-footer .modal-content {
  4736. position: absolute;
  4737. height: calc(100% - 56px);
  4738. max-height: 100%;
  4739. width: 100%;
  4740. overflow-y: auto;
  4741. }
  4742. .modal.modal-fixed-footer .modal-footer {
  4743. border-top: 1px solid rgba(0, 0, 0, 0.1);
  4744. position: absolute;
  4745. bottom: 0;
  4746. }
  4747. .modal.bottom-sheet {
  4748. top: auto;
  4749. bottom: -100%;
  4750. margin: 0;
  4751. width: 100%;
  4752. max-height: 45%;
  4753. border-radius: 0;
  4754. will-change: bottom, opacity;
  4755. }
  4756. .collapsible {
  4757. border-top: 1px solid #ddd;
  4758. border-right: 1px solid #ddd;
  4759. border-left: 1px solid #ddd;
  4760. margin: 0.5rem 0 1rem 0;
  4761. }
  4762. .collapsible-header {
  4763. display: block;
  4764. cursor: pointer;
  4765. -webkit-tap-highlight-color: transparent;
  4766. min-height: 3rem;
  4767. line-height: 3rem;
  4768. padding: 0 1rem;
  4769. background-color: #fff;
  4770. border-bottom: 1px solid #ddd;
  4771. }
  4772. .collapsible-header i {
  4773. width: 2rem;
  4774. font-size: 1.6rem;
  4775. line-height: 3rem;
  4776. display: block;
  4777. float: left;
  4778. text-align: center;
  4779. margin-right: 1rem;
  4780. }
  4781. .collapsible-body {
  4782. display: none;
  4783. border-bottom: 1px solid #ddd;
  4784. -webkit-box-sizing: border-box;
  4785. box-sizing: border-box;
  4786. padding: 2rem;
  4787. }
  4788. .side-nav .collapsible,
  4789. .side-nav.fixed .collapsible {
  4790. border: none;
  4791. -webkit-box-shadow: none;
  4792. box-shadow: none;
  4793. }
  4794. .side-nav .collapsible li,
  4795. .side-nav.fixed .collapsible li {
  4796. padding: 0;
  4797. }
  4798. .side-nav .collapsible-header,
  4799. .side-nav.fixed .collapsible-header {
  4800. background-color: transparent;
  4801. border: none;
  4802. line-height: inherit;
  4803. height: inherit;
  4804. padding: 0 16px;
  4805. }
  4806. .side-nav .collapsible-header:hover,
  4807. .side-nav.fixed .collapsible-header:hover {
  4808. background-color: rgba(0, 0, 0, 0.05);
  4809. }
  4810. .side-nav .collapsible-header i,
  4811. .side-nav.fixed .collapsible-header i {
  4812. line-height: inherit;
  4813. }
  4814. .side-nav .collapsible-body,
  4815. .side-nav.fixed .collapsible-body {
  4816. border: 0;
  4817. background-color: #fff;
  4818. }
  4819. .side-nav .collapsible-body li a,
  4820. .side-nav.fixed .collapsible-body li a {
  4821. padding: 0 23.5px 0 31px;
  4822. }
  4823. .collapsible.popout {
  4824. border: none;
  4825. -webkit-box-shadow: none;
  4826. box-shadow: none;
  4827. }
  4828. .collapsible.popout > li {
  4829. -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  4830. box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
  4831. margin: 0 24px;
  4832. -webkit-transition: margin 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  4833. transition: margin 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  4834. }
  4835. .collapsible.popout > li.active {
  4836. -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
  4837. box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
  4838. margin: 16px 0;
  4839. }
  4840. .chip {
  4841. display: inline-block;
  4842. height: 32px;
  4843. font-size: 13px;
  4844. font-weight: 500;
  4845. color: rgba(0, 0, 0, 0.6);
  4846. line-height: 32px;
  4847. padding: 0 12px;
  4848. border-radius: 16px;
  4849. background-color: #e4e4e4;
  4850. margin-bottom: 5px;
  4851. margin-right: 5px;
  4852. }
  4853. .chip > img {
  4854. float: left;
  4855. margin: 0 8px 0 -12px;
  4856. height: 32px;
  4857. width: 32px;
  4858. border-radius: 50%;
  4859. }
  4860. .chip .close {
  4861. cursor: pointer;
  4862. float: right;
  4863. font-size: 16px;
  4864. line-height: 32px;
  4865. padding-left: 8px;
  4866. }
  4867. .chips {
  4868. border: none;
  4869. border-bottom: 1px solid #9e9e9e;
  4870. -webkit-box-shadow: none;
  4871. box-shadow: none;
  4872. margin: 0 0 20px 0;
  4873. min-height: 45px;
  4874. outline: none;
  4875. -webkit-transition: all .3s;
  4876. transition: all .3s;
  4877. }
  4878. .chips.focus {
  4879. border-bottom: 1px solid #26a69a;
  4880. -webkit-box-shadow: 0 1px 0 0 #26a69a;
  4881. box-shadow: 0 1px 0 0 #26a69a;
  4882. }
  4883. .chips:hover {
  4884. cursor: text;
  4885. }
  4886. .chips .chip.selected {
  4887. background-color: #26a69a;
  4888. color: #fff;
  4889. }
  4890. .chips .input {
  4891. background: none;
  4892. border: 0;
  4893. color: rgba(0, 0, 0, 0.6);
  4894. display: inline-block;
  4895. font-size: 1rem;
  4896. height: 3rem;
  4897. line-height: 32px;
  4898. outline: 0;
  4899. margin: 0;
  4900. padding: 0 !important;
  4901. width: 120px !important;
  4902. }
  4903. .chips .input:focus {
  4904. border: 0 !important;
  4905. -webkit-box-shadow: none !important;
  4906. box-shadow: none !important;
  4907. }
  4908. .chips .autocomplete-content {
  4909. margin-top: 0;
  4910. }
  4911. .prefix ~ .chips {
  4912. margin-left: 3rem;
  4913. width: 92%;
  4914. width: calc(100% - 3rem);
  4915. }
  4916. .chips:empty ~ label {
  4917. font-size: 0.8rem;
  4918. -webkit-transform: translateY(-140%);
  4919. transform: translateY(-140%);
  4920. }
  4921. .materialboxed {
  4922. display: block;
  4923. cursor: -webkit-zoom-in;
  4924. cursor: zoom-in;
  4925. position: relative;
  4926. -webkit-transition: opacity .4s;
  4927. transition: opacity .4s;
  4928. -webkit-backface-visibility: hidden;
  4929. }
  4930. .materialboxed:hover:not(.active) {
  4931. opacity: .8;
  4932. }
  4933. .materialboxed.active {
  4934. cursor: -webkit-zoom-out;
  4935. cursor: zoom-out;
  4936. }
  4937. #materialbox-overlay {
  4938. position: fixed;
  4939. top: 0;
  4940. right: 0;
  4941. bottom: 0;
  4942. left: 0;
  4943. background-color: #292929;
  4944. z-index: 1000;
  4945. will-change: opacity;
  4946. }
  4947. .materialbox-caption {
  4948. position: fixed;
  4949. display: none;
  4950. color: #fff;
  4951. line-height: 50px;
  4952. bottom: 0;
  4953. left: 0;
  4954. width: 100%;
  4955. text-align: center;
  4956. padding: 0% 15%;
  4957. height: 50px;
  4958. z-index: 1000;
  4959. -webkit-font-smoothing: antialiased;
  4960. }
  4961. select:focus {
  4962. outline: 1px solid #c9f3ef;
  4963. }
  4964. button:focus {
  4965. outline: none;
  4966. background-color: #2ab7a9;
  4967. }
  4968. label {
  4969. font-size: 0.8rem;
  4970. color: #9e9e9e;
  4971. }
  4972. /* Text Inputs + Textarea
  4973. ========================================================================== */
  4974. /* Style Placeholders */
  4975. ::-webkit-input-placeholder {
  4976. color: #d1d1d1;
  4977. }
  4978. :-moz-placeholder {
  4979. /* Firefox 18- */
  4980. color: #d1d1d1;
  4981. }
  4982. ::-moz-placeholder {
  4983. /* Firefox 19+ */
  4984. color: #d1d1d1;
  4985. }
  4986. :-ms-input-placeholder {
  4987. color: #d1d1d1;
  4988. }
  4989. /* Text inputs */
  4990. input:not([type]),
  4991. input[type=text]:not(.browser-default),
  4992. input[type=password]:not(.browser-default),
  4993. input[type=email]:not(.browser-default),
  4994. input[type=url]:not(.browser-default),
  4995. input[type=time]:not(.browser-default),
  4996. input[type=date]:not(.browser-default),
  4997. input[type=datetime]:not(.browser-default),
  4998. input[type=datetime-local]:not(.browser-default),
  4999. input[type=tel]:not(.browser-default),
  5000. input[type=number]:not(.browser-default),
  5001. input[type=search]:not(.browser-default),
  5002. textarea.materialize-textarea {
  5003. background-color: transparent;
  5004. border: none;
  5005. border-bottom: 1px solid #9e9e9e;
  5006. border-radius: 0;
  5007. outline: none;
  5008. height: 3rem;
  5009. width: 100%;
  5010. font-size: 1rem;
  5011. margin: 0 0 20px 0;
  5012. padding: 0;
  5013. -webkit-box-shadow: none;
  5014. box-shadow: none;
  5015. -webkit-box-sizing: content-box;
  5016. box-sizing: content-box;
  5017. -webkit-transition: all 0.3s;
  5018. transition: all 0.3s;
  5019. }
  5020. input:not([type]):disabled, input:not([type])[readonly="readonly"],
  5021. input[type=text]:not(.browser-default):disabled,
  5022. input[type=text]:not(.browser-default)[readonly="readonly"],
  5023. input[type=password]:not(.browser-default):disabled,
  5024. input[type=password]:not(.browser-default)[readonly="readonly"],
  5025. input[type=email]:not(.browser-default):disabled,
  5026. input[type=email]:not(.browser-default)[readonly="readonly"],
  5027. input[type=url]:not(.browser-default):disabled,
  5028. input[type=url]:not(.browser-default)[readonly="readonly"],
  5029. input[type=time]:not(.browser-default):disabled,
  5030. input[type=time]:not(.browser-default)[readonly="readonly"],
  5031. input[type=date]:not(.browser-default):disabled,
  5032. input[type=date]:not(.browser-default)[readonly="readonly"],
  5033. input[type=datetime]:not(.browser-default):disabled,
  5034. input[type=datetime]:not(.browser-default)[readonly="readonly"],
  5035. input[type=datetime-local]:not(.browser-default):disabled,
  5036. input[type=datetime-local]:not(.browser-default)[readonly="readonly"],
  5037. input[type=tel]:not(.browser-default):disabled,
  5038. input[type=tel]:not(.browser-default)[readonly="readonly"],
  5039. input[type=number]:not(.browser-default):disabled,
  5040. input[type=number]:not(.browser-default)[readonly="readonly"],
  5041. input[type=search]:not(.browser-default):disabled,
  5042. input[type=search]:not(.browser-default)[readonly="readonly"],
  5043. textarea.materialize-textarea:disabled,
  5044. textarea.materialize-textarea[readonly="readonly"] {
  5045. color: rgba(0, 0, 0, 0.26);
  5046. border-bottom: 1px dotted rgba(0, 0, 0, 0.26);
  5047. }
  5048. input:not([type]):disabled + label,
  5049. input:not([type])[readonly="readonly"] + label,
  5050. input[type=text]:not(.browser-default):disabled + label,
  5051. input[type=text]:not(.browser-default)[readonly="readonly"] + label,
  5052. input[type=password]:not(.browser-default):disabled + label,
  5053. input[type=password]:not(.browser-default)[readonly="readonly"] + label,
  5054. input[type=email]:not(.browser-default):disabled + label,
  5055. input[type=email]:not(.browser-default)[readonly="readonly"] + label,
  5056. input[type=url]:not(.browser-default):disabled + label,
  5057. input[type=url]:not(.browser-default)[readonly="readonly"] + label,
  5058. input[type=time]:not(.browser-default):disabled + label,
  5059. input[type=time]:not(.browser-default)[readonly="readonly"] + label,
  5060. input[type=date]:not(.browser-default):disabled + label,
  5061. input[type=date]:not(.browser-default)[readonly="readonly"] + label,
  5062. input[type=datetime]:not(.browser-default):disabled + label,
  5063. input[type=datetime]:not(.browser-default)[readonly="readonly"] + label,
  5064. input[type=datetime-local]:not(.browser-default):disabled + label,
  5065. input[type=datetime-local]:not(.browser-default)[readonly="readonly"] + label,
  5066. input[type=tel]:not(.browser-default):disabled + label,
  5067. input[type=tel]:not(.browser-default)[readonly="readonly"] + label,
  5068. input[type=number]:not(.browser-default):disabled + label,
  5069. input[type=number]:not(.browser-default)[readonly="readonly"] + label,
  5070. input[type=search]:not(.browser-default):disabled + label,
  5071. input[type=search]:not(.browser-default)[readonly="readonly"] + label,
  5072. textarea.materialize-textarea:disabled + label,
  5073. textarea.materialize-textarea[readonly="readonly"] + label {
  5074. color: rgba(0, 0, 0, 0.26);
  5075. }
  5076. input:not([type]):focus:not([readonly]),
  5077. input[type=text]:not(.browser-default):focus:not([readonly]),
  5078. input[type=password]:not(.browser-default):focus:not([readonly]),
  5079. input[type=email]:not(.browser-default):focus:not([readonly]),
  5080. input[type=url]:not(.browser-default):focus:not([readonly]),
  5081. input[type=time]:not(.browser-default):focus:not([readonly]),
  5082. input[type=date]:not(.browser-default):focus:not([readonly]),
  5083. input[type=datetime]:not(.browser-default):focus:not([readonly]),
  5084. input[type=datetime-local]:not(.browser-default):focus:not([readonly]),
  5085. input[type=tel]:not(.browser-default):focus:not([readonly]),
  5086. input[type=number]:not(.browser-default):focus:not([readonly]),
  5087. input[type=search]:not(.browser-default):focus:not([readonly]),
  5088. textarea.materialize-textarea:focus:not([readonly]) {
  5089. border-bottom: 1px solid #26a69a;
  5090. -webkit-box-shadow: 0 1px 0 0 #26a69a;
  5091. box-shadow: 0 1px 0 0 #26a69a;
  5092. }
  5093. input:not([type]):focus:not([readonly]) + label,
  5094. input[type=text]:not(.browser-default):focus:not([readonly]) + label,
  5095. input[type=password]:not(.browser-default):focus:not([readonly]) + label,
  5096. input[type=email]:not(.browser-default):focus:not([readonly]) + label,
  5097. input[type=url]:not(.browser-default):focus:not([readonly]) + label,
  5098. input[type=time]:not(.browser-default):focus:not([readonly]) + label,
  5099. input[type=date]:not(.browser-default):focus:not([readonly]) + label,
  5100. input[type=datetime]:not(.browser-default):focus:not([readonly]) + label,
  5101. input[type=datetime-local]:not(.browser-default):focus:not([readonly]) + label,
  5102. input[type=tel]:not(.browser-default):focus:not([readonly]) + label,
  5103. input[type=number]:not(.browser-default):focus:not([readonly]) + label,
  5104. input[type=search]:not(.browser-default):focus:not([readonly]) + label,
  5105. textarea.materialize-textarea:focus:not([readonly]) + label {
  5106. color: #26a69a;
  5107. }
  5108. input:not([type]).valid, input:not([type]):focus.valid,
  5109. input[type=text]:not(.browser-default).valid,
  5110. input[type=text]:not(.browser-default):focus.valid,
  5111. input[type=password]:not(.browser-default).valid,
  5112. input[type=password]:not(.browser-default):focus.valid,
  5113. input[type=email]:not(.browser-default).valid,
  5114. input[type=email]:not(.browser-default):focus.valid,
  5115. input[type=url]:not(.browser-default).valid,
  5116. input[type=url]:not(.browser-default):focus.valid,
  5117. input[type=time]:not(.browser-default).valid,
  5118. input[type=time]:not(.browser-default):focus.valid,
  5119. input[type=date]:not(.browser-default).valid,
  5120. input[type=date]:not(.browser-default):focus.valid,
  5121. input[type=datetime]:not(.browser-default).valid,
  5122. input[type=datetime]:not(.browser-default):focus.valid,
  5123. input[type=datetime-local]:not(.browser-default).valid,
  5124. input[type=datetime-local]:not(.browser-default):focus.valid,
  5125. input[type=tel]:not(.browser-default).valid,
  5126. input[type=tel]:not(.browser-default):focus.valid,
  5127. input[type=number]:not(.browser-default).valid,
  5128. input[type=number]:not(.browser-default):focus.valid,
  5129. input[type=search]:not(.browser-default).valid,
  5130. input[type=search]:not(.browser-default):focus.valid,
  5131. textarea.materialize-textarea.valid,
  5132. textarea.materialize-textarea:focus.valid {
  5133. border-bottom: 1px solid #4CAF50;
  5134. -webkit-box-shadow: 0 1px 0 0 #4CAF50;
  5135. box-shadow: 0 1px 0 0 #4CAF50;
  5136. }
  5137. input:not([type]).valid + label:after,
  5138. input:not([type]):focus.valid + label:after,
  5139. input[type=text]:not(.browser-default).valid + label:after,
  5140. input[type=text]:not(.browser-default):focus.valid + label:after,
  5141. input[type=password]:not(.browser-default).valid + label:after,
  5142. input[type=password]:not(.browser-default):focus.valid + label:after,
  5143. input[type=email]:not(.browser-default).valid + label:after,
  5144. input[type=email]:not(.browser-default):focus.valid + label:after,
  5145. input[type=url]:not(.browser-default).valid + label:after,
  5146. input[type=url]:not(.browser-default):focus.valid + label:after,
  5147. input[type=time]:not(.browser-default).valid + label:after,
  5148. input[type=time]:not(.browser-default):focus.valid + label:after,
  5149. input[type=date]:not(.browser-default).valid + label:after,
  5150. input[type=date]:not(.browser-default):focus.valid + label:after,
  5151. input[type=datetime]:not(.browser-default).valid + label:after,
  5152. input[type=datetime]:not(.browser-default):focus.valid + label:after,
  5153. input[type=datetime-local]:not(.browser-default).valid + label:after,
  5154. input[type=datetime-local]:not(.browser-default):focus.valid + label:after,
  5155. input[type=tel]:not(.browser-default).valid + label:after,
  5156. input[type=tel]:not(.browser-default):focus.valid + label:after,
  5157. input[type=number]:not(.browser-default).valid + label:after,
  5158. input[type=number]:not(.browser-default):focus.valid + label:after,
  5159. input[type=search]:not(.browser-default).valid + label:after,
  5160. input[type=search]:not(.browser-default):focus.valid + label:after,
  5161. textarea.materialize-textarea.valid + label:after,
  5162. textarea.materialize-textarea:focus.valid + label:after {
  5163. content: attr(data-success);
  5164. color: #4CAF50;
  5165. opacity: 1;
  5166. }
  5167. input:not([type]).invalid, input:not([type]):focus.invalid,
  5168. input[type=text]:not(.browser-default).invalid,
  5169. input[type=text]:not(.browser-default):focus.invalid,
  5170. input[type=password]:not(.browser-default).invalid,
  5171. input[type=password]:not(.browser-default):focus.invalid,
  5172. input[type=email]:not(.browser-default).invalid,
  5173. input[type=email]:not(.browser-default):focus.invalid,
  5174. input[type=url]:not(.browser-default).invalid,
  5175. input[type=url]:not(.browser-default):focus.invalid,
  5176. input[type=time]:not(.browser-default).invalid,
  5177. input[type=time]:not(.browser-default):focus.invalid,
  5178. input[type=date]:not(.browser-default).invalid,
  5179. input[type=date]:not(.browser-default):focus.invalid,
  5180. input[type=datetime]:not(.browser-default).invalid,
  5181. input[type=datetime]:not(.browser-default):focus.invalid,
  5182. input[type=datetime-local]:not(.browser-default).invalid,
  5183. input[type=datetime-local]:not(.browser-default):focus.invalid,
  5184. input[type=tel]:not(.browser-default).invalid,
  5185. input[type=tel]:not(.browser-default):focus.invalid,
  5186. input[type=number]:not(.browser-default).invalid,
  5187. input[type=number]:not(.browser-default):focus.invalid,
  5188. input[type=search]:not(.browser-default).invalid,
  5189. input[type=search]:not(.browser-default):focus.invalid,
  5190. textarea.materialize-textarea.invalid,
  5191. textarea.materialize-textarea:focus.invalid {
  5192. border-bottom: 1px solid #F44336;
  5193. -webkit-box-shadow: 0 1px 0 0 #F44336;
  5194. box-shadow: 0 1px 0 0 #F44336;
  5195. }
  5196. input:not([type]).invalid + label:after,
  5197. input:not([type]):focus.invalid + label:after,
  5198. input[type=text]:not(.browser-default).invalid + label:after,
  5199. input[type=text]:not(.browser-default):focus.invalid + label:after,
  5200. input[type=password]:not(.browser-default).invalid + label:after,
  5201. input[type=password]:not(.browser-default):focus.invalid + label:after,
  5202. input[type=email]:not(.browser-default).invalid + label:after,
  5203. input[type=email]:not(.browser-default):focus.invalid + label:after,
  5204. input[type=url]:not(.browser-default).invalid + label:after,
  5205. input[type=url]:not(.browser-default):focus.invalid + label:after,
  5206. input[type=time]:not(.browser-default).invalid + label:after,
  5207. input[type=time]:not(.browser-default):focus.invalid + label:after,
  5208. input[type=date]:not(.browser-default).invalid + label:after,
  5209. input[type=date]:not(.browser-default):focus.invalid + label:after,
  5210. input[type=datetime]:not(.browser-default).invalid + label:after,
  5211. input[type=datetime]:not(.browser-default):focus.invalid + label:after,
  5212. input[type=datetime-local]:not(.browser-default).invalid + label:after,
  5213. input[type=datetime-local]:not(.browser-default):focus.invalid + label:after,
  5214. input[type=tel]:not(.browser-default).invalid + label:after,
  5215. input[type=tel]:not(.browser-default):focus.invalid + label:after,
  5216. input[type=number]:not(.browser-default).invalid + label:after,
  5217. input[type=number]:not(.browser-default):focus.invalid + label:after,
  5218. input[type=search]:not(.browser-default).invalid + label:after,
  5219. input[type=search]:not(.browser-default):focus.invalid + label:after,
  5220. textarea.materialize-textarea.invalid + label:after,
  5221. textarea.materialize-textarea:focus.invalid + label:after {
  5222. content: attr(data-error);
  5223. color: #F44336;
  5224. opacity: 1;
  5225. }
  5226. input:not([type]).validate + label,
  5227. input[type=text]:not(.browser-default).validate + label,
  5228. input[type=password]:not(.browser-default).validate + label,
  5229. input[type=email]:not(.browser-default).validate + label,
  5230. input[type=url]:not(.browser-default).validate + label,
  5231. input[type=time]:not(.browser-default).validate + label,
  5232. input[type=date]:not(.browser-default).validate + label,
  5233. input[type=datetime]:not(.browser-default).validate + label,
  5234. input[type=datetime-local]:not(.browser-default).validate + label,
  5235. input[type=tel]:not(.browser-default).validate + label,
  5236. input[type=number]:not(.browser-default).validate + label,
  5237. input[type=search]:not(.browser-default).validate + label,
  5238. textarea.materialize-textarea.validate + label {
  5239. width: 100%;
  5240. pointer-events: none;
  5241. }
  5242. input:not([type]) + label:after,
  5243. input[type=text]:not(.browser-default) + label:after,
  5244. input[type=password]:not(.browser-default) + label:after,
  5245. input[type=email]:not(.browser-default) + label:after,
  5246. input[type=url]:not(.browser-default) + label:after,
  5247. input[type=time]:not(.browser-default) + label:after,
  5248. input[type=date]:not(.browser-default) + label:after,
  5249. input[type=datetime]:not(.browser-default) + label:after,
  5250. input[type=datetime-local]:not(.browser-default) + label:after,
  5251. input[type=tel]:not(.browser-default) + label:after,
  5252. input[type=number]:not(.browser-default) + label:after,
  5253. input[type=search]:not(.browser-default) + label:after,
  5254. textarea.materialize-textarea + label:after {
  5255. display: block;
  5256. content: "";
  5257. position: absolute;
  5258. top: 60px;
  5259. left: 0;
  5260. opacity: 0;
  5261. -webkit-transition: .2s opacity ease-out, .2s color ease-out;
  5262. transition: .2s opacity ease-out, .2s color ease-out;
  5263. }
  5264. .input-field {
  5265. position: relative;
  5266. margin-top: 1rem;
  5267. }
  5268. .input-field.inline {
  5269. display: inline-block;
  5270. vertical-align: middle;
  5271. margin-left: 5px;
  5272. }
  5273. .input-field.inline input,
  5274. .input-field.inline .select-dropdown {
  5275. margin-bottom: 1rem;
  5276. }
  5277. .input-field.col label {
  5278. left: 0.75rem;
  5279. }
  5280. .input-field.col .prefix ~ label,
  5281. .input-field.col .prefix ~ .validate ~ label {
  5282. width: calc(100% - 3rem - 1.5rem);
  5283. }
  5284. .input-field label {
  5285. color: #9e9e9e;
  5286. position: absolute;
  5287. top: 0.8rem;
  5288. left: 0;
  5289. font-size: 1rem;
  5290. cursor: text;
  5291. -webkit-transition: .2s ease-out;
  5292. transition: .2s ease-out;
  5293. text-align: initial;
  5294. }
  5295. .input-field label:not(.label-icon).active {
  5296. font-size: 0.8rem;
  5297. -webkit-transform: translateY(-140%);
  5298. transform: translateY(-140%);
  5299. }
  5300. .input-field .prefix {
  5301. position: absolute;
  5302. width: 3rem;
  5303. font-size: 2rem;
  5304. -webkit-transition: color .2s;
  5305. transition: color .2s;
  5306. }
  5307. .input-field .prefix.active {
  5308. color: #26a69a;
  5309. }
  5310. .input-field .prefix ~ input,
  5311. .input-field .prefix ~ textarea,
  5312. .input-field .prefix ~ label,
  5313. .input-field .prefix ~ .validate ~ label,
  5314. .input-field .prefix ~ .autocomplete-content {
  5315. margin-left: 3rem;
  5316. width: 92%;
  5317. width: calc(100% - 3rem);
  5318. }
  5319. .input-field .prefix ~ label {
  5320. margin-left: 3rem;
  5321. }
  5322. @media only screen and (max-width: 992px) {
  5323. .input-field .prefix ~ input {
  5324. width: 86%;
  5325. width: calc(100% - 3rem);
  5326. }
  5327. }
  5328. @media only screen and (max-width: 600px) {
  5329. .input-field .prefix ~ input {
  5330. width: 80%;
  5331. width: calc(100% - 3rem);
  5332. }
  5333. }
  5334. /* Search Field */
  5335. .input-field input[type=search] {
  5336. display: block;
  5337. line-height: inherit;
  5338. padding-left: 4rem;
  5339. width: calc(100% - 4rem);
  5340. }
  5341. .input-field input[type=search]:focus {
  5342. background-color: #fff;
  5343. border: 0;
  5344. -webkit-box-shadow: none;
  5345. box-shadow: none;
  5346. color: #444;
  5347. }
  5348. .input-field input[type=search]:focus + label i,
  5349. .input-field input[type=search]:focus ~ .mdi-navigation-close,
  5350. .input-field input[type=search]:focus ~ .material-icons {
  5351. color: #444;
  5352. }
  5353. .input-field input[type=search] + label {
  5354. left: 1rem;
  5355. }
  5356. .input-field input[type=search] ~ .mdi-navigation-close,
  5357. .input-field input[type=search] ~ .material-icons {
  5358. position: absolute;
  5359. top: 0;
  5360. right: 1rem;
  5361. color: transparent;
  5362. cursor: pointer;
  5363. font-size: 2rem;
  5364. -webkit-transition: .3s color;
  5365. transition: .3s color;
  5366. }
  5367. /* Textarea */
  5368. textarea {
  5369. width: 100%;
  5370. height: 3rem;
  5371. background-color: transparent;
  5372. }
  5373. textarea.materialize-textarea {
  5374. overflow-y: hidden;
  5375. /* prevents scroll bar flash */
  5376. padding: .8rem 0 1.6rem 0;
  5377. /* prevents text jump on Enter keypress */
  5378. resize: none;
  5379. min-height: 3rem;
  5380. }
  5381. .hiddendiv {
  5382. display: none;
  5383. white-space: pre-wrap;
  5384. word-wrap: break-word;
  5385. overflow-wrap: break-word;
  5386. /* future version of deprecated 'word-wrap' */
  5387. padding-top: 1.2rem;
  5388. /* prevents text jump on Enter keypress */
  5389. position: absolute;
  5390. top: 0;
  5391. }
  5392. /* Autocomplete */
  5393. .autocomplete-content {
  5394. margin-top: -20px;
  5395. display: block;
  5396. opacity: 1;
  5397. position: static;
  5398. }
  5399. .autocomplete-content li .highlight {
  5400. color: #444;
  5401. }
  5402. .autocomplete-content li img {
  5403. height: 40px;
  5404. width: 40px;
  5405. margin: 5px 15px;
  5406. }
  5407. /* Radio Buttons
  5408. ========================================================================== */
  5409. [type="radio"]:not(:checked),
  5410. [type="radio"]:checked {
  5411. position: absolute;
  5412. left: -9999px;
  5413. opacity: 0;
  5414. }
  5415. [type="radio"]:not(:checked) + label,
  5416. [type="radio"]:checked + label {
  5417. position: relative;
  5418. padding-left: 35px;
  5419. cursor: pointer;
  5420. display: inline-block;
  5421. height: 25px;
  5422. line-height: 25px;
  5423. font-size: 1rem;
  5424. -webkit-transition: .28s ease;
  5425. transition: .28s ease;
  5426. /* webkit (konqueror) browsers */
  5427. -webkit-user-select: none;
  5428. -moz-user-select: none;
  5429. -ms-user-select: none;
  5430. user-select: none;
  5431. }
  5432. [type="radio"] + label:before,
  5433. [type="radio"] + label:after {
  5434. content: '';
  5435. position: absolute;
  5436. left: 0;
  5437. top: 0;
  5438. margin: 4px;
  5439. width: 16px;
  5440. height: 16px;
  5441. z-index: 0;
  5442. -webkit-transition: .28s ease;
  5443. transition: .28s ease;
  5444. }
  5445. /* Unchecked styles */
  5446. [type="radio"]:not(:checked) + label:before,
  5447. [type="radio"]:not(:checked) + label:after,
  5448. [type="radio"]:checked + label:before,
  5449. [type="radio"]:checked + label:after,
  5450. [type="radio"].with-gap:checked + label:before,
  5451. [type="radio"].with-gap:checked + label:after {
  5452. border-radius: 50%;
  5453. }
  5454. [type="radio"]:not(:checked) + label:before,
  5455. [type="radio"]:not(:checked) + label:after {
  5456. border: 2px solid #5a5a5a;
  5457. }
  5458. [type="radio"]:not(:checked) + label:after {
  5459. -webkit-transform: scale(0);
  5460. transform: scale(0);
  5461. }
  5462. /* Checked styles */
  5463. [type="radio"]:checked + label:before {
  5464. border: 2px solid transparent;
  5465. }
  5466. [type="radio"]:checked + label:after,
  5467. [type="radio"].with-gap:checked + label:before,
  5468. [type="radio"].with-gap:checked + label:after {
  5469. border: 2px solid #26a69a;
  5470. }
  5471. [type="radio"]:checked + label:after,
  5472. [type="radio"].with-gap:checked + label:after {
  5473. background-color: #26a69a;
  5474. }
  5475. [type="radio"]:checked + label:after {
  5476. -webkit-transform: scale(1.02);
  5477. transform: scale(1.02);
  5478. }
  5479. /* Radio With gap */
  5480. [type="radio"].with-gap:checked + label:after {
  5481. -webkit-transform: scale(0.5);
  5482. transform: scale(0.5);
  5483. }
  5484. /* Focused styles */
  5485. [type="radio"].tabbed:focus + label:before {
  5486. -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  5487. box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  5488. }
  5489. /* Disabled Radio With gap */
  5490. [type="radio"].with-gap:disabled:checked + label:before {
  5491. border: 2px solid rgba(0, 0, 0, 0.26);
  5492. }
  5493. [type="radio"].with-gap:disabled:checked + label:after {
  5494. border: none;
  5495. background-color: rgba(0, 0, 0, 0.26);
  5496. }
  5497. /* Disabled style */
  5498. [type="radio"]:disabled:not(:checked) + label:before,
  5499. [type="radio"]:disabled:checked + label:before {
  5500. background-color: transparent;
  5501. border-color: rgba(0, 0, 0, 0.26);
  5502. }
  5503. [type="radio"]:disabled + label {
  5504. color: rgba(0, 0, 0, 0.26);
  5505. }
  5506. [type="radio"]:disabled:not(:checked) + label:before {
  5507. border-color: rgba(0, 0, 0, 0.26);
  5508. }
  5509. [type="radio"]:disabled:checked + label:after {
  5510. background-color: rgba(0, 0, 0, 0.26);
  5511. border-color: #BDBDBD;
  5512. }
  5513. /* Checkboxes
  5514. ========================================================================== */
  5515. /* CUSTOM CSS CHECKBOXES */
  5516. form p {
  5517. margin-bottom: 10px;
  5518. text-align: left;
  5519. }
  5520. form p:last-child {
  5521. margin-bottom: 0;
  5522. }
  5523. /* Remove default checkbox */
  5524. [type="checkbox"]:not(:checked),
  5525. [type="checkbox"]:checked {
  5526. position: absolute;
  5527. left: -9999px;
  5528. opacity: 0;
  5529. }
  5530. [type="checkbox"] {
  5531. /* checkbox aspect */
  5532. }
  5533. [type="checkbox"] + label {
  5534. position: relative;
  5535. padding-left: 35px;
  5536. cursor: pointer;
  5537. display: inline-block;
  5538. height: 25px;
  5539. line-height: 25px;
  5540. font-size: 1rem;
  5541. -webkit-user-select: none;
  5542. /* webkit (safari, chrome) browsers */
  5543. -moz-user-select: none;
  5544. /* mozilla browsers */
  5545. -khtml-user-select: none;
  5546. /* webkit (konqueror) browsers */
  5547. -ms-user-select: none;
  5548. /* IE10+ */
  5549. }
  5550. [type="checkbox"] + label:before,
  5551. [type="checkbox"]:not(.filled-in) + label:after {
  5552. content: '';
  5553. position: absolute;
  5554. top: 0;
  5555. left: 0;
  5556. width: 18px;
  5557. height: 18px;
  5558. z-index: 0;
  5559. border: 2px solid #5a5a5a;
  5560. border-radius: 1px;
  5561. margin-top: 2px;
  5562. -webkit-transition: .2s;
  5563. transition: .2s;
  5564. }
  5565. [type="checkbox"]:not(.filled-in) + label:after {
  5566. border: 0;
  5567. -webkit-transform: scale(0);
  5568. transform: scale(0);
  5569. }
  5570. [type="checkbox"]:not(:checked):disabled + label:before {
  5571. border: none;
  5572. background-color: rgba(0, 0, 0, 0.26);
  5573. }
  5574. [type="checkbox"].tabbed:focus + label:after {
  5575. -webkit-transform: scale(1);
  5576. transform: scale(1);
  5577. border: 0;
  5578. border-radius: 50%;
  5579. -webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  5580. box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);
  5581. background-color: rgba(0, 0, 0, 0.1);
  5582. }
  5583. [type="checkbox"]:checked + label:before {
  5584. top: -4px;
  5585. left: -5px;
  5586. width: 12px;
  5587. height: 22px;
  5588. border-top: 2px solid transparent;
  5589. border-left: 2px solid transparent;
  5590. border-right: 2px solid #26a69a;
  5591. border-bottom: 2px solid #26a69a;
  5592. -webkit-transform: rotate(40deg);
  5593. transform: rotate(40deg);
  5594. -webkit-backface-visibility: hidden;
  5595. backface-visibility: hidden;
  5596. -webkit-transform-origin: 100% 100%;
  5597. transform-origin: 100% 100%;
  5598. }
  5599. [type="checkbox"]:checked:disabled + label:before {
  5600. border-right: 2px solid rgba(0, 0, 0, 0.26);
  5601. border-bottom: 2px solid rgba(0, 0, 0, 0.26);
  5602. }
  5603. /* Indeterminate checkbox */
  5604. [type="checkbox"]:indeterminate + label:before {
  5605. top: -11px;
  5606. left: -12px;
  5607. width: 10px;
  5608. height: 22px;
  5609. border-top: none;
  5610. border-left: none;
  5611. border-right: 2px solid #26a69a;
  5612. border-bottom: none;
  5613. -webkit-transform: rotate(90deg);
  5614. transform: rotate(90deg);
  5615. -webkit-backface-visibility: hidden;
  5616. backface-visibility: hidden;
  5617. -webkit-transform-origin: 100% 100%;
  5618. transform-origin: 100% 100%;
  5619. }
  5620. [type="checkbox"]:indeterminate:disabled + label:before {
  5621. border-right: 2px solid rgba(0, 0, 0, 0.26);
  5622. background-color: transparent;
  5623. }
  5624. [type="checkbox"].filled-in + label:after {
  5625. border-radius: 2px;
  5626. }
  5627. [type="checkbox"].filled-in + label:before,
  5628. [type="checkbox"].filled-in + label:after {
  5629. content: '';
  5630. left: 0;
  5631. position: absolute;
  5632. /* .1s delay is for check animation */
  5633. -webkit-transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  5634. transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;
  5635. z-index: 1;
  5636. }
  5637. [type="checkbox"].filled-in:not(:checked) + label:before {
  5638. width: 0;
  5639. height: 0;
  5640. border: 3px solid transparent;
  5641. left: 6px;
  5642. top: 10px;
  5643. -webkit-transform: rotateZ(37deg);
  5644. transform: rotateZ(37deg);
  5645. -webkit-transform-origin: 20% 40%;
  5646. transform-origin: 100% 100%;
  5647. }
  5648. [type="checkbox"].filled-in:not(:checked) + label:after {
  5649. height: 20px;
  5650. width: 20px;
  5651. background-color: transparent;
  5652. border: 2px solid #5a5a5a;
  5653. top: 0px;
  5654. z-index: 0;
  5655. }
  5656. [type="checkbox"].filled-in:checked + label:before {
  5657. top: 0;
  5658. left: 1px;
  5659. width: 8px;
  5660. height: 13px;
  5661. border-top: 2px solid transparent;
  5662. border-left: 2px solid transparent;
  5663. border-right: 2px solid #fff;
  5664. border-bottom: 2px solid #fff;
  5665. -webkit-transform: rotateZ(37deg);
  5666. transform: rotateZ(37deg);
  5667. -webkit-transform-origin: 100% 100%;
  5668. transform-origin: 100% 100%;
  5669. }
  5670. [type="checkbox"].filled-in:checked + label:after {
  5671. top: 0;
  5672. width: 20px;
  5673. height: 20px;
  5674. border: 2px solid #26a69a;
  5675. background-color: #26a69a;
  5676. z-index: 0;
  5677. }
  5678. [type="checkbox"].filled-in.tabbed:focus + label:after {
  5679. border-radius: 2px;
  5680. border-color: #5a5a5a;
  5681. background-color: rgba(0, 0, 0, 0.1);
  5682. }
  5683. [type="checkbox"].filled-in.tabbed:checked:focus + label:after {
  5684. border-radius: 2px;
  5685. background-color: #26a69a;
  5686. border-color: #26a69a;
  5687. }
  5688. [type="checkbox"].filled-in:disabled:not(:checked) + label:before {
  5689. background-color: transparent;
  5690. border: 2px solid transparent;
  5691. }
  5692. [type="checkbox"].filled-in:disabled:not(:checked) + label:after {
  5693. border-color: transparent;
  5694. background-color: #BDBDBD;
  5695. }
  5696. [type="checkbox"].filled-in:disabled:checked + label:before {
  5697. background-color: transparent;
  5698. }
  5699. [type="checkbox"].filled-in:disabled:checked + label:after {
  5700. background-color: #BDBDBD;
  5701. border-color: #BDBDBD;
  5702. }
  5703. /* Switch
  5704. ========================================================================== */
  5705. .switch,
  5706. .switch * {
  5707. -webkit-user-select: none;
  5708. -moz-user-select: none;
  5709. -khtml-user-select: none;
  5710. -ms-user-select: none;
  5711. }
  5712. .switch label {
  5713. cursor: pointer;
  5714. }
  5715. .switch label input[type=checkbox] {
  5716. opacity: 0;
  5717. width: 0;
  5718. height: 0;
  5719. }
  5720. .switch label input[type=checkbox]:checked + .lever {
  5721. background-color: #84c7c1;
  5722. }
  5723. .switch label input[type=checkbox]:checked + .lever:before, .switch label input[type=checkbox]:checked + .lever:after {
  5724. left: 18px;
  5725. }
  5726. .switch label input[type=checkbox]:checked + .lever:after {
  5727. background-color: #26a69a;
  5728. }
  5729. .switch label .lever {
  5730. content: "";
  5731. display: inline-block;
  5732. position: relative;
  5733. width: 36px;
  5734. height: 14px;
  5735. background-color: rgba(0, 0, 0, 0.38);
  5736. border-radius: 15px;
  5737. margin-right: 10px;
  5738. -webkit-transition: background 0.3s ease;
  5739. transition: background 0.3s ease;
  5740. vertical-align: middle;
  5741. margin: 0 16px;
  5742. }
  5743. .switch label .lever:before, .switch label .lever:after {
  5744. content: "";
  5745. position: absolute;
  5746. display: inline-block;
  5747. width: 20px;
  5748. height: 20px;
  5749. border-radius: 50%;
  5750. left: 0;
  5751. top: -3px;
  5752. -webkit-transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
  5753. transition: left 0.3s ease, background .3s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
  5754. transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease;
  5755. transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease, transform .1s ease, -webkit-box-shadow 0.1s ease, -webkit-transform .1s ease;
  5756. }
  5757. .switch label .lever:before {
  5758. background-color: rgba(38, 166, 154, 0.15);
  5759. }
  5760. .switch label .lever:after {
  5761. background-color: #F1F1F1;
  5762. -webkit-box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  5763. box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12);
  5764. }
  5765. input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
  5766. input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
  5767. -webkit-transform: scale(2.4);
  5768. transform: scale(2.4);
  5769. background-color: rgba(38, 166, 154, 0.15);
  5770. }
  5771. input[type=checkbox]:not(:disabled) ~ .lever:active:before,
  5772. input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {
  5773. -webkit-transform: scale(2.4);
  5774. transform: scale(2.4);
  5775. background-color: rgba(0, 0, 0, 0.08);
  5776. }
  5777. .switch input[type=checkbox][disabled] + .lever {
  5778. cursor: default;
  5779. background-color: rgba(0, 0, 0, 0.12);
  5780. }
  5781. .switch label input[type=checkbox][disabled] + .lever:after,
  5782. .switch label input[type=checkbox][disabled]:checked + .lever:after {
  5783. background-color: #BDBDBD;
  5784. }
  5785. /* Select Field
  5786. ========================================================================== */
  5787. select {
  5788. display: none;
  5789. }
  5790. select.browser-default {
  5791. display: block;
  5792. }
  5793. select {
  5794. background-color: rgba(255, 255, 255, 0.9);
  5795. width: 100%;
  5796. padding: 5px;
  5797. border: 1px solid #f2f2f2;
  5798. border-radius: 2px;
  5799. height: 3rem;
  5800. }
  5801. .select-label {
  5802. position: absolute;
  5803. }
  5804. .select-wrapper {
  5805. position: relative;
  5806. }
  5807. .select-wrapper input.select-dropdown {
  5808. position: relative;
  5809. cursor: pointer;
  5810. background-color: transparent;
  5811. border: none;
  5812. border-bottom: 1px solid #9e9e9e;
  5813. outline: none;
  5814. height: 3rem;
  5815. line-height: 3rem;
  5816. width: 100%;
  5817. font-size: 1rem;
  5818. margin: 0 0 20px 0;
  5819. padding: 0;
  5820. display: block;
  5821. }
  5822. .select-wrapper span.caret {
  5823. color: initial;
  5824. position: absolute;
  5825. right: 0;
  5826. top: 0;
  5827. bottom: 0;
  5828. height: 10px;
  5829. margin: auto 0;
  5830. font-size: 10px;
  5831. line-height: 10px;
  5832. }
  5833. .select-wrapper span.caret.disabled {
  5834. color: rgba(0, 0, 0, 0.26);
  5835. }
  5836. .select-wrapper + label {
  5837. position: absolute;
  5838. top: -14px;
  5839. font-size: 0.8rem;
  5840. }
  5841. select:disabled {
  5842. color: rgba(0, 0, 0, 0.3);
  5843. }
  5844. .select-wrapper input.select-dropdown:disabled {
  5845. color: rgba(0, 0, 0, 0.3);
  5846. cursor: default;
  5847. -webkit-user-select: none;
  5848. /* webkit (safari, chrome) browsers */
  5849. -moz-user-select: none;
  5850. /* mozilla browsers */
  5851. -ms-user-select: none;
  5852. /* IE10+ */
  5853. border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  5854. }
  5855. .select-wrapper i {
  5856. color: rgba(0, 0, 0, 0.3);
  5857. }
  5858. .select-dropdown li.disabled,
  5859. .select-dropdown li.disabled > span,
  5860. .select-dropdown li.optgroup {
  5861. color: rgba(0, 0, 0, 0.3);
  5862. background-color: transparent;
  5863. }
  5864. .prefix ~ .select-wrapper {
  5865. margin-left: 3rem;
  5866. width: 92%;
  5867. width: calc(100% - 3rem);
  5868. }
  5869. .prefix ~ label {
  5870. margin-left: 3rem;
  5871. }
  5872. .select-dropdown li img {
  5873. height: 40px;
  5874. width: 40px;
  5875. margin: 5px 15px;
  5876. float: right;
  5877. }
  5878. .select-dropdown li.optgroup {
  5879. border-top: 1px solid #eee;
  5880. }
  5881. .select-dropdown li.optgroup.selected > span {
  5882. color: rgba(0, 0, 0, 0.7);
  5883. }
  5884. .select-dropdown li.optgroup > span {
  5885. color: rgba(0, 0, 0, 0.4);
  5886. }
  5887. .select-dropdown li.optgroup ~ li.optgroup-option {
  5888. padding-left: 1rem;
  5889. }
  5890. /* File Input
  5891. ========================================================================== */
  5892. .file-field {
  5893. position: relative;
  5894. }
  5895. .file-field .file-path-wrapper {
  5896. overflow: hidden;
  5897. padding-left: 10px;
  5898. }
  5899. .file-field input.file-path {
  5900. width: 100%;
  5901. }
  5902. .file-field .btn, .file-field .btn-large {
  5903. float: left;
  5904. height: 3rem;
  5905. line-height: 3rem;
  5906. }
  5907. .file-field span {
  5908. cursor: pointer;
  5909. }
  5910. .file-field input[type=file] {
  5911. position: absolute;
  5912. top: 0;
  5913. right: 0;
  5914. left: 0;
  5915. bottom: 0;
  5916. width: 100%;
  5917. margin: 0;
  5918. padding: 0;
  5919. font-size: 20px;
  5920. cursor: pointer;
  5921. opacity: 0;
  5922. filter: alpha(opacity=0);
  5923. }
  5924. /* Range
  5925. ========================================================================== */
  5926. .range-field {
  5927. position: relative;
  5928. }
  5929. input[type=range],
  5930. input[type=range] + .thumb {
  5931. cursor: pointer;
  5932. }
  5933. input[type=range] {
  5934. position: relative;
  5935. background-color: transparent;
  5936. border: none;
  5937. outline: none;
  5938. width: 100%;
  5939. margin: 15px 0;
  5940. padding: 0;
  5941. }
  5942. input[type=range]:focus {
  5943. outline: none;
  5944. }
  5945. input[type=range] + .thumb {
  5946. position: absolute;
  5947. top: 10px;
  5948. left: 0;
  5949. border: none;
  5950. height: 0;
  5951. width: 0;
  5952. border-radius: 50%;
  5953. background-color: #26a69a;
  5954. margin-left: 7px;
  5955. -webkit-transform-origin: 50% 50%;
  5956. transform-origin: 50% 50%;
  5957. -webkit-transform: rotate(-45deg);
  5958. transform: rotate(-45deg);
  5959. }
  5960. input[type=range] + .thumb .value {
  5961. display: block;
  5962. width: 30px;
  5963. text-align: center;
  5964. color: #26a69a;
  5965. font-size: 0;
  5966. -webkit-transform: rotate(45deg);
  5967. transform: rotate(45deg);
  5968. }
  5969. input[type=range] + .thumb.active {
  5970. border-radius: 50% 50% 50% 0;
  5971. }
  5972. input[type=range] + .thumb.active .value {
  5973. color: #fff;
  5974. margin-left: -1px;
  5975. margin-top: 8px;
  5976. font-size: 10px;
  5977. }
  5978. input[type=range] {
  5979. -webkit-appearance: none;
  5980. }
  5981. input[type=range]::-webkit-slider-runnable-track {
  5982. height: 3px;
  5983. background: #c2c0c2;
  5984. border: none;
  5985. }
  5986. input[type=range]::-webkit-slider-thumb {
  5987. -webkit-appearance: none;
  5988. border: none;
  5989. height: 14px;
  5990. width: 14px;
  5991. border-radius: 50%;
  5992. background-color: #26a69a;
  5993. -webkit-transform-origin: 50% 50%;
  5994. transform-origin: 50% 50%;
  5995. margin: -5px 0 0 0;
  5996. -webkit-transition: .3s;
  5997. transition: .3s;
  5998. }
  5999. input[type=range]:focus::-webkit-slider-runnable-track {
  6000. background: #ccc;
  6001. }
  6002. input[type=range] {
  6003. /* fix for FF unable to apply focus style bug */
  6004. border: 1px solid white;
  6005. /*required for proper track sizing in FF*/
  6006. }
  6007. input[type=range]::-moz-range-track {
  6008. height: 3px;
  6009. background: #ddd;
  6010. border: none;
  6011. }
  6012. input[type=range]::-moz-range-thumb {
  6013. border: none;
  6014. height: 14px;
  6015. width: 14px;
  6016. border-radius: 50%;
  6017. background: #26a69a;
  6018. margin-top: -5px;
  6019. }
  6020. input[type=range]:-moz-focusring {
  6021. outline: 1px solid #fff;
  6022. outline-offset: -1px;
  6023. }
  6024. input[type=range]:focus::-moz-range-track {
  6025. background: #ccc;
  6026. }
  6027. input[type=range]::-ms-track {
  6028. height: 3px;
  6029. background: transparent;
  6030. border-color: transparent;
  6031. border-width: 6px 0;
  6032. /*remove default tick marks*/
  6033. color: transparent;
  6034. }
  6035. input[type=range]::-ms-fill-lower {
  6036. background: #777;
  6037. }
  6038. input[type=range]::-ms-fill-upper {
  6039. background: #ddd;
  6040. }
  6041. input[type=range]::-ms-thumb {
  6042. border: none;
  6043. height: 14px;
  6044. width: 14px;
  6045. border-radius: 50%;
  6046. background: #26a69a;
  6047. }
  6048. input[type=range]:focus::-ms-fill-lower {
  6049. background: #888;
  6050. }
  6051. input[type=range]:focus::-ms-fill-upper {
  6052. background: #ccc;
  6053. }
  6054. /***************
  6055. Nav List
  6056. ***************/
  6057. .table-of-contents.fixed {
  6058. position: fixed;
  6059. }
  6060. .table-of-contents li {
  6061. padding: 2px 0;
  6062. }
  6063. .table-of-contents a {
  6064. display: inline-block;
  6065. font-weight: 300;
  6066. color: #757575;
  6067. padding-left: 20px;
  6068. height: 1.5rem;
  6069. line-height: 1.5rem;
  6070. letter-spacing: .4;
  6071. display: inline-block;
  6072. }
  6073. .table-of-contents a:hover {
  6074. color: #a8a8a8;
  6075. padding-left: 19px;
  6076. border-left: 1px solid #ee6e73;
  6077. }
  6078. .table-of-contents a.active {
  6079. font-weight: 500;
  6080. padding-left: 18px;
  6081. border-left: 2px solid #ee6e73;
  6082. }
  6083. .side-nav {
  6084. position: fixed;
  6085. width: 300px;
  6086. left: 0;
  6087. top: 0;
  6088. margin: 0;
  6089. -webkit-transform: translateX(-100%);
  6090. transform: translateX(-100%);
  6091. height: 100%;
  6092. height: calc(100% + 60px);
  6093. height: -moz-calc(100%);
  6094. padding-bottom: 60px;
  6095. background-color: #fff;
  6096. z-index: 999;
  6097. overflow-y: auto;
  6098. will-change: transform;
  6099. -webkit-backface-visibility: hidden;
  6100. backface-visibility: hidden;
  6101. -webkit-transform: translateX(-105%);
  6102. transform: translateX(-105%);
  6103. }
  6104. .side-nav.right-aligned {
  6105. right: 0;
  6106. -webkit-transform: translateX(105%);
  6107. transform: translateX(105%);
  6108. left: auto;
  6109. -webkit-transform: translateX(100%);
  6110. transform: translateX(100%);
  6111. }
  6112. .side-nav .collapsible {
  6113. margin: 0;
  6114. }
  6115. .side-nav li {
  6116. float: none;
  6117. line-height: 48px;
  6118. }
  6119. .side-nav li.active {
  6120. background-color: rgba(0, 0, 0, 0.05);
  6121. }
  6122. .side-nav li > a {
  6123. color: rgba(0, 0, 0, 0.87);
  6124. display: block;
  6125. font-size: 14px;
  6126. font-weight: 500;
  6127. height: 48px;
  6128. line-height: 48px;
  6129. padding: 0 32px;
  6130. }
  6131. .side-nav li > a:hover {
  6132. background-color: rgba(0, 0, 0, 0.05);
  6133. }
  6134. .side-nav li > a.btn, .side-nav li > a.btn-large, .side-nav li > a.btn-large, .side-nav li > a.btn-flat, .side-nav li > a.btn-floating {
  6135. margin: 10px 15px;
  6136. }
  6137. .side-nav li > a.btn, .side-nav li > a.btn-large, .side-nav li > a.btn-large, .side-nav li > a.btn-floating {
  6138. color: #fff;
  6139. }
  6140. .side-nav li > a.btn-flat {
  6141. color: #343434;
  6142. }
  6143. .side-nav li > a.btn:hover, .side-nav li > a.btn-large:hover, .side-nav li > a.btn-large:hover {
  6144. background-color: #2bbbad;
  6145. }
  6146. .side-nav li > a.btn-floating:hover {
  6147. background-color: #26a69a;
  6148. }
  6149. .side-nav li > a > i,
  6150. .side-nav li > a > [class^="mdi-"], .side-nav li > a li > a > [class*="mdi-"],
  6151. .side-nav li > a > i.material-icons {
  6152. float: left;
  6153. height: 48px;
  6154. line-height: 48px;
  6155. margin: 0 32px 0 0;
  6156. width: 24px;
  6157. color: rgba(0, 0, 0, 0.54);
  6158. }
  6159. .side-nav .divider {
  6160. margin: 8px 0 0 0;
  6161. }
  6162. .side-nav .subheader {
  6163. cursor: initial;
  6164. pointer-events: none;
  6165. color: rgba(0, 0, 0, 0.54);
  6166. font-size: 14px;
  6167. font-weight: 500;
  6168. line-height: 48px;
  6169. }
  6170. .side-nav .subheader:hover {
  6171. background-color: transparent;
  6172. }
  6173. .side-nav .user-view,
  6174. .side-nav .userView {
  6175. position: relative;
  6176. padding: 32px 32px 0;
  6177. margin-bottom: 8px;
  6178. }
  6179. .side-nav .user-view > a,
  6180. .side-nav .userView > a {
  6181. height: auto;
  6182. padding: 0;
  6183. }
  6184. .side-nav .user-view > a:hover,
  6185. .side-nav .userView > a:hover {
  6186. background-color: transparent;
  6187. }
  6188. .side-nav .user-view .background,
  6189. .side-nav .userView .background {
  6190. overflow: hidden;
  6191. position: absolute;
  6192. top: 0;
  6193. right: 0;
  6194. bottom: 0;
  6195. left: 0;
  6196. z-index: -1;
  6197. }
  6198. .side-nav .user-view .circle, .side-nav .user-view .name, .side-nav .user-view .email,
  6199. .side-nav .userView .circle,
  6200. .side-nav .userView .name,
  6201. .side-nav .userView .email {
  6202. display: block;
  6203. }
  6204. .side-nav .user-view .circle,
  6205. .side-nav .userView .circle {
  6206. height: 64px;
  6207. width: 64px;
  6208. }
  6209. .side-nav .user-view .name,
  6210. .side-nav .user-view .email,
  6211. .side-nav .userView .name,
  6212. .side-nav .userView .email {
  6213. font-size: 14px;
  6214. line-height: 24px;
  6215. }
  6216. .side-nav .user-view .name,
  6217. .side-nav .userView .name {
  6218. margin-top: 16px;
  6219. font-weight: 500;
  6220. }
  6221. .side-nav .user-view .email,
  6222. .side-nav .userView .email {
  6223. padding-bottom: 16px;
  6224. font-weight: 400;
  6225. }
  6226. .drag-target {
  6227. height: 100%;
  6228. width: 10px;
  6229. position: fixed;
  6230. top: 0;
  6231. z-index: 998;
  6232. }
  6233. .side-nav.fixed {
  6234. left: 0;
  6235. -webkit-transform: translateX(0);
  6236. transform: translateX(0);
  6237. position: fixed;
  6238. }
  6239. .side-nav.fixed.right-aligned {
  6240. right: 0;
  6241. left: auto;
  6242. }
  6243. @media only screen and (max-width: 992px) {
  6244. .side-nav.fixed {
  6245. -webkit-transform: translateX(-105%);
  6246. transform: translateX(-105%);
  6247. }
  6248. .side-nav.fixed.right-aligned {
  6249. -webkit-transform: translateX(105%);
  6250. transform: translateX(105%);
  6251. }
  6252. .side-nav a {
  6253. padding: 0 16px;
  6254. }
  6255. .side-nav .user-view,
  6256. .side-nav .userView {
  6257. padding: 16px 16px 0;
  6258. }
  6259. }
  6260. .side-nav .collapsible-body > ul:not(.collapsible) > li.active,
  6261. .side-nav.fixed .collapsible-body > ul:not(.collapsible) > li.active {
  6262. background-color: #ee6e73;
  6263. }
  6264. .side-nav .collapsible-body > ul:not(.collapsible) > li.active a,
  6265. .side-nav.fixed .collapsible-body > ul:not(.collapsible) > li.active a {
  6266. color: #fff;
  6267. }
  6268. .side-nav .collapsible-body {
  6269. padding: 0;
  6270. }
  6271. #sidenav-overlay {
  6272. position: fixed;
  6273. top: 0;
  6274. left: 0;
  6275. right: 0;
  6276. height: 120vh;
  6277. background-color: rgba(0, 0, 0, 0.5);
  6278. z-index: 997;
  6279. will-change: opacity;
  6280. }
  6281. /*
  6282. @license
  6283. Copyright (c) 2014 The Polymer Project Authors. All rights reserved.
  6284. This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
  6285. The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
  6286. The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
  6287. Code distributed by Google as part of the polymer project is also
  6288. subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
  6289. */
  6290. /**************************/
  6291. /* STYLES FOR THE SPINNER */
  6292. /**************************/
  6293. /*
  6294. * Constants:
  6295. * STROKEWIDTH = 3px
  6296. * ARCSIZE = 270 degrees (amount of circle the arc takes up)
  6297. * ARCTIME = 1333ms (time it takes to expand and contract arc)
  6298. * ARCSTARTROT = 216 degrees (how much the start location of the arc
  6299. * should rotate each time, 216 gives us a
  6300. * 5 pointed star shape (it's 360/5 * 3).
  6301. * For a 7 pointed star, we might do
  6302. * 360/7 * 3 = 154.286)
  6303. * CONTAINERWIDTH = 28px
  6304. * SHRINK_TIME = 400ms
  6305. */
  6306. .preloader-wrapper {
  6307. display: inline-block;
  6308. position: relative;
  6309. width: 50px;
  6310. height: 50px;
  6311. }
  6312. .preloader-wrapper.small {
  6313. width: 36px;
  6314. height: 36px;
  6315. }
  6316. .preloader-wrapper.big {
  6317. width: 64px;
  6318. height: 64px;
  6319. }
  6320. .preloader-wrapper.active {
  6321. /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */
  6322. -webkit-animation: container-rotate 1568ms linear infinite;
  6323. animation: container-rotate 1568ms linear infinite;
  6324. }
  6325. @-webkit-keyframes container-rotate {
  6326. to {
  6327. -webkit-transform: rotate(360deg);
  6328. }
  6329. }
  6330. @keyframes container-rotate {
  6331. to {
  6332. -webkit-transform: rotate(360deg);
  6333. transform: rotate(360deg);
  6334. }
  6335. }
  6336. .spinner-layer {
  6337. position: absolute;
  6338. width: 100%;
  6339. height: 100%;
  6340. opacity: 0;
  6341. border-color: #26a69a;
  6342. }
  6343. .spinner-blue,
  6344. .spinner-blue-only {
  6345. border-color: #4285f4;
  6346. }
  6347. .spinner-red,
  6348. .spinner-red-only {
  6349. border-color: #db4437;
  6350. }
  6351. .spinner-yellow,
  6352. .spinner-yellow-only {
  6353. border-color: #f4b400;
  6354. }
  6355. .spinner-green,
  6356. .spinner-green-only {
  6357. border-color: #0f9d58;
  6358. }
  6359. /**
  6360. * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee):
  6361. *
  6362. * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't
  6363. * guarantee that the animation will start _exactly_ after that value. So we avoid using
  6364. * animation-delay and instead set custom keyframes for each color (as redundant as it
  6365. * seems).
  6366. *
  6367. * We write out each animation in full (instead of separating animation-name,
  6368. * animation-duration, etc.) because under the polyfill, Safari does not recognize those
  6369. * specific properties properly, treats them as -webkit-animation, and overrides the
  6370. * other animation rules. See https://github.com/Polymer/platform/issues/53.
  6371. */
  6372. .active .spinner-layer.spinner-blue {
  6373. /* durations: 4 * ARCTIME */
  6374. -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6375. animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6376. }
  6377. .active .spinner-layer.spinner-red {
  6378. /* durations: 4 * ARCTIME */
  6379. -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6380. animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6381. }
  6382. .active .spinner-layer.spinner-yellow {
  6383. /* durations: 4 * ARCTIME */
  6384. -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6385. animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6386. }
  6387. .active .spinner-layer.spinner-green {
  6388. /* durations: 4 * ARCTIME */
  6389. -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6390. animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6391. }
  6392. .active .spinner-layer,
  6393. .active .spinner-layer.spinner-blue-only,
  6394. .active .spinner-layer.spinner-red-only,
  6395. .active .spinner-layer.spinner-yellow-only,
  6396. .active .spinner-layer.spinner-green-only {
  6397. /* durations: 4 * ARCTIME */
  6398. opacity: 1;
  6399. -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6400. animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6401. }
  6402. @-webkit-keyframes fill-unfill-rotate {
  6403. 12.5% {
  6404. -webkit-transform: rotate(135deg);
  6405. }
  6406. /* 0.5 * ARCSIZE */
  6407. 25% {
  6408. -webkit-transform: rotate(270deg);
  6409. }
  6410. /* 1 * ARCSIZE */
  6411. 37.5% {
  6412. -webkit-transform: rotate(405deg);
  6413. }
  6414. /* 1.5 * ARCSIZE */
  6415. 50% {
  6416. -webkit-transform: rotate(540deg);
  6417. }
  6418. /* 2 * ARCSIZE */
  6419. 62.5% {
  6420. -webkit-transform: rotate(675deg);
  6421. }
  6422. /* 2.5 * ARCSIZE */
  6423. 75% {
  6424. -webkit-transform: rotate(810deg);
  6425. }
  6426. /* 3 * ARCSIZE */
  6427. 87.5% {
  6428. -webkit-transform: rotate(945deg);
  6429. }
  6430. /* 3.5 * ARCSIZE */
  6431. to {
  6432. -webkit-transform: rotate(1080deg);
  6433. }
  6434. /* 4 * ARCSIZE */
  6435. }
  6436. @keyframes fill-unfill-rotate {
  6437. 12.5% {
  6438. -webkit-transform: rotate(135deg);
  6439. transform: rotate(135deg);
  6440. }
  6441. /* 0.5 * ARCSIZE */
  6442. 25% {
  6443. -webkit-transform: rotate(270deg);
  6444. transform: rotate(270deg);
  6445. }
  6446. /* 1 * ARCSIZE */
  6447. 37.5% {
  6448. -webkit-transform: rotate(405deg);
  6449. transform: rotate(405deg);
  6450. }
  6451. /* 1.5 * ARCSIZE */
  6452. 50% {
  6453. -webkit-transform: rotate(540deg);
  6454. transform: rotate(540deg);
  6455. }
  6456. /* 2 * ARCSIZE */
  6457. 62.5% {
  6458. -webkit-transform: rotate(675deg);
  6459. transform: rotate(675deg);
  6460. }
  6461. /* 2.5 * ARCSIZE */
  6462. 75% {
  6463. -webkit-transform: rotate(810deg);
  6464. transform: rotate(810deg);
  6465. }
  6466. /* 3 * ARCSIZE */
  6467. 87.5% {
  6468. -webkit-transform: rotate(945deg);
  6469. transform: rotate(945deg);
  6470. }
  6471. /* 3.5 * ARCSIZE */
  6472. to {
  6473. -webkit-transform: rotate(1080deg);
  6474. transform: rotate(1080deg);
  6475. }
  6476. /* 4 * ARCSIZE */
  6477. }
  6478. @-webkit-keyframes blue-fade-in-out {
  6479. from {
  6480. opacity: 1;
  6481. }
  6482. 25% {
  6483. opacity: 1;
  6484. }
  6485. 26% {
  6486. opacity: 0;
  6487. }
  6488. 89% {
  6489. opacity: 0;
  6490. }
  6491. 90% {
  6492. opacity: 1;
  6493. }
  6494. 100% {
  6495. opacity: 1;
  6496. }
  6497. }
  6498. @keyframes blue-fade-in-out {
  6499. from {
  6500. opacity: 1;
  6501. }
  6502. 25% {
  6503. opacity: 1;
  6504. }
  6505. 26% {
  6506. opacity: 0;
  6507. }
  6508. 89% {
  6509. opacity: 0;
  6510. }
  6511. 90% {
  6512. opacity: 1;
  6513. }
  6514. 100% {
  6515. opacity: 1;
  6516. }
  6517. }
  6518. @-webkit-keyframes red-fade-in-out {
  6519. from {
  6520. opacity: 0;
  6521. }
  6522. 15% {
  6523. opacity: 0;
  6524. }
  6525. 25% {
  6526. opacity: 1;
  6527. }
  6528. 50% {
  6529. opacity: 1;
  6530. }
  6531. 51% {
  6532. opacity: 0;
  6533. }
  6534. }
  6535. @keyframes red-fade-in-out {
  6536. from {
  6537. opacity: 0;
  6538. }
  6539. 15% {
  6540. opacity: 0;
  6541. }
  6542. 25% {
  6543. opacity: 1;
  6544. }
  6545. 50% {
  6546. opacity: 1;
  6547. }
  6548. 51% {
  6549. opacity: 0;
  6550. }
  6551. }
  6552. @-webkit-keyframes yellow-fade-in-out {
  6553. from {
  6554. opacity: 0;
  6555. }
  6556. 40% {
  6557. opacity: 0;
  6558. }
  6559. 50% {
  6560. opacity: 1;
  6561. }
  6562. 75% {
  6563. opacity: 1;
  6564. }
  6565. 76% {
  6566. opacity: 0;
  6567. }
  6568. }
  6569. @keyframes yellow-fade-in-out {
  6570. from {
  6571. opacity: 0;
  6572. }
  6573. 40% {
  6574. opacity: 0;
  6575. }
  6576. 50% {
  6577. opacity: 1;
  6578. }
  6579. 75% {
  6580. opacity: 1;
  6581. }
  6582. 76% {
  6583. opacity: 0;
  6584. }
  6585. }
  6586. @-webkit-keyframes green-fade-in-out {
  6587. from {
  6588. opacity: 0;
  6589. }
  6590. 65% {
  6591. opacity: 0;
  6592. }
  6593. 75% {
  6594. opacity: 1;
  6595. }
  6596. 90% {
  6597. opacity: 1;
  6598. }
  6599. 100% {
  6600. opacity: 0;
  6601. }
  6602. }
  6603. @keyframes green-fade-in-out {
  6604. from {
  6605. opacity: 0;
  6606. }
  6607. 65% {
  6608. opacity: 0;
  6609. }
  6610. 75% {
  6611. opacity: 1;
  6612. }
  6613. 90% {
  6614. opacity: 1;
  6615. }
  6616. 100% {
  6617. opacity: 0;
  6618. }
  6619. }
  6620. /**
  6621. * Patch the gap that appear between the two adjacent div.circle-clipper while the
  6622. * spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11).
  6623. */
  6624. .gap-patch {
  6625. position: absolute;
  6626. top: 0;
  6627. left: 45%;
  6628. width: 10%;
  6629. height: 100%;
  6630. overflow: hidden;
  6631. border-color: inherit;
  6632. }
  6633. .gap-patch .circle {
  6634. width: 1000%;
  6635. left: -450%;
  6636. }
  6637. .circle-clipper {
  6638. display: inline-block;
  6639. position: relative;
  6640. width: 50%;
  6641. height: 100%;
  6642. overflow: hidden;
  6643. border-color: inherit;
  6644. }
  6645. .circle-clipper .circle {
  6646. width: 200%;
  6647. height: 100%;
  6648. border-width: 3px;
  6649. /* STROKEWIDTH */
  6650. border-style: solid;
  6651. border-color: inherit;
  6652. border-bottom-color: transparent !important;
  6653. border-radius: 50%;
  6654. -webkit-animation: none;
  6655. animation: none;
  6656. position: absolute;
  6657. top: 0;
  6658. right: 0;
  6659. bottom: 0;
  6660. }
  6661. .circle-clipper.left .circle {
  6662. left: 0;
  6663. border-right-color: transparent !important;
  6664. -webkit-transform: rotate(129deg);
  6665. transform: rotate(129deg);
  6666. }
  6667. .circle-clipper.right .circle {
  6668. left: -100%;
  6669. border-left-color: transparent !important;
  6670. -webkit-transform: rotate(-129deg);
  6671. transform: rotate(-129deg);
  6672. }
  6673. .active .circle-clipper.left .circle {
  6674. /* duration: ARCTIME */
  6675. -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6676. animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6677. }
  6678. .active .circle-clipper.right .circle {
  6679. /* duration: ARCTIME */
  6680. -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6681. animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both;
  6682. }
  6683. @-webkit-keyframes left-spin {
  6684. from {
  6685. -webkit-transform: rotate(130deg);
  6686. }
  6687. 50% {
  6688. -webkit-transform: rotate(-5deg);
  6689. }
  6690. to {
  6691. -webkit-transform: rotate(130deg);
  6692. }
  6693. }
  6694. @keyframes left-spin {
  6695. from {
  6696. -webkit-transform: rotate(130deg);
  6697. transform: rotate(130deg);
  6698. }
  6699. 50% {
  6700. -webkit-transform: rotate(-5deg);
  6701. transform: rotate(-5deg);
  6702. }
  6703. to {
  6704. -webkit-transform: rotate(130deg);
  6705. transform: rotate(130deg);
  6706. }
  6707. }
  6708. @-webkit-keyframes right-spin {
  6709. from {
  6710. -webkit-transform: rotate(-130deg);
  6711. }
  6712. 50% {
  6713. -webkit-transform: rotate(5deg);
  6714. }
  6715. to {
  6716. -webkit-transform: rotate(-130deg);
  6717. }
  6718. }
  6719. @keyframes right-spin {
  6720. from {
  6721. -webkit-transform: rotate(-130deg);
  6722. transform: rotate(-130deg);
  6723. }
  6724. 50% {
  6725. -webkit-transform: rotate(5deg);
  6726. transform: rotate(5deg);
  6727. }
  6728. to {
  6729. -webkit-transform: rotate(-130deg);
  6730. transform: rotate(-130deg);
  6731. }
  6732. }
  6733. #spinnerContainer.cooldown {
  6734. /* duration: SHRINK_TIME */
  6735. -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1);
  6736. animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1);
  6737. }
  6738. @-webkit-keyframes fade-out {
  6739. from {
  6740. opacity: 1;
  6741. }
  6742. to {
  6743. opacity: 0;
  6744. }
  6745. }
  6746. @keyframes fade-out {
  6747. from {
  6748. opacity: 1;
  6749. }
  6750. to {
  6751. opacity: 0;
  6752. }
  6753. }
  6754. .slider {
  6755. position: relative;
  6756. height: 400px;
  6757. width: 100%;
  6758. }
  6759. .slider.fullscreen {
  6760. height: 100%;
  6761. width: 100%;
  6762. position: absolute;
  6763. top: 0;
  6764. left: 0;
  6765. right: 0;
  6766. bottom: 0;
  6767. }
  6768. .slider.fullscreen ul.slides {
  6769. height: 100%;
  6770. }
  6771. .slider.fullscreen ul.indicators {
  6772. z-index: 2;
  6773. bottom: 30px;
  6774. }
  6775. .slider .slides {
  6776. background-color: #9e9e9e;
  6777. margin: 0;
  6778. height: 400px;
  6779. }
  6780. .slider .slides li {
  6781. opacity: 0;
  6782. position: absolute;
  6783. top: 0;
  6784. left: 0;
  6785. z-index: 1;
  6786. width: 100%;
  6787. height: inherit;
  6788. overflow: hidden;
  6789. }
  6790. .slider .slides li img {
  6791. height: 100%;
  6792. width: 100%;
  6793. background-size: cover;
  6794. background-position: center;
  6795. }
  6796. .slider .slides li .caption {
  6797. color: #fff;
  6798. position: absolute;
  6799. top: 15%;
  6800. left: 15%;
  6801. width: 70%;
  6802. opacity: 0;
  6803. }
  6804. .slider .slides li .caption p {
  6805. color: #e0e0e0;
  6806. }
  6807. .slider .slides li.active {
  6808. z-index: 2;
  6809. }
  6810. .slider .indicators {
  6811. position: absolute;
  6812. text-align: center;
  6813. left: 0;
  6814. right: 0;
  6815. bottom: 0;
  6816. margin: 0;
  6817. }
  6818. .slider .indicators .indicator-item {
  6819. display: inline-block;
  6820. position: relative;
  6821. cursor: pointer;
  6822. height: 16px;
  6823. width: 16px;
  6824. margin: 0 12px;
  6825. background-color: #e0e0e0;
  6826. -webkit-transition: background-color .3s;
  6827. transition: background-color .3s;
  6828. border-radius: 50%;
  6829. }
  6830. .slider .indicators .indicator-item.active {
  6831. background-color: #4CAF50;
  6832. }
  6833. .carousel {
  6834. overflow: hidden;
  6835. position: relative;
  6836. width: 100%;
  6837. height: 400px;
  6838. -webkit-perspective: 500px;
  6839. perspective: 500px;
  6840. -webkit-transform-style: preserve-3d;
  6841. transform-style: preserve-3d;
  6842. -webkit-transform-origin: 0% 50%;
  6843. transform-origin: 0% 50%;
  6844. }
  6845. .carousel.carousel-slider {
  6846. top: 0;
  6847. left: 0;
  6848. height: 0;
  6849. }
  6850. .carousel.carousel-slider .carousel-fixed-item {
  6851. position: absolute;
  6852. left: 0;
  6853. right: 0;
  6854. bottom: 20px;
  6855. z-index: 1;
  6856. }
  6857. .carousel.carousel-slider .carousel-fixed-item.with-indicators {
  6858. bottom: 68px;
  6859. }
  6860. .carousel.carousel-slider .carousel-item {
  6861. width: 100%;
  6862. height: 100%;
  6863. min-height: 400px;
  6864. position: absolute;
  6865. top: 0;
  6866. left: 0;
  6867. }
  6868. .carousel.carousel-slider .carousel-item h2 {
  6869. font-size: 24px;
  6870. font-weight: 500;
  6871. line-height: 32px;
  6872. }
  6873. .carousel.carousel-slider .carousel-item p {
  6874. font-size: 15px;
  6875. }
  6876. .carousel .carousel-item {
  6877. display: none;
  6878. width: 200px;
  6879. height: 200px;
  6880. position: absolute;
  6881. top: 0;
  6882. left: 0;
  6883. }
  6884. .carousel .carousel-item > img {
  6885. width: 100%;
  6886. }
  6887. .carousel .indicators {
  6888. position: absolute;
  6889. text-align: center;
  6890. left: 0;
  6891. right: 0;
  6892. bottom: 0;
  6893. margin: 0;
  6894. }
  6895. .carousel .indicators .indicator-item {
  6896. display: inline-block;
  6897. position: relative;
  6898. cursor: pointer;
  6899. height: 8px;
  6900. width: 8px;
  6901. margin: 24px 4px;
  6902. background-color: rgba(255, 255, 255, 0.5);
  6903. -webkit-transition: background-color .3s;
  6904. transition: background-color .3s;
  6905. border-radius: 50%;
  6906. }
  6907. .carousel .indicators .indicator-item.active {
  6908. background-color: #fff;
  6909. }
  6910. .carousel.scrolling .carousel-item .materialboxed,
  6911. .carousel .carousel-item:not(.active) .materialboxed {
  6912. pointer-events: none;
  6913. }
  6914. .tap-target-wrapper {
  6915. width: 800px;
  6916. height: 800px;
  6917. position: fixed;
  6918. z-index: 1000;
  6919. visibility: hidden;
  6920. -webkit-transition: visibility 0s .3s;
  6921. transition: visibility 0s .3s;
  6922. }
  6923. .tap-target-wrapper.open {
  6924. visibility: visible;
  6925. -webkit-transition: visibility 0s;
  6926. transition: visibility 0s;
  6927. }
  6928. .tap-target-wrapper.open .tap-target {
  6929. -webkit-transform: scale(1);
  6930. transform: scale(1);
  6931. opacity: .95;
  6932. -webkit-transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6933. transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6934. transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6935. transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6936. }
  6937. .tap-target-wrapper.open .tap-target-wave::before {
  6938. -webkit-transform: scale(1);
  6939. transform: scale(1);
  6940. }
  6941. .tap-target-wrapper.open .tap-target-wave::after {
  6942. visibility: visible;
  6943. -webkit-animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  6944. animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  6945. -webkit-transition: opacity .3s, visibility 0s 1s, -webkit-transform .3s;
  6946. transition: opacity .3s, visibility 0s 1s, -webkit-transform .3s;
  6947. transition: opacity .3s, transform .3s, visibility 0s 1s;
  6948. transition: opacity .3s, transform .3s, visibility 0s 1s, -webkit-transform .3s;
  6949. }
  6950. .tap-target {
  6951. position: absolute;
  6952. font-size: 1rem;
  6953. border-radius: 50%;
  6954. background-color: #ee6e73;
  6955. -webkit-box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.14), 0 10px 50px 0 rgba(0, 0, 0, 0.12), 0 30px 10px -20px rgba(0, 0, 0, 0.2);
  6956. box-shadow: 0 20px 20px 0 rgba(0, 0, 0, 0.14), 0 10px 50px 0 rgba(0, 0, 0, 0.12), 0 30px 10px -20px rgba(0, 0, 0, 0.2);
  6957. width: 100%;
  6958. height: 100%;
  6959. opacity: 0;
  6960. -webkit-transform: scale(0);
  6961. transform: scale(0);
  6962. -webkit-transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6963. transition: opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6964. transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6965. transition: transform 0.3s cubic-bezier(0.42, 0, 0.58, 1), opacity 0.3s cubic-bezier(0.42, 0, 0.58, 1), -webkit-transform 0.3s cubic-bezier(0.42, 0, 0.58, 1);
  6966. }
  6967. .tap-target-content {
  6968. position: relative;
  6969. display: table-cell;
  6970. }
  6971. .tap-target-wave {
  6972. position: absolute;
  6973. border-radius: 50%;
  6974. z-index: 10001;
  6975. }
  6976. .tap-target-wave::before, .tap-target-wave::after {
  6977. content: '';
  6978. display: block;
  6979. position: absolute;
  6980. width: 100%;
  6981. height: 100%;
  6982. border-radius: 50%;
  6983. background-color: #ffffff;
  6984. }
  6985. .tap-target-wave::before {
  6986. -webkit-transform: scale(0);
  6987. transform: scale(0);
  6988. -webkit-transition: -webkit-transform .3s;
  6989. transition: -webkit-transform .3s;
  6990. transition: transform .3s;
  6991. transition: transform .3s, -webkit-transform .3s;
  6992. }
  6993. .tap-target-wave::after {
  6994. visibility: hidden;
  6995. -webkit-transition: opacity .3s, visibility 0s, -webkit-transform .3s;
  6996. transition: opacity .3s, visibility 0s, -webkit-transform .3s;
  6997. transition: opacity .3s, transform .3s, visibility 0s;
  6998. transition: opacity .3s, transform .3s, visibility 0s, -webkit-transform .3s;
  6999. z-index: -1;
  7000. }
  7001. .tap-target-origin {
  7002. top: 50%;
  7003. left: 50%;
  7004. -webkit-transform: translate(-50%, -50%);
  7005. transform: translate(-50%, -50%);
  7006. z-index: 10002;
  7007. position: absolute !important;
  7008. }
  7009. .tap-target-origin:not(.btn):not(.btn-large), .tap-target-origin:not(.btn):not(.btn-large):hover {
  7010. background: none;
  7011. }
  7012. @media only screen and (max-width: 600px) {
  7013. .tap-target, .tap-target-wrapper {
  7014. width: 600px;
  7015. height: 600px;
  7016. }
  7017. }
  7018. .pulse {
  7019. overflow: initial;
  7020. position: relative;
  7021. }
  7022. .pulse::before {
  7023. content: '';
  7024. display: block;
  7025. position: absolute;
  7026. width: 100%;
  7027. height: 100%;
  7028. top: 0;
  7029. left: 0;
  7030. background-color: inherit;
  7031. border-radius: inherit;
  7032. -webkit-transition: opacity .3s, -webkit-transform .3s;
  7033. transition: opacity .3s, -webkit-transform .3s;
  7034. transition: opacity .3s, transform .3s;
  7035. transition: opacity .3s, transform .3s, -webkit-transform .3s;
  7036. -webkit-animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  7037. animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
  7038. z-index: -1;
  7039. }
  7040. @-webkit-keyframes pulse-animation {
  7041. 0% {
  7042. opacity: 1;
  7043. -webkit-transform: scale(1);
  7044. transform: scale(1);
  7045. }
  7046. 50% {
  7047. opacity: 0;
  7048. -webkit-transform: scale(1.5);
  7049. transform: scale(1.5);
  7050. }
  7051. 100% {
  7052. opacity: 0;
  7053. -webkit-transform: scale(1.5);
  7054. transform: scale(1.5);
  7055. }
  7056. }
  7057. @keyframes pulse-animation {
  7058. 0% {
  7059. opacity: 1;
  7060. -webkit-transform: scale(1);
  7061. transform: scale(1);
  7062. }
  7063. 50% {
  7064. opacity: 0;
  7065. -webkit-transform: scale(1.5);
  7066. transform: scale(1.5);
  7067. }
  7068. 100% {
  7069. opacity: 0;
  7070. -webkit-transform: scale(1.5);
  7071. transform: scale(1.5);
  7072. }
  7073. }
  7074. /* ==========================================================================
  7075. $BASE-PICKER
  7076. ========================================================================== */
  7077. /**
  7078. * Note: the root picker element should *NOT* be styled more than what's here.
  7079. */
  7080. .picker {
  7081. font-size: 16px;
  7082. text-align: left;
  7083. line-height: 1.2;
  7084. color: #000000;
  7085. position: absolute;
  7086. z-index: 10000;
  7087. -webkit-user-select: none;
  7088. -moz-user-select: none;
  7089. -ms-user-select: none;
  7090. user-select: none;
  7091. }
  7092. /**
  7093. * The picker input element.
  7094. */
  7095. .picker__input {
  7096. cursor: default;
  7097. }
  7098. /**
  7099. * When the picker is opened, the input element is "activated".
  7100. */
  7101. .picker__input.picker__input--active {
  7102. border-color: #0089ec;
  7103. }
  7104. /**
  7105. * The holder is the only "scrollable" top-level container element.
  7106. */
  7107. .picker__holder {
  7108. width: 100%;
  7109. overflow-y: auto;
  7110. -webkit-overflow-scrolling: touch;
  7111. }
  7112. /*!
  7113. * Default mobile-first, responsive styling for pickadate.js
  7114. * Demo: http://amsul.github.io/pickadate.js
  7115. */
  7116. /**
  7117. * Note: the root picker element should *NOT* be styled more than what's here.
  7118. */
  7119. /**
  7120. * Make the holder and frame fullscreen.
  7121. */
  7122. .picker__holder,
  7123. .picker__frame {
  7124. bottom: 0;
  7125. left: 0;
  7126. right: 0;
  7127. top: 100%;
  7128. }
  7129. /**
  7130. * The holder should overlay the entire screen.
  7131. */
  7132. .picker__holder {
  7133. position: fixed;
  7134. -webkit-transition: background 0.15s ease-out, top 0s 0.15s;
  7135. transition: background 0.15s ease-out, top 0s 0.15s;
  7136. -webkit-backface-visibility: hidden;
  7137. }
  7138. /**
  7139. * The frame that bounds the box contents of the picker.
  7140. */
  7141. .picker__frame {
  7142. position: absolute;
  7143. margin: 0 auto;
  7144. min-width: 256px;
  7145. width: 300px;
  7146. max-height: 350px;
  7147. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  7148. filter: alpha(opacity=0);
  7149. -moz-opacity: 0;
  7150. opacity: 0;
  7151. -webkit-transition: all 0.15s ease-out;
  7152. transition: all 0.15s ease-out;
  7153. }
  7154. @media (min-height: 28.875em) {
  7155. .picker__frame {
  7156. overflow: visible;
  7157. top: auto;
  7158. bottom: -100%;
  7159. max-height: 80%;
  7160. }
  7161. }
  7162. @media (min-height: 40.125em) {
  7163. .picker__frame {
  7164. margin-bottom: 7.5%;
  7165. }
  7166. }
  7167. /**
  7168. * The wrapper sets the stage to vertically align the box contents.
  7169. */
  7170. .picker__wrap {
  7171. display: table;
  7172. width: 100%;
  7173. height: 100%;
  7174. }
  7175. @media (min-height: 28.875em) {
  7176. .picker__wrap {
  7177. display: block;
  7178. }
  7179. }
  7180. /**
  7181. * The box contains all the picker contents.
  7182. */
  7183. .picker__box {
  7184. background: #ffffff;
  7185. display: table-cell;
  7186. vertical-align: middle;
  7187. }
  7188. @media (min-height: 28.875em) {
  7189. .picker__box {
  7190. display: block;
  7191. border: 1px solid #777777;
  7192. border-top-color: #898989;
  7193. border-bottom-width: 0;
  7194. border-radius: 5px 5px 0 0;
  7195. -webkit-box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);
  7196. box-shadow: 0 12px 36px 16px rgba(0, 0, 0, 0.24);
  7197. }
  7198. }
  7199. /**
  7200. * When the picker opens...
  7201. */
  7202. .picker--opened .picker__holder {
  7203. top: 0;
  7204. background: transparent;
  7205. -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000,endColorstr=#1E000000)";
  7206. zoom: 1;
  7207. background: rgba(0, 0, 0, 0.32);
  7208. -webkit-transition: background 0.15s ease-out;
  7209. transition: background 0.15s ease-out;
  7210. }
  7211. .picker--opened .picker__frame {
  7212. top: 0;
  7213. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  7214. filter: alpha(opacity=100);
  7215. -moz-opacity: 1;
  7216. opacity: 1;
  7217. }
  7218. @media (min-height: 35.875em) {
  7219. .picker--opened .picker__frame {
  7220. top: 10%;
  7221. bottom: auto;
  7222. }
  7223. }
  7224. /**
  7225. * For `large` screens, transform into an inline picker.
  7226. */
  7227. /* ==========================================================================
  7228. CUSTOM MATERIALIZE STYLES
  7229. ========================================================================== */
  7230. .picker__input.picker__input--active {
  7231. border-color: #E3F2FD;
  7232. }
  7233. .picker__frame {
  7234. margin: 0 auto;
  7235. max-width: 325px;
  7236. }
  7237. @media (min-height: 38.875em) {
  7238. .picker--opened .picker__frame {
  7239. top: 10%;
  7240. bottom: auto;
  7241. }
  7242. }
  7243. @media only screen and (min-width: 601px) {
  7244. .picker__box {
  7245. display: -webkit-box;
  7246. display: -webkit-flex;
  7247. display: -ms-flexbox;
  7248. display: flex;
  7249. }
  7250. .picker__frame {
  7251. width: 80%;
  7252. max-width: 600px;
  7253. }
  7254. }
  7255. /* ==========================================================================
  7256. $BASE-DATE-PICKER
  7257. ========================================================================== */
  7258. /**
  7259. * The picker box.
  7260. */
  7261. .picker__box {
  7262. padding: 0;
  7263. border-radius: 2px;
  7264. overflow: hidden;
  7265. }
  7266. /**
  7267. * The header containing the month and year stuff.
  7268. */
  7269. .picker__header {
  7270. text-align: center;
  7271. position: relative;
  7272. margin-top: .75em;
  7273. }
  7274. /**
  7275. * The month and year labels.
  7276. */
  7277. .picker__month,
  7278. .picker__year {
  7279. display: inline-block;
  7280. margin-left: .25em;
  7281. margin-right: .25em;
  7282. }
  7283. /**
  7284. * The month and year selectors.
  7285. */
  7286. .picker__select--month,
  7287. .picker__select--year {
  7288. height: 2em;
  7289. padding: 0;
  7290. margin-left: .25em;
  7291. margin-right: .25em;
  7292. }
  7293. .picker__select--month.browser-default {
  7294. display: inline;
  7295. background-color: #FFFFFF;
  7296. width: 40%;
  7297. }
  7298. .picker__select--year.browser-default {
  7299. display: inline;
  7300. background-color: #FFFFFF;
  7301. width: 26%;
  7302. }
  7303. .picker__select--month:focus,
  7304. .picker__select--year:focus {
  7305. border-color: rgba(0, 0, 0, 0.05);
  7306. }
  7307. /**
  7308. * The month navigation buttons.
  7309. */
  7310. .picker__nav--prev,
  7311. .picker__nav--next {
  7312. position: absolute;
  7313. padding: .5em 1.25em;
  7314. width: 1em;
  7315. height: 1em;
  7316. -webkit-box-sizing: content-box;
  7317. box-sizing: content-box;
  7318. top: -0.25em;
  7319. }
  7320. .picker__nav--prev {
  7321. left: -1em;
  7322. padding-right: 1.25em;
  7323. }
  7324. .picker__nav--next {
  7325. right: -1em;
  7326. padding-left: 1.25em;
  7327. }
  7328. .picker__nav--disabled,
  7329. .picker__nav--disabled:hover,
  7330. .picker__nav--disabled:before,
  7331. .picker__nav--disabled:before:hover {
  7332. cursor: default;
  7333. background: none;
  7334. border-right-color: #f5f5f5;
  7335. border-left-color: #f5f5f5;
  7336. }
  7337. /**
  7338. * The calendar table of dates
  7339. */
  7340. .picker__table {
  7341. text-align: center;
  7342. border-collapse: collapse;
  7343. border-spacing: 0;
  7344. table-layout: fixed;
  7345. font-size: 1rem;
  7346. width: 100%;
  7347. margin-top: .75em;
  7348. margin-bottom: .5em;
  7349. }
  7350. .picker__table th, .picker__table td {
  7351. text-align: center;
  7352. }
  7353. .picker__table td {
  7354. margin: 0;
  7355. padding: 0;
  7356. }
  7357. /**
  7358. * The weekday labels
  7359. */
  7360. .picker__weekday {
  7361. width: 14.285714286%;
  7362. font-size: .75em;
  7363. padding-bottom: .25em;
  7364. color: #999999;
  7365. font-weight: 500;
  7366. /* Increase the spacing a tad */
  7367. }
  7368. @media (min-height: 33.875em) {
  7369. .picker__weekday {
  7370. padding-bottom: .5em;
  7371. }
  7372. }
  7373. /**
  7374. * The days on the calendar
  7375. */
  7376. .picker__day--today {
  7377. position: relative;
  7378. color: #595959;
  7379. letter-spacing: -.3;
  7380. padding: .75rem 0;
  7381. font-weight: 400;
  7382. border: 1px solid transparent;
  7383. }
  7384. .picker__day--disabled:before {
  7385. border-top-color: #aaaaaa;
  7386. }
  7387. .picker__day--infocus:hover {
  7388. cursor: pointer;
  7389. color: #000;
  7390. font-weight: 500;
  7391. }
  7392. .picker__day--outfocus {
  7393. display: none;
  7394. padding: .75rem 0;
  7395. color: #fff;
  7396. }
  7397. .picker__day--outfocus:hover {
  7398. cursor: pointer;
  7399. color: #dddddd;
  7400. font-weight: 500;
  7401. }
  7402. .picker__day--highlighted:hover,
  7403. .picker--focused .picker__day--highlighted {
  7404. cursor: pointer;
  7405. }
  7406. .picker__day--selected,
  7407. .picker__day--selected:hover,
  7408. .picker--focused .picker__day--selected {
  7409. border-radius: 50%;
  7410. -webkit-transform: scale(0.75);
  7411. transform: scale(0.75);
  7412. background: #0089ec;
  7413. color: #ffffff;
  7414. }
  7415. .picker__day--disabled,
  7416. .picker__day--disabled:hover,
  7417. .picker--focused .picker__day--disabled {
  7418. background: #f5f5f5;
  7419. border-color: #f5f5f5;
  7420. color: #dddddd;
  7421. cursor: default;
  7422. }
  7423. .picker__day--highlighted.picker__day--disabled,
  7424. .picker__day--highlighted.picker__day--disabled:hover {
  7425. background: #bbbbbb;
  7426. }
  7427. /**
  7428. * The footer containing the "today", "clear", and "close" buttons.
  7429. */
  7430. .picker__footer {
  7431. text-align: right;
  7432. }
  7433. .picker__button--today,
  7434. .picker__button--clear,
  7435. .picker__button--close {
  7436. border: 1px solid #ffffff;
  7437. background: #ffffff;
  7438. font-size: .8em;
  7439. padding: .66em 0;
  7440. font-weight: bold;
  7441. width: 33%;
  7442. display: inline-block;
  7443. vertical-align: bottom;
  7444. }
  7445. .picker__button--today:hover,
  7446. .picker__button--clear:hover,
  7447. .picker__button--close:hover {
  7448. cursor: pointer;
  7449. color: #000000;
  7450. background: #b1dcfb;
  7451. border-bottom-color: #b1dcfb;
  7452. }
  7453. .picker__button--today:focus,
  7454. .picker__button--clear:focus,
  7455. .picker__button--close:focus {
  7456. background: #b1dcfb;
  7457. border-color: rgba(0, 0, 0, 0.05);
  7458. outline: none;
  7459. }
  7460. .picker__button--today:before,
  7461. .picker__button--clear:before,
  7462. .picker__button--close:before {
  7463. position: relative;
  7464. display: inline-block;
  7465. height: 0;
  7466. }
  7467. .picker__button--today:before,
  7468. .picker__button--clear:before {
  7469. content: " ";
  7470. margin-right: .45em;
  7471. }
  7472. .picker__button--today:before {
  7473. top: -0.05em;
  7474. width: 0;
  7475. border-top: 0.66em solid #0059bc;
  7476. border-left: .66em solid transparent;
  7477. }
  7478. .picker__button--clear:before {
  7479. top: -0.25em;
  7480. width: .66em;
  7481. border-top: 3px solid #ee2200;
  7482. }
  7483. .picker__button--close:before {
  7484. content: "\D7";
  7485. top: -0.1em;
  7486. vertical-align: top;
  7487. font-size: 1.1em;
  7488. margin-right: .35em;
  7489. color: #777777;
  7490. }
  7491. .picker__button--today[disabled],
  7492. .picker__button--today[disabled]:hover {
  7493. background: #f5f5f5;
  7494. border-color: #f5f5f5;
  7495. color: #dddddd;
  7496. cursor: default;
  7497. }
  7498. .picker__button--today[disabled]:before {
  7499. border-top-color: #aaaaaa;
  7500. }
  7501. /* ==========================================================================
  7502. CUSTOM MATERIALIZE STYLES
  7503. ========================================================================== */
  7504. /*.picker__box {
  7505. border-radius: 2px;
  7506. overflow: hidden;
  7507. }*/
  7508. .picker__date-display {
  7509. text-align: left;
  7510. background-color: #26a69a;
  7511. color: #fff;
  7512. padding: 18px;
  7513. font-weight: 300;
  7514. }
  7515. @media only screen and (min-width: 601px) {
  7516. .picker__date-display {
  7517. -webkit-box-flex: 1;
  7518. -webkit-flex: 1;
  7519. -ms-flex: 1;
  7520. flex: 1;
  7521. }
  7522. .picker__weekday-display {
  7523. display: block;
  7524. }
  7525. .picker__container__wrapper {
  7526. -webkit-box-flex: 2;
  7527. -webkit-flex: 2;
  7528. -ms-flex: 2;
  7529. flex: 2;
  7530. }
  7531. }
  7532. .picker__nav--prev:hover,
  7533. .picker__nav--next:hover {
  7534. cursor: pointer;
  7535. color: #000000;
  7536. background: #a1ded8;
  7537. }
  7538. .picker__weekday-display {
  7539. font-weight: 500;
  7540. font-size: 2.8rem;
  7541. margin-right: 5px;
  7542. margin-top: 4px;
  7543. }
  7544. .picker__month-display {
  7545. font-size: 2.8rem;
  7546. font-weight: 500;
  7547. }
  7548. .picker__day-display {
  7549. font-size: 2.8rem;
  7550. font-weight: 500;
  7551. margin-right: 5px;
  7552. }
  7553. .picker__year-display {
  7554. font-size: 1.5rem;
  7555. font-weight: 500;
  7556. color: rgba(255, 255, 255, 0.7);
  7557. }
  7558. /*.picker__box {
  7559. padding: 0;
  7560. }*/
  7561. .picker__calendar-container {
  7562. padding: 0 1rem;
  7563. }
  7564. .picker__calendar-container thead {
  7565. border: none;
  7566. }
  7567. .picker__table {
  7568. margin-top: 0;
  7569. margin-bottom: .5em;
  7570. }
  7571. .picker__day--infocus {
  7572. color: rgba(0, 0, 0, 0.87);
  7573. letter-spacing: -.3px;
  7574. padding: 0.75rem 0;
  7575. font-weight: 400;
  7576. border: 1px solid transparent;
  7577. }
  7578. @media only screen and (min-width: 601px) {
  7579. .picker__day--infocus {
  7580. padding: 1.1rem 0;
  7581. }
  7582. }
  7583. .picker__day.picker__day--today {
  7584. color: #26a69a;
  7585. }
  7586. .picker__day.picker__day--today.picker__day--selected {
  7587. color: #fff;
  7588. }
  7589. .picker__weekday {
  7590. font-size: .9rem;
  7591. }
  7592. .picker__day--selected,
  7593. .picker__day--selected:hover,
  7594. .picker--focused .picker__day--selected {
  7595. border-radius: 50%;
  7596. -webkit-transform: scale(0.9);
  7597. transform: scale(0.9);
  7598. background-color: #26a69a;
  7599. color: #ffffff;
  7600. }
  7601. .picker__day--selected.picker__day--outfocus,
  7602. .picker__day--selected:hover.picker__day--outfocus,
  7603. .picker--focused .picker__day--selected.picker__day--outfocus {
  7604. background-color: #a1ded8;
  7605. }
  7606. .picker__footer {
  7607. text-align: right;
  7608. padding: 5px 10px;
  7609. }
  7610. .picker__close, .picker__today, .picker__clear {
  7611. font-size: 1.1rem;
  7612. padding: 0 1rem;
  7613. color: #26a69a;
  7614. }
  7615. .picker__clear {
  7616. color: #f44336;
  7617. float: left;
  7618. }
  7619. .picker__nav--prev:before,
  7620. .picker__nav--next:before {
  7621. content: " ";
  7622. border-top: .5em solid transparent;
  7623. border-bottom: .5em solid transparent;
  7624. border-right: 0.75em solid #676767;
  7625. width: 0;
  7626. height: 0;
  7627. display: block;
  7628. margin: 0 auto;
  7629. }
  7630. .picker__nav--next:before {
  7631. border-right: 0;
  7632. border-left: 0.75em solid #676767;
  7633. }
  7634. button.picker__today:focus, button.picker__clear:focus, button.picker__close:focus {
  7635. background-color: #a1ded8;
  7636. }
  7637. /* ==========================================================================
  7638. $BASE-TIME-PICKER
  7639. ========================================================================== */
  7640. /**
  7641. * The list of times.
  7642. */
  7643. .picker__list {
  7644. list-style: none;
  7645. padding: 0.75em 0 4.2em;
  7646. margin: 0;
  7647. }
  7648. /**
  7649. * The times on the clock.
  7650. */
  7651. .picker__list-item {
  7652. border-bottom: 1px solid #ddd;
  7653. border-top: 1px solid #ddd;
  7654. margin-bottom: -1px;
  7655. position: relative;
  7656. background: #fff;
  7657. padding: .75em 1.25em;
  7658. }
  7659. @media (min-height: 46.75em) {
  7660. .picker__list-item {
  7661. padding: .5em 1em;
  7662. }
  7663. }
  7664. /* Hovered time */
  7665. .picker__list-item:hover {
  7666. cursor: pointer;
  7667. color: #000;
  7668. background: #b1dcfb;
  7669. border-color: #0089ec;
  7670. z-index: 10;
  7671. }
  7672. /* Highlighted and hovered/focused time */
  7673. .picker__list-item--highlighted {
  7674. border-color: #0089ec;
  7675. z-index: 10;
  7676. }
  7677. .picker__list-item--highlighted:hover,
  7678. .picker--focused .picker__list-item--highlighted {
  7679. cursor: pointer;
  7680. color: #000;
  7681. background: #b1dcfb;
  7682. }
  7683. /* Selected and hovered/focused time */
  7684. .picker__list-item--selected,
  7685. .picker__list-item--selected:hover,
  7686. .picker--focused .picker__list-item--selected {
  7687. background: #0089ec;
  7688. color: #fff;
  7689. z-index: 10;
  7690. }
  7691. /* Disabled time */
  7692. .picker__list-item--disabled,
  7693. .picker__list-item--disabled:hover,
  7694. .picker--focused .picker__list-item--disabled {
  7695. background: #f5f5f5;
  7696. border-color: #f5f5f5;
  7697. color: #ddd;
  7698. cursor: default;
  7699. border-color: #ddd;
  7700. z-index: auto;
  7701. }
  7702. /**
  7703. * The clear button
  7704. */
  7705. .picker--time .picker__button--clear {
  7706. display: block;
  7707. width: 80%;
  7708. margin: 1em auto 0;
  7709. padding: 1em 1.25em;
  7710. background: none;
  7711. border: 0;
  7712. font-weight: 500;
  7713. font-size: .67em;
  7714. text-align: center;
  7715. text-transform: uppercase;
  7716. color: rgba(0, 0, 0, 0.87);
  7717. }
  7718. .picker--time .picker__button--clear:hover,
  7719. .picker--time .picker__button--clear:focus {
  7720. color: #000;
  7721. background: #b1dcfb;
  7722. background: #ee2200;
  7723. border-color: #ee2200;
  7724. cursor: pointer;
  7725. color: #fff;
  7726. outline: none;
  7727. }
  7728. .picker--time .picker__button--clear:before {
  7729. top: -0.25em;
  7730. color: rgba(0, 0, 0, 0.87);
  7731. font-size: 1.25em;
  7732. font-weight: bold;
  7733. }
  7734. .picker--time .picker__button--clear:hover:before,
  7735. .picker--time .picker__button--clear:focus:before {
  7736. color: #fff;
  7737. }
  7738. /* ==========================================================================
  7739. $DEFAULT-TIME-PICKER
  7740. ========================================================================== */
  7741. /**
  7742. * The frame the bounds the time picker.
  7743. */
  7744. .picker--time .picker__frame {
  7745. min-width: 256px;
  7746. max-width: 320px;
  7747. }
  7748. /**
  7749. * The picker box.
  7750. */
  7751. .picker--time .picker__box {
  7752. font-size: 1em;
  7753. background: #f2f2f2;
  7754. padding: 0;
  7755. }
  7756. @media (min-height: 40.125em) {
  7757. .picker--time .picker__box {
  7758. margin-bottom: 5em;
  7759. }
  7760. }
  7761. /* ==========================================================================
  7762. $DEFAULT-TIME-PICKER
  7763. ========================================================================== */
  7764. .clockpicker-display {
  7765. font-size: 4rem;
  7766. font-weight: bold;
  7767. text-align: center;
  7768. color: rgba(255, 255, 255, 0.6);
  7769. font-weight: 400;
  7770. clear: both;
  7771. position: relative;
  7772. }
  7773. .clockpicker-span-am-pm {
  7774. font-size: 1.3rem;
  7775. position: absolute;
  7776. right: 1rem;
  7777. bottom: 0.3rem;
  7778. line-height: 2rem;
  7779. font-weight: 500;
  7780. }
  7781. @media only screen and (min-width: 601px) {
  7782. .clockpicker-display {
  7783. top: 32%;
  7784. }
  7785. .clockpicker-span-am-pm {
  7786. position: relative;
  7787. right: auto;
  7788. bottom: auto;
  7789. text-align: center;
  7790. margin-top: 1.2rem;
  7791. }
  7792. }
  7793. .text-primary {
  7794. color: white;
  7795. }
  7796. .clockpicker-span-hours {
  7797. margin-right: 3px;
  7798. }
  7799. .clockpicker-span-minutes {
  7800. margin-left: 3px;
  7801. }
  7802. .clockpicker-span-hours,
  7803. .clockpicker-span-minutes,
  7804. .clockpicker-span-am-pm div {
  7805. cursor: pointer;
  7806. }
  7807. .clockpicker-moving {
  7808. cursor: move;
  7809. }
  7810. .clockpicker-plate {
  7811. background-color: #eee;
  7812. border-radius: 50%;
  7813. width: 270px;
  7814. height: 270px;
  7815. overflow: visible;
  7816. position: relative;
  7817. margin: auto;
  7818. margin-top: 25px;
  7819. margin-bottom: 5px;
  7820. -webkit-user-select: none;
  7821. -moz-user-select: none;
  7822. -ms-user-select: none;
  7823. user-select: none;
  7824. }
  7825. .clockpicker-canvas,
  7826. .clockpicker-dial {
  7827. width: 270px;
  7828. height: 270px;
  7829. position: absolute;
  7830. left: -1px;
  7831. top: -1px;
  7832. }
  7833. .clockpicker-minutes {
  7834. visibility: hidden;
  7835. }
  7836. .clockpicker-tick {
  7837. border-radius: 50%;
  7838. color: rgba(0, 0, 0, 0.87);
  7839. line-height: 40px;
  7840. text-align: center;
  7841. width: 40px;
  7842. height: 40px;
  7843. position: absolute;
  7844. cursor: pointer;
  7845. }
  7846. .clockpicker-tick.active,
  7847. .clockpicker-tick:hover {
  7848. background-color: rgba(38, 166, 154, 0.25);
  7849. }
  7850. .clockpicker-dial {
  7851. -webkit-transition: -webkit-transform 350ms, opacity 350ms;
  7852. -webkit-transition: opacity 350ms, -webkit-transform 350ms;
  7853. transition: opacity 350ms, -webkit-transform 350ms;
  7854. transition: transform 350ms, opacity 350ms;
  7855. transition: transform 350ms, opacity 350ms, -webkit-transform 350ms;
  7856. }
  7857. .clockpicker-dial-out {
  7858. opacity: 0;
  7859. }
  7860. .clockpicker-hours.clockpicker-dial-out {
  7861. -webkit-transform: scale(1.2, 1.2);
  7862. transform: scale(1.2, 1.2);
  7863. }
  7864. .clockpicker-minutes.clockpicker-dial-out {
  7865. -webkit-transform: scale(0.8, 0.8);
  7866. transform: scale(0.8, 0.8);
  7867. }
  7868. .clockpicker-canvas {
  7869. -webkit-transition: opacity 175ms;
  7870. transition: opacity 175ms;
  7871. }
  7872. .clockpicker-canvas-out {
  7873. opacity: 0.25;
  7874. }
  7875. .clockpicker-canvas-bearing {
  7876. stroke: none;
  7877. fill: #26a69a;
  7878. }
  7879. .clockpicker-canvas-bg {
  7880. stroke: none;
  7881. fill: #26a69a;
  7882. }
  7883. .clockpicker-canvas-bg-trans {
  7884. fill: #26a69a;
  7885. }
  7886. .clockpicker-canvas line {
  7887. stroke: #26a69a;
  7888. stroke-width: 4;
  7889. stroke-linecap: round;
  7890. /*shape-rendering: crispEdges;*/
  7891. }