API tools faq
paste
Guest User

Untitled

a guest
Aug 10th, 2016
93
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 6.83 KB | None | 0 0
raw download clone embed print report
  1. @font-face {
  2. font-family: Averta;
  3. src: url(//d1yepz0pwej23y.cloudfront.net/assets/323/1nhh8Y1.otf) format("opentype");
  4. src: url(//d1yepz0pwej23y.cloudfront.net/assets/323/27DSw06.eot) format('embedded-opentype'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/P4KU09_.woff) format('woff'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/1FVTx-8.ttf) format('truetype'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/3AxC_ic.svg) format('svg');
  5. font-weight: 400;
  6. font-style: normal;
  7. }
  8.  
  9. @font-face {
  10. font-family: Averta;
  11. src: url(//d1yepz0pwej23y.cloudfront.net/assets/323/2fOxd0B.otf) format("opentype");
  12. src: url(//d1yepz0pwej23y.cloudfront.net/assets/323/28Ften9.eot) format('embedded-opentype'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/3O-AJ6r.woff) format('woff'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/29yd1SE.ttf) format('truetype'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/24eRHRP.svg) format('svg');
  13. font-weight: 700;
  14. }
  15.  
  16. @font-face {
  17. font-family: Averta;
  18. src: url(//d1yepz0pwej23y.cloudfront.net/assets/323/1DViJbB.otf) format("opentype");
  19. src: url(//d1yepz0pwej23y.cloudfront.net/assets/323/3HZKeKs.eot) format('embedded-opentype'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/3-afYA7.woff) format('woff'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/3hWY7eg.ttf) format('truetype'), url(//d1yepz0pwej23y.cloudfront.net/assets/323/1xISWJB.svg) format('svg');
  20. font-weight: 100;
  21. }
  22.  
  23. body {
  24. font-size: 62.5%;
  25. max-width: 87.5rem;
  26. margin-right: auto;
  27. margin-left: auto;
  28. -webkit-font-smoothing: antialiased;
  29. text-shadow: 0.063rem 0.063rem 0.063rem rgba(47, 47, 47, 0.004);
  30. }
  31.  
  32. h2,
  33. p,
  34. h3 {
  35. margin-top: 0;
  36. margin-bottom: 0;
  37. font-family: "Averta";
  38. }
  39.  
  40. h2 {
  41. font-size: 3.6rem;
  42. font-weight: 900;
  43. color: #2f2f2f;
  44. letter-spacing: -0.02em;
  45. -webkit-margin-before: 0em;
  46. -webkit-margin-after: 0em;
  47. }
  48.  
  49. h3 {
  50. font-size: 1.6rem;
  51. font-weight: 600;
  52. color: #2f2f2f;
  53. letter-spacing: -0.02em;
  54. -webkit-margin-before: 0em;
  55. -webkit-margin-after: 0em;
  56. }
  57.  
  58. .headline {
  59. margin-top: -0.5rem;
  60. /* Done to align the top of the Headlinw with the top of the pill */
  61. }
  62.  
  63. .item .headline-link:hover {
  64. cursor: pointer;
  65. -webkit-transform: scale(1.008, 1.008);
  66. -webkit-transition-timing-function: ease-out;
  67. transition-timing-function: ease-out;
  68. -webkit-transition-duration: 0.08s;
  69. }
  70.  
  71. p {
  72. font-weight: 500;
  73. color: #2f2f2f;
  74. }
  75.  
  76. a {
  77. display: inline-block;
  78. text-decoration: none;
  79. color: #003663;
  80. }
  81.  
  82. .list-cell {
  83. margin-left: 1rem;
  84. margin-right: 1rem;
  85. /*padding-top: 0.25rem;*/
  86. background: #ffffff;
  87. }
  88.  
  89. h1 {
  90. font-family: Averta;
  91. text-transform: uppercase;
  92. margin-left: 1.5rem;
  93. margin-right: 1.5rem;
  94. margin-bottom: 1rem;
  95. }
  96.  
  97. .cell-content {
  98. display: flex;
  99. width: calc(100% + 0.125rem);
  100. flex-direction: row;
  101. background: rgba(255, 255, 255, 0);
  102. margin: 0rem 0rem 1rem 0rem;
  103. /*border: 0.063rem solid rgba(255, 255, 255, 0);*/
  104. position: relative;
  105. left: -0.063rem;
  106. }
  107.  
  108. .cell-content:last-child {
  109. margin-bottom: 0rem;
  110. }
  111.  
  112.  
  113. /* Hover should happen in tandem with photo hover */
  114.  
  115. .cell-content:hover {}
  116.  
  117. .item {
  118. padding: 1rem;
  119. }
  120.  
  121. .item-row {
  122. width: 100%;
  123. }
  124.  
  125. .colu-60 {
  126. width: 66.6%;
  127. float: left;
  128. }
  129.  
  130. .colu-40 {
  131. width: 33.3%;
  132. float: left;
  133. }
  134.  
  135. .colu-60 .item-content {
  136. border: 0.063rem solid #e1e1e1;
  137. border-right: 0rem;
  138. }
  139.  
  140. .colu-40 .item {
  141. border-color: #e1e1e1;
  142. border-image: none;
  143. border-style: solid solid none;
  144. border-width: 0.063rem 0.063rem 0;
  145. }
  146.  
  147.  
  148. /*
  149. .colu-40 .item:hover{
  150. background-color: #e1e1e1;
  151. }*/
  152.  
  153. .item-thumbnail {
  154. background-color: #313131;
  155. background-image: url(http://s32.postimg.org/y7b4q48kl/hero.jpg);
  156. background-repeat: no-repeat;
  157. background-position: center;
  158. background-size: 155%;
  159. flex-basis: 25%;
  160. -webkit-flex-basis: 25%;
  161. flex-grow: 0;
  162. flex-shrink: 0;
  163. }
  164.  
  165. .item-content .item-thumbnail {
  166. max-width: 100%;
  167. }
  168.  
  169. .item-more {
  170. /*background-color: #e1e1e1;*/
  171. }
  172.  
  173. .item-more h3 {
  174. color: #444;
  175. }
  176.  
  177. .thumbnail-pill p {
  178. display: inline-block;
  179. align-self: flex-start;
  180. background: #003663;
  181. color: #FFFFFF;
  182. border: 0.25rem solid #003663;
  183. border-radius: 0.125rem;
  184. padding: 0rem 0.375rem 0rem 0.375rem;
  185. text-transform: uppercase;
  186. font-weight: 700;
  187. font-size: 1.4em;
  188. letter-spacing: 0.1em;
  189. }
  190.  
  191. .thumbnail-pill p:hover {
  192. border: 0.25rem solid #004c8b;
  193. background: #004c8b;
  194. cursor: pointer;
  195. }
  196.  
  197. .item-label {
  198. display: flex;
  199. flex-direction: column;
  200. justify-content: flex-start;
  201. padding-left: 1.5rem;
  202. }
  203.  
  204. .item-label h2 {
  205. /*max-height: 5.625rem;*/
  206. overflow-y: hidden;
  207. }
  208.  
  209. .item-context {
  210. font-size: 1.8em;
  211. line-height: 150%;
  212. display: block;
  213. max-height: 4.8rem;
  214. overflow-y: hidden;
  215. }
  216.  
  217. .context-link {
  218. padding-left: 0.25rem;
  219. font-weight: 600;
  220. }
  221.  
  222. .spacer {
  223. height: 0.5rem;
  224. }
  225.  
  226. .spacer2 {
  227. height: 1rem;
  228. }
  229.  
  230. .label-description {
  231. display: flex;
  232. flex-direction: row;
  233. font-size: 1.4em;
  234. }
  235.  
  236. .label-description img {
  237. margin-right: 0.25rem;
  238. width: 1.125rem;
  239. height: 1.125rem;
  240. }
  241.  
  242. @media (max-width: 30rem) {
  243. .item-label {
  244. /*padding-left: 0rem;*/
  245. }
  246. .item-label h2 {
  247. font-size: 2.7em;
  248. /*line-height: 1.25rem;*/
  249. }
  250. .item-context {
  251. display: none;
  252. }
  253. h3 {
  254. font-size: 1.2rem;
  255. }
  256. .spacer2 {
  257. display: none;
  258. }
  259. .item-thumbnail {
  260. margin: 1rem;
  261. border-radius: 0.188rem;
  262. min-height: 10.938rem;
  263. background-size: cover;
  264. }
  265. .item-thumbnail p {
  266. display: none;
  267. }
  268. .list-cell {
  269. margin-left: 0rem;
  270. margin-right: 0rem;
  271. }
  272. .hide-small {
  273. display: none;
  274. }
  275. .headline {
  276. margin-top: 0rem;
  277. }
  278. .colu-40 {
  279. width: 100%;
  280. }
  281. .colu-60 {
  282. width: 100%;
  283. }
  284. }
  285.  
  286. @media (min-width: 30.063rem) and (max-width: 48rem) {
  287. h1 {
  288. font-size: 0.875rem;
  289. margin-bottom: 0rem;
  290. }
  291. .cell-content {
  292. margin-bottom: 0.5rem;
  293. }
  294. .item-label {
  295. /*padding-left: 0rem;*/
  296. }
  297. .item-label h2 {
  298. /*font-size: 2.0em;
  299. line-height: 1.5rem;*/
  300. }
  301. .item-context {
  302. display: none;
  303. }
  304. .spacer2 {
  305. display: none;
  306. }
  307. .item-thumbnail {
  308. margin: 1rem;
  309. border-radius: 0.188rem;
  310. min-height: 26.438rem;
  311. }
  312. .item-thumbnail p {
  313. display: none;
  314. }
  315. .headline {
  316. margin-top: 0rem;
  317. }
  318. .colu-40 {
  319. width: 100%;
  320. }
  321. .colu-60 {
  322. width: 100%;
  323. }
  324. }
  325.  
  326. @media (min-width: 48.063rem) and (max-width: 62rem) {
  327. .item-thumbnail {
  328. min-height: 18.563rem;
  329. }
  330. .item-context {
  331. display: none;
  332. }
  333. .spacer2 {
  334. display: none;
  335. }
  336. }
  337.  
  338. @media (min-width: 62.063rem) and (max-width: 75rem) {
  339. .item-thumbnail {
  340. min-height: 25.563rem;
  341. }
  342. }
  343.  
  344. @media (min-width: 75rem) {
  345. .item-thumbnail {
  346. min-height: 35.063rem;
  347. max-width: 23.5rem;
  348. }
  349. }
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!