Advertisement
Guest User

Untitled

a guest
Jun 27th, 2019
88
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 3.21 KB | None | 0 0
  1. body {
  2. margin: 0;
  3. padding: 4rem;
  4. }
  5.  
  6. .tile {
  7. background-color: #0066CC;
  8. font-family: sans-serif;
  9. font-size: 1.25rem;
  10. font-weight: 300;
  11. text-align: center;
  12. vertical-align: center;
  13. color: #FFFFFF;
  14. padding: 3rem 1rem;
  15. }
  16. .container-80 {
  17. max-width: 80rem;
  18. margin: auto;
  19. }
  20.  
  21. .container-64 {
  22. max-width: 64rem;
  23. margin: auto;
  24. }
  25.  
  26. .cols-1 {
  27. display: grid;
  28. grid-template-columns: repeat(1, 1fr);
  29. }
  30.  
  31. .cols-2 {
  32. display: grid;
  33. grid-template-columns: repeat(2, 1fr);
  34. }
  35.  
  36. .cols-3 {
  37. display: grid;
  38. grid-template-columns: repeat(3, 1fr);
  39. }
  40.  
  41. .cols-4 {
  42. display: grid;
  43. grid-template-columns: repeat(4, 1fr);
  44. }
  45.  
  46. .cols-5 {
  47. display: grid;
  48. grid-template-columns: repeat(5, 1fr);
  49. }
  50.  
  51. .cols-6 {
  52. display: grid;
  53. grid-template-columns: repeat(6, 1fr);
  54. }
  55.  
  56. .cols-7 {
  57. display: grid;
  58. grid-template-columns: repeat(7, 1fr);
  59. }
  60.  
  61. .cols-8 {
  62. display: grid;
  63. grid-template-columns: repeat(8, 1fr);
  64. }
  65.  
  66. .cols-9 {
  67. display: grid;
  68. grid-template-columns: repeat(9, 1fr);
  69. }
  70.  
  71. .cols-10 {
  72. display: grid;
  73. grid-template-columns: repeat(10, 1fr);
  74. }
  75.  
  76. .cols-12 {
  77. display: grid;
  78. grid-template-columns: repeat(12, 1fr);
  79. }
  80.  
  81. .rows-1 {
  82. display: grid;
  83. grid-template-rows: repeat(1, 1fr);
  84. }
  85.  
  86. .rows-2 {
  87. display: grid;
  88. grid-template-rows: repeat(2, 1fr);
  89. }
  90.  
  91. .rows-3 {
  92. display: grid;
  93. grid-template-rows: repeat(3, 1fr);
  94. }
  95.  
  96. .rows-3 {
  97. display: grid;
  98. grid-template-rows: repeat(3, 1fr);
  99. }
  100.  
  101. .rows-4 {
  102. display: grid;
  103. grid-template-rows: repeat(4, 1fr);
  104. }
  105.  
  106. .rows-5 {
  107. display: grid;
  108. grid-template-rows: repeat(5, 1fr);
  109. }
  110.  
  111. .rows-6 {
  112. display: grid;
  113. grid-template-rows: repeat(6, 1fr);
  114. }
  115.  
  116. .rows-7 {
  117. display: grid;
  118. grid-template-rows: repeat(7, 1fr);
  119. }
  120.  
  121. .rows-8 {
  122. display: grid;
  123. grid-template-rows: repeat(8, 1fr);
  124. }
  125.  
  126. .rows-9 {
  127. display: grid;
  128. grid-template-rows: repeat(9, 1fr);
  129. }
  130.  
  131. .rows-10 {
  132. display: grid;
  133. grid-template-rows: repeat(10, 1fr);
  134. }
  135.  
  136. .rows-11 {
  137. display: grid;
  138. grid-template-rows: repeat(11, 1fr);
  139. }
  140.  
  141. .rows-12 {
  142. display: grid;
  143. grid-template-rows: repeat(12, 1fr);
  144. }
  145.  
  146. .gap-025 {
  147. grid-gap: 0.25rem;
  148. }
  149.  
  150. .gap-05 {
  151. grid-gap: 0.75rem;
  152. }
  153.  
  154. .gap-075 {
  155. grid-gap: 0.75rem;
  156. }
  157.  
  158. .gap-1 {
  159. grid-gap: 1rem;
  160. }
  161.  
  162. .gap-2 {
  163. grid-gap: 2rem;
  164. }
  165.  
  166. .gap-3 {
  167. grid-gap: 3rem;
  168. }
  169.  
  170. .gap-4 {
  171. grid-gap: 4rem;
  172. }
  173.  
  174. .gap-5 {
  175. grid-gap: 5rem;
  176. }
  177.  
  178. .gap-6 {
  179. grid-gap: 6rem;
  180. }
  181.  
  182. .col-1 {
  183. grid-column: span 1;
  184. }
  185.  
  186. .col-2 {
  187. grid-column: span 2;
  188. }
  189.  
  190. .col-3 {
  191. grid-column: span 3;
  192. }
  193.  
  194. .col-4 {
  195. grid-column: span 4;
  196. }
  197.  
  198. .col-5 {
  199. grid-column: span 5;
  200. }
  201.  
  202. .col-6 {
  203. grid-column: span 6;
  204. }
  205.  
  206. .col-7 {
  207. grid-column: span 7;
  208. }
  209.  
  210. .col-8 {
  211. grid-column: span 8;
  212. }
  213.  
  214. .col-9 {
  215. grid-column: span 9;
  216. }
  217.  
  218. .col-10 {
  219. grid-column: span 10;
  220. }
  221.  
  222. .col-11 {
  223. grid-column: span 11;
  224. }
  225.  
  226. .col-12 {
  227. grid-column: span 12;
  228. }
  229.  
  230. .row-1 {
  231. grid-row: span 1;
  232. }
  233.  
  234. .row-2 {
  235. grid-row: span 2;
  236. }
  237.  
  238. .row-3 {
  239. grid-row: span 3;
  240. }
  241.  
  242. .row-4 {
  243. grid-row: span 4;
  244. }
  245.  
  246. .row-5 {
  247. grid-row: span 5;
  248. }
  249.  
  250. .row-6 {
  251. grid-row: span 6;
  252. }
  253.  
  254. .row-7 {
  255. grid-row: span 7;
  256. }
  257.  
  258. .row-8 {
  259. grid-row: span 8;
  260. }
  261.  
  262. .row-9 {
  263. grid-row: span 9;
  264. }
  265.  
  266. .row-10 {
  267. grid-row: span 10;
  268. }
  269.  
  270. .row-11 {
  271. grid-row: span 11;
  272. }
  273.  
  274. .row-12 {
  275. grid-row: span 12;
  276. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement