directives.css 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391
  1. .opacity-0 {
  2. opacity: 0; }
  3. .opacity-10 {
  4. opacity: 0.1; }
  5. .opacity-20 {
  6. opacity: 0.2; }
  7. .opacity-30 {
  8. opacity: 0.3; }
  9. .opacity-40 {
  10. opacity: 0.4; }
  11. .opacity-50 {
  12. opacity: 0.5; }
  13. .opacity-60 {
  14. opacity: 0.6; }
  15. .opacity-70 {
  16. opacity: 0.7; }
  17. .opacity-80 {
  18. opacity: 0.8; }
  19. .opacity-90 {
  20. opacity: 0.9; }
  21. .opacity-100 {
  22. opacity: 1; }
  23. .masonry-with-columns {
  24. display: -webkit-box;
  25. display: -webkit-flex;
  26. display: -ms-flexbox;
  27. display: flex;
  28. -webkit-box-orient: vertical;
  29. -webkit-box-direction: normal;
  30. -webkit-flex-direction: column;
  31. -ms-flex-direction: column;
  32. flex-direction: column;
  33. -webkit-flex-wrap: wrap;
  34. -ms-flex-wrap: wrap;
  35. flex-wrap: wrap;
  36. max-height: 1000px; }
  37. .masonry-with-columns div {
  38. -webkit-box-flex: 1;
  39. -webkit-flex: 1 0 auto;
  40. -ms-flex: 1 0 auto;
  41. flex: 1 0 auto;
  42. background: #00997B;
  43. color: white;
  44. margin: 0 1rem 1rem 0;
  45. text-align: center;
  46. font-weight: 900;
  47. font-size: 2rem; }
  48. .masonry-with-columns div:nth-child(1) {
  49. height: 240px;
  50. line-height: 240px; }
  51. .masonry-with-columns div:nth-child(2) {
  52. height: 158px;
  53. line-height: 158px; }
  54. .masonry-with-columns div:nth-child(3) {
  55. height: 267px;
  56. line-height: 267px; }
  57. .masonry-with-columns div:nth-child(4) {
  58. height: 408px;
  59. line-height: 408px; }
  60. .masonry-with-columns div:nth-child(5) {
  61. height: 144px;
  62. line-height: 144px; }
  63. .masonry-with-columns div:nth-child(6) {
  64. height: 220px;
  65. line-height: 220px; }
  66. .masonry-with-columns div:nth-child(7) {
  67. height: 137px;
  68. line-height: 137px; }
  69. .masonry-with-columns div:nth-child(8) {
  70. height: 113px;
  71. line-height: 113px; }
  72. .masonry-with-columns div:nth-child(9) {
  73. height: 352px;
  74. line-height: 352px; }
  75. .masonry-with-columns div:nth-child(10) {
  76. height: 236px;
  77. line-height: 236px; }
  78. .masonry-with-columns div:nth-child(11) {
  79. height: 113px;
  80. line-height: 113px; }
  81. .masonry-with-columns div:nth-child(12) {
  82. height: 403px;
  83. line-height: 403px; }
  84. .masonry-with-columns div:nth-child(13) {
  85. height: 382px;
  86. line-height: 382px; }
  87. .masonry-with-columns div:nth-child(14) {
  88. height: 136px;
  89. line-height: 136px; }
  90. .masonry-with-columns div:nth-child(15) {
  91. height: 230px;
  92. line-height: 230px; }
  93. .masonry-with-columns div:nth-child(16) {
  94. height: 214px;
  95. line-height: 214px; }
  96. .masonry-with-columns div:nth-child(17) {
  97. height: 168px;
  98. line-height: 168px; }
  99. .masonry-with-columns div:nth-child(18) {
  100. height: 211px;
  101. line-height: 211px; }
  102. .masonry-with-columns div:nth-child(19) {
  103. height: 320px;
  104. line-height: 320px; }
  105. .masonry-with-columns div:nth-child(20) {
  106. height: 215px;
  107. line-height: 215px; }
  108. .masonry-with-columns div:nth-child(21) {
  109. height: 180px;
  110. line-height: 180px; }
  111. .masonry-with-columns div:nth-child(22) {
  112. height: 119px;
  113. line-height: 119px; }
  114. .masonry-with-columns div:nth-child(23) {
  115. height: 293px;
  116. line-height: 293px; }
  117. .masonry-with-columns div:nth-child(24) {
  118. height: 468px;
  119. line-height: 468px; }
  120. .masonry-with-columns div:nth-child(25) {
  121. height: 209px;
  122. line-height: 209px; }
  123. .masonry-with-columns div:nth-child(26) {
  124. height: 223px;
  125. line-height: 223px; }
  126. .masonry-with-columns div:nth-child(27) {
  127. height: 139px;
  128. line-height: 139px; }
  129. .masonry-with-columns div:nth-child(28) {
  130. height: 413px;
  131. line-height: 413px; }
  132. .masonry-with-columns div:nth-child(29) {
  133. height: 197px;
  134. line-height: 197px; }
  135. .masonry-with-columns div:nth-child(30) {
  136. height: 389px;
  137. line-height: 389px; }
  138. .masonry-with-columns div:nth-child(31) {
  139. height: 226px;
  140. line-height: 226px; }
  141. .masonry-with-columns div:nth-child(32) {
  142. height: 495px;
  143. line-height: 495px; }
  144. .masonry-with-columns div:nth-child(33) {
  145. height: 349px;
  146. line-height: 349px; }
  147. .masonry-with-columns div:nth-child(34) {
  148. height: 225px;
  149. line-height: 225px; }
  150. .masonry-with-columns div:nth-child(35) {
  151. height: 221px;
  152. line-height: 221px; }
  153. .masonry-with-columns div:nth-child(36) {
  154. height: 110px;
  155. line-height: 110px; }
  156. .masonry-with-columns-2 {
  157. display: -webkit-box;
  158. display: -webkit-flex;
  159. display: -ms-flexbox;
  160. display: flex;
  161. -webkit-flex-wrap: wrap;
  162. -ms-flex-wrap: wrap;
  163. flex-wrap: wrap; }
  164. .masonry-with-columns-2 div {
  165. height: 150px;
  166. line-height: 150px;
  167. background: #9B1B30;
  168. color: white;
  169. margin: 0 1rem 1rem 0;
  170. text-align: center;
  171. font-weight: 900;
  172. font-size: 2rem;
  173. -webkit-box-flex: 1;
  174. -webkit-flex: 1 0 auto;
  175. -ms-flex: 1 0 auto;
  176. flex: 1 0 auto; }
  177. .masonry-with-columns-2 div:nth-child(1) {
  178. width: 225px; }
  179. .masonry-with-columns-2 div:nth-child(2) {
  180. width: 301px; }
  181. .masonry-with-columns-2 div:nth-child(3) {
  182. width: 358px; }
  183. .masonry-with-columns-2 div:nth-child(4) {
  184. width: 341px; }
  185. .masonry-with-columns-2 div:nth-child(5) {
  186. width: 189px; }
  187. .masonry-with-columns-2 div:nth-child(6) {
  188. width: 124px; }
  189. .masonry-with-columns-2 div:nth-child(7) {
  190. width: 160px; }
  191. .masonry-with-columns-2 div:nth-child(8) {
  192. width: 81px; }
  193. .masonry-with-columns-2 div:nth-child(9) {
  194. width: 218px; }
  195. .masonry-with-columns-2 div:nth-child(10) {
  196. width: 209px; }
  197. .masonry-with-columns-2 div:nth-child(11) {
  198. width: 345px; }
  199. .masonry-with-columns-2 div:nth-child(12) {
  200. width: 239px; }
  201. .masonry-with-columns-2 div:nth-child(13) {
  202. width: 290px; }
  203. .masonry-with-columns-2 div:nth-child(14) {
  204. width: 364px; }
  205. .masonry-with-columns-2 div:nth-child(15) {
  206. width: 406px; }
  207. .masonry-with-columns-2 div:nth-child(16) {
  208. width: 207px; }
  209. .masonry-with-columns-2 div:nth-child(17) {
  210. width: 82px; }
  211. .masonry-with-columns-2 div:nth-child(18) {
  212. width: 378px; }
  213. .masonry-with-columns-2 div:nth-child(19) {
  214. width: 251px; }
  215. .masonry-with-columns-2 div:nth-child(20) {
  216. width: 174px; }
  217. .masonry-with-columns-2 div:nth-child(21) {
  218. width: 271px; }
  219. .masonry-with-columns-2 div:nth-child(22) {
  220. width: 93px; }
  221. .masonry-with-columns-2 div:nth-child(23) {
  222. width: 283px; }
  223. .masonry-with-columns-2 div:nth-child(24) {
  224. width: 178px; }
  225. .masonry-with-columns-2 div:nth-child(25) {
  226. width: 311px; }
  227. .masonry-with-columns-2 div:nth-child(26) {
  228. width: 155px; }
  229. .masonry-with-columns-2 div:nth-child(27) {
  230. width: 303px; }
  231. .masonry-with-columns-2 div:nth-child(28) {
  232. width: 361px; }
  233. .masonry-with-columns-2 div:nth-child(29) {
  234. width: 110px; }
  235. .masonry-with-columns-2 div:nth-child(30) {
  236. width: 303px; }
  237. .masonry-with-columns-2 div:nth-child(31) {
  238. width: 155px; }
  239. .masonry-with-columns-2 div:nth-child(32) {
  240. width: 390px; }
  241. .masonry-with-columns-2 div:nth-child(33) {
  242. width: 77px; }
  243. .masonry-with-columns-2 div:nth-child(34) {
  244. width: 245px; }
  245. .masonry-with-columns-2 div:nth-child(35) {
  246. width: 88px; }
  247. .masonry-with-columns-2 div:nth-child(36) {
  248. width: 151px; }
  249. .masonry-with-flex {
  250. display: -webkit-box;
  251. display: -webkit-flex;
  252. display: -ms-flexbox;
  253. display: flex;
  254. -webkit-box-orient: vertical;
  255. -webkit-box-direction: normal;
  256. -webkit-flex-direction: column;
  257. -ms-flex-direction: column;
  258. flex-direction: column;
  259. -webkit-flex-wrap: wrap;
  260. -ms-flex-wrap: wrap;
  261. flex-wrap: wrap;
  262. max-height: 1000px; }
  263. .masonry-with-flex div {
  264. width: auto;
  265. background: #975A58;
  266. color: white;
  267. margin: 0 1rem 1rem 0;
  268. text-align: center;
  269. font-weight: 900;
  270. font-size: 2rem; }
  271. .masonry-with-flex div:nth-child(1) {
  272. height: 494px;
  273. line-height: 494px; }
  274. .masonry-with-flex div:nth-child(2) {
  275. height: 200px;
  276. line-height: 200px; }
  277. .masonry-with-flex div:nth-child(3) {
  278. height: 325px;
  279. line-height: 325px; }
  280. .masonry-with-flex div:nth-child(4) {
  281. height: 257px;
  282. line-height: 257px; }
  283. .masonry-with-flex div:nth-child(5) {
  284. height: 343px;
  285. line-height: 343px; }
  286. .masonry-with-flex div:nth-child(6) {
  287. height: 298px;
  288. line-height: 298px; }
  289. .masonry-with-flex div:nth-child(7) {
  290. height: 165px;
  291. line-height: 165px; }
  292. .masonry-with-flex div:nth-child(8) {
  293. height: 341px;
  294. line-height: 341px; }
  295. .masonry-with-flex div:nth-child(9) {
  296. height: 375px;
  297. line-height: 375px; }
  298. .masonry-with-flex div:nth-child(10) {
  299. height: 204px;
  300. line-height: 204px; }
  301. .masonry-with-flex div:nth-child(11) {
  302. height: 434px;
  303. line-height: 434px; }
  304. .masonry-with-flex div:nth-child(12) {
  305. height: 491px;
  306. line-height: 491px; }
  307. .masonry-with-flex div:nth-child(13) {
  308. height: 165px;
  309. line-height: 165px; }
  310. .masonry-with-flex div:nth-child(14) {
  311. height: 182px;
  312. line-height: 182px; }
  313. .masonry-with-flex div:nth-child(15) {
  314. height: 408px;
  315. line-height: 408px; }
  316. .masonry-with-flex div:nth-child(16) {
  317. height: 347px;
  318. line-height: 347px; }
  319. .masonry-with-flex div:nth-child(17) {
  320. height: 232px;
  321. line-height: 232px; }
  322. .masonry-with-flex div:nth-child(18) {
  323. height: 143px;
  324. line-height: 143px; }
  325. .masonry-with-flex div:nth-child(19) {
  326. height: 155px;
  327. line-height: 155px; }
  328. .masonry-with-flex div:nth-child(20) {
  329. height: 281px;
  330. line-height: 281px; }
  331. .masonry-with-flex div:nth-child(21) {
  332. height: 265px;
  333. line-height: 265px; }
  334. .masonry-with-flex div:nth-child(22) {
  335. height: 302px;
  336. line-height: 302px; }
  337. .masonry-with-flex div:nth-child(23) {
  338. height: 307px;
  339. line-height: 307px; }
  340. .masonry-with-flex div:nth-child(24) {
  341. height: 404px;
  342. line-height: 404px; }
  343. .masonry-with-flex div:nth-child(25) {
  344. height: 354px;
  345. line-height: 354px; }
  346. .masonry-with-flex div:nth-child(26) {
  347. height: 292px;
  348. line-height: 292px; }
  349. .masonry-with-flex div:nth-child(27) {
  350. height: 213px;
  351. line-height: 213px; }
  352. .masonry-with-flex div:nth-child(28) {
  353. height: 179px;
  354. line-height: 179px; }
  355. .masonry-with-flex div:nth-child(29) {
  356. height: 383px;
  357. line-height: 383px; }
  358. .masonry-with-flex div:nth-child(30) {
  359. height: 435px;
  360. line-height: 435px; }
  361. .masonry-with-flex div:nth-child(31) {
  362. height: 153px;
  363. line-height: 153px; }
  364. .masonry-with-flex div:nth-child(32) {
  365. height: 220px;
  366. line-height: 220px; }
  367. .masonry-with-flex div:nth-child(33) {
  368. height: 248px;
  369. line-height: 248px; }
  370. .masonry-with-flex div:nth-child(34) {
  371. height: 368px;
  372. line-height: 368px; }
  373. .masonry-with-flex div:nth-child(35) {
  374. height: 396px;
  375. line-height: 396px; }
  376. .masonry-with-flex div:nth-child(36) {
  377. height: 302px;
  378. line-height: 302px; }