Advertisement
Guest User

Untitled

a guest
Mar 30th, 2017
56
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 4.76 KB | None | 0 0
  1. <div class="css-190tu11">
  2. <h1 class="css-1qqir8k">Blah</h1>
  3. <div class="css-131b9cy">
  4. <div class="css-1suni8j">
  5. <a class="css-yq2t95" href="some-url">
  6. <span class="icon icon-register css-nwymqb" aria-hidden="true"></span>
  7. <h2 class="css-1892n22">Title</h2>
  8. <div class="css-kgza95">Description</div>
  9. </a>
  10. <div class="css-kujdaf">
  11. Some special thing
  12. </div>
  13. </div>
  14. <div class="css-1suni8j">
  15. <a class="css-yq2t95" href="some-url">
  16. <span class="icon icon-register css-nwymqb" aria-hidden="true"></span>
  17. <h2 class="css-1892n22">Title</h2>
  18. <div class="css-kgza95">Description</div>
  19. </a>
  20. <div class="css-dkez8"></div>
  21. </div>
  22. <div class="css-1suni8j">
  23. <a class="css-yq2t95" href="some-url">
  24. <span class="icon icon-register css-nwymqb" aria-hidden="true"></span>
  25. <h2 class="css-1892n22">Title</h2>
  26. <div class="css-kgza95">Description</div>
  27. </a>
  28. <div class="css-dkez8"></div>
  29. </div>
  30. <div class="css-1suni8j">
  31. <a class="css-yq2t95" href="some-url">
  32. <span class="icon icon-register css-nwymqb" aria-hidden="true"></span>
  33. <h2 class="css-1892n22">Title</h2>
  34. <div class="css-kgza95">Description</div>
  35. </a>
  36. <div class="css-dkez8"></div
  37. </div>
  38. </div>
  39. </div>
  40.  
  41. <style>
  42. .css-190tu11,
  43. [data-css-190tu11] {
  44. padding: 12px 48px 24px 48px;
  45. width: 100%;
  46. border-radius: 5px;
  47. margin-bottom: 24px;
  48. background-color: white;
  49. border: solid 1px #e0e0e0;
  50. }
  51. .css-1qqir8k,
  52. [data-css-1qqir8k] {
  53. font-size: 24px;
  54. font-weight: 300;
  55. margin-bottom: 18px;
  56. margin-top: 0;
  57. }
  58. .css-131b9cy,
  59. [data-css-131b9cy] {
  60. display: flex;
  61. justify-content: space-around;
  62. flex-wrap: wrap;
  63. }
  64. .css-131b9cy > *,
  65. [data-css-131b9cy] > * {
  66. flex: 0 1 auto;
  67. margin-left: 0;
  68. margin-right: 0;
  69. }
  70. .css-131b9cy > *:not(:first-child),
  71. [data-css-131b9cy] > *:not(:first-child) {
  72. margin-left: 10px;
  73. }
  74. .css-131b9cy > *:not(:last-child),
  75. [data-css-131b9cy] > *:not(:last-child) {
  76. margin-right: 10px;
  77. }
  78.  
  79. .css-1suni8j,
  80. [data-css-1suni8j] {
  81. display: flex;
  82. background-color: white;
  83. flex-direction: column;
  84. justify-content: space-between;
  85. text-align: center;
  86. max-width: 186px;
  87. min-width: 120px;
  88. height: 240px;
  89. }
  90. .css-1suni8j > *,
  91. [data-css-1suni8j] > * {
  92. margin-top: 0;
  93. margin-bottom: 0;
  94. }
  95. .css-1suni8j > *:not(:first-child),
  96. [data-css-1suni8j] > *:not(:first-child) {
  97. margin-top: 10px;
  98. }
  99. .css-1suni8j > *:not(:last-child),
  100. [data-css-1suni8j] > *:not(:last-child) {
  101. margin-bottom: 10px;
  102. }
  103.  
  104. .css-yq2t95,
  105. [data-css-yq2t95] {
  106. flex: 1;
  107. justify-content: space-between;
  108. flex-direction: column;
  109. display: flex;
  110. }
  111. .css-yq2t95 > *:last-child,
  112. [data-css-yq2t95] > *:last-child {
  113. flex: 0 1 auto;
  114. }
  115. .css-yq2t95:hover,
  116. [data-css-yq2t95]:hover,
  117. .css-yq2t95:focus,
  118. [data-css-yq2t95]:focus,
  119. .css-yq2t95:active,
  120. [data-css-yq2t95]:active {
  121. text-decoration: none;
  122. }
  123. .css-yq2t95:hover .funnel-description,
  124. [data-css-yq2t95]:hover .funnel-description,
  125. .css-yq2t95:focus .funnel-description,
  126. [data-css-yq2t95]:focus .funnel-description,
  127. .css-yq2t95:active .funnel-description,
  128. [data-css-yq2t95]:active .funnel-description {
  129. color: #333333;
  130. }
  131. .css-yq2t95:hover .icon,
  132. [data-css-yq2t95]:hover .icon,
  133. .css-yq2t95:focus .icon,
  134. [data-css-yq2t95]:focus .icon,
  135. .css-yq2t95:active .icon,
  136. [data-css-yq2t95]:active .icon {
  137. color: #ffffff;
  138. background-color: #0070ba;
  139. }
  140. .css-yq2t95 > *,
  141. [data-css-yq2t95] > * {
  142. margin-top: 0;
  143. margin-bottom: 0;
  144. }
  145. .css-yq2t95 > *:not(:first-child),
  146. [data-css-yq2t95] > *:not(:first-child) {
  147. margin-top: 5px;
  148. }
  149. .css-yq2t95 > *:not(:last-child),
  150. [data-css-yq2t95] > *:not(:last-child) {
  151. margin-bottom: 5px;
  152. }
  153.  
  154. .css-nwymqb,
  155. [data-css-nwymqb] {
  156. transition: all 0.5s ease;
  157. border-radius: 50%;
  158. display: block;
  159. margin-left: auto;
  160. border: 1px solid #0070ba;
  161. height: 60px;
  162. width: 60px;
  163. font-size: 30px;
  164. line-height: 54px;
  165. margin-right: auto;
  166. }
  167.  
  168. .css-1892n22,
  169. [data-css-1892n22] {
  170. font-weight: normal;
  171. flex: 0 1 auto;
  172. color: inherit;
  173. padding: 0;
  174. font-size: 16px;
  175. height: 80px;
  176. }
  177. .css-kgza95,
  178. [data-css-kgza95] {
  179. font-weight: normal;
  180. font-size: 11px;
  181. color: #333333;
  182. height: 76px;
  183. }
  184. .css-kgza95 p,
  185. [data-css-kgza95] p {
  186. font-size: 11px;
  187. margin: 0;
  188. }
  189. .css-kujdaf,
  190. [data-css-kujdaf] {
  191. min-height: 36px;
  192. background-image: linear-gradient(93deg, #1446a0, #0070ba);
  193. width: 100%;
  194. color: white;
  195. display: flex;
  196. justify-content: center;
  197. align-items: center;
  198. padding: 10px;
  199. }
  200. .css-kujdaf > *,
  201. [data-css-kujdaf] > * {
  202. margin-left: 0;
  203. margin-right: 0;
  204. }
  205. .css-kujdaf > *:not(:first-child),
  206. [data-css-kujdaf] > *:not(:first-child) {
  207. margin-left: 6px;
  208. }
  209. .css-kujdaf > *:not(:last-child),
  210. [data-css-kujdaf] > *:not(:last-child) {
  211. margin-right: 6px;
  212. }
  213. .css-dkez8,
  214. [data-css-dkez8] {
  215. min-height: 36px;
  216. }
  217. <style>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement