{"__browser":{"country":"US","device":"unknown_device","mobile":false,"name":"unknown browser","platform":"unknown_platform","version":"0"},"__constants":{},"__CPDATA":{"domain_iframe":"https://cdpn.io","environment":"production","host":"codepen.io","iframe_allow":"accelerometer; ambient-light-sensor; camera; display-capture; encrypted-media; geolocation; gyroscope; microphone; midi; payment; vr; web-share","iframe_sandbox":"allow-forms allow-modals allow-pointer-lock allow-popups allow-same-origin allow-scripts allow-top-navigation-by-user-activation allow-downloads allow-presentation"},"__graphql":{"data":{"data":{"sessionUser":{"id":"VoDkNZ","name":"Captain Anonymous","title":"Captain Anonymous","avatar":"https://assets.codepen.io/t-1/user-default-avatar.jpg?format=auto&version=0","currentContext":{"id":"VoDkNZ","title":"Captain Anonymous","name":"Captain Anonymous","avatar":"https://assets.codepen.io/t-1/user-default-avatar.jpg?format=auto&version=0","username":"anon","__typename":"User"},"currentTeamId":null,"username":"anon","admin":false,"anon":true,"pro":false,"verified":false,"teams":[],"__typename":"User"}}},"url":"https://codepen.io/graphql","api":"cprails"},"__user":{"anon":true,"base_url":"/anon/","cohorts":[],"current_team_hashid":null,"current_team_id":0,"hashid":"VoDkNZ","id":1,"itemType":"user","name":"Captain Anonymous","paid":false,"tier":0,"username":"anon","created_at":null,"email_verified":null,"collections_count":0,"collections_private_count":0,"followers_count":0,"followings_count":0,"pens_count":0,"pens_private_count":0,"projects_count":0,"projects_private_count":0},"__firebase":{"config":{"apiKey":"AIzaSyBgLAe7N_MdFpuVofMkcQLGwwhUu5tuxls","authDomain":"codepen-store-production.firebaseapp.com","databaseURL":"https://codepen-store-production.firebaseio.com","disabled":false,"projectId":"codepen-store-production"},"token":"eyJhbGciOiJSUzI1NiJ9.eyJhdWQiOiJodHRwczovL2lkZW50aXR5dG9vbGtpdC5nb29nbGVhcGlzLmNvbS9nb29nbGUuaWRlbnRpdHkuaWRlbnRpdHl0b29sa2l0LnYxLklkZW50aXR5VG9vbGtpdCIsImNsYWltcyI6eyJvd25lcklkIjoiVm9Ea05aIiwiYWRtaW4iOmZhbHNlfSwiZXhwIjoxNjk2Mzc1NDI0LCJpYXQiOjE2OTYzNzE4MjQsImlzcyI6ImZpcmViYXNlLWFkbWluc2RrLThva3lsQGNvZGVwZW4tc3RvcmUtcHJvZHVjdGlvbi5pYW0uZ3NlcnZpY2VhY2NvdW50LmNvbSIsInN1YiI6ImZpcmViYXNlLWFkbWluc2RrLThva3lsQGNvZGVwZW4tc3RvcmUtcHJvZHVjdGlvbi5pYW0uZ3NlcnZpY2VhY2NvdW50LmNvbSIsInVpZCI6IlZvRGtOWiJ9.qCwRxZ-kVVI8gbB5ECQtAktL0nMr-Gz_rY-_sqcTwq9BNaCoVefmN1Fu3N_s_nqkiIhaYAKxRbBuiDrVLmk_DPZmwfZMpr0Xl4Aqh6lM2PVBoiDPO4LdAsDlsQ_WVwaW-PaiGYolJTWqyIIECYR5pS21JjO3KKJbQGWX6ts71WS12JpunE0OzQKPrDpfUJ4eJlOqRrMHyifG6E33RolWXCIk7cFdbmD34kCR5N9ybu_2ODxxcsGwG2kEGU6vgf2b5BGe4LlYMAwzySPTgsocnGG7ihOolPpidGsNrshfANhoNDk1kJr5i9vo9SDO5ylLX5RsADPxW2pM1hcKGQX7qQ"},"__pay_stripe_public_key":"pk_live_2GndomDfiklqpSNQn8FrGuwZSMIMzha7DkLJqlYe7IR0ihKAlKdiHg68JJc5eVPt68rzAjzAAVXcUwjySHRCsgjQQ00gtRBUFNH","__pay_braintree_env":"production","__item":"{\"id\":26631528,\"user_id\":219932,\"html\":\"<main class=\\\"wrapper\\\">\\n <div class=\\\"block top ha-block\\\">\\n <p class=\\\"text ha-text\\\">HA<\\/p>\\n <\\/div>\\n <div class=\\\"block top pea-block\\\">\\n <p class=\\\"text pea-text\\\">PEA<\\/p>\\n <\\/div>\\n <div class=\\\"block bottom burr-block\\\"><p class=\\\"text burr-text\\\">BURR<\\/p><\\/div>\\n <div class=\\\"block bottom th-block\\\"><p data-heading=\\\"th\\\" class=\\\"text th-text th\\\">TH<\\/p><\\/div>\\n <div class=\\\"block bottom cal-block\\\"><p class=\\\"text cal-text\\\">DAY<\\/p><\\/div>\\n<\\/main>\",\"css\":\"@import url('https:\\/\\/fonts.googleapis.com\\/css?family=Kosugi+Maru');\\n@import url(https:\\/\\/fonts.googleapis.com\\/css?family=Bungee+Shade);\\n\\nhtml {\\n box-sizing: border-box;\\n}\\n\\n*, *:before, *:after {\\n box-sizing: inherit;\\n outline: none;\\n}\\n\\nbody {\\n margin: 0;\\n padding: 0;\\n}\\n\\n.wrapper {\\n width: 100%;\\n min-height: 100vh;\\n display: flex;\\n flex-wrap: wrap;\\n justify-content: center;\\n align-items: center;\\n overflow: hidden;\\n}\\n\\n.block {\\n margin: 0;\\n padding: 0;\\n min-height: 400px;\\n align-self: stretch;\\n display: flex;\\n justify-content: center;\\n flex-direction: column;\\n text-align: center;\\n overflow: hidden;\\n background-size: cover;\\n background-position: center center;\\n background-repeat: no-repeat;\\n &.top {\\n flex: 100%;\\n }\\n &.bottom {\\n flex: 100%;\\n }\\n &.ha-block {\\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/643941946-612x612.jpg);\\n }\\n &.pea-block {\\n display: flex;\\n text-align: center;\\n position: relative;\\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/peas-bg.jpg);\\n }\\n &.burr-block {\\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/free-freeze-vector.png);\\n }\\n &.cal-block {\\n background-position: center 40%;\\n background-size: 160%;\\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n animation: animate-cal 2s linear infinite;\\n -webkit-animation: animate-cal 2s linear infinite;\\n -moz-animation: animate-cal 2s linear infinite;\\n }\\n &.th-block {\\n display: flex;\\n align-items: center;\\n justify-content: center;\\n background: MistyRose;\\n }\\n &:hover {\\n \\/\\/ cursor: pointer;\\n \\/\\/ background: gold;\\n }\\n @media (min-width: 768px) {\\n min-height: 0;\\n &.top {\\n flex: 50%;\\n }\\n &.bottom {\\n flex: 33%;\\n }\\n }\\n}\\n\\n@keyframes animate-cal {\\n\\t0% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n }\\n\\t33% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n }\\n 34% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-2.svg);\\n }\\n\\t66% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-2.svg);\\n }\\n 67% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-3.svg);\\n }\\n\\t100% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-3.svg);\\n }\\n}\\n@-webkit-keyframes animate-cal {\\n 0% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n }\\n\\t33% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n }\\n 34% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-2.svg);\\n }\\n\\t66% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-2.svg);\\n }\\n 67% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-3.svg);\\n }\\n\\t100% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-3.svg);\\n }\\n}\\n@-moz-keyframes animate-cal {\\n 0% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n }\\n\\t33% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-1.svg);\\n }\\n 34% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-2.svg);\\n }\\n\\t66% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-2.svg);\\n }\\n 67% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-3.svg);\\n }\\n\\t100% { \\n background-image: url(https:\\/\\/s3-us-west-2.amazonaws.com\\/s.cdpn.io\\/219932\\/shutterstock_749579140-3.svg);\\n }\\n}\\n\\n\\/\\/ text\\n\\np {\\n margin: 0;\\n padding: 0;\\n font-size: 400px;\\n font-family: 'Kosugi Maru', sans-serif;\\n color: white;\\n &.ha-text {\\n color: Olive;\\n text-shadow: 0 20px 30px rgba(0, 0, 0, 0.8);\\n }\\n &.pea-text {\\n color: purple;\\n }\\n &.burr-text {\\n color: #b4f25f;\\n background: -webkit-linear-gradient(left, #35d6d1 30%, lightblue 70%) no-repeat;\\n background-position-y: 1px;\\n background-position-x: 1px;\\n background-size: calc(100% - 2px) calc(100% - 2px);\\n -webkit-background-clip: text;\\n -webkit-text-fill-color: transparent;\\n mix-blend-mode: multiply;\\n }\\n &.cal-text {\\n color: SlateBlue;\\n mix-blend-mode: multiply;\\n }\\n @media (min-width: 768px) {\\n font-size: 10rem;\\n }\\n}\\n\\n\\/\\/ th\\n\\n.th-text {\\n display: inline;\\n text-align: center;\\n font-weight: normal;\\n font-family: 'Bungee Shade', cursive;\\n width: 100%;\\n background: linear-gradient(\\n -45deg, \\n Tomato 25%, \\n #feac5e 25%, \\n #feac5e 50%, \\n Tomato 50%, \\n Tomato 75%, \\n #feac5e 75%, \\n #feac5e);\\n background-clip: text;\\n -webkit-background-clip: text;\\n text-fill-color: transparent;\\n -webkit-text-fill-color: transparent;\\n background-size: 20px 20px;\\n background-position: 0 0;\\n animation: animate-th 1s linear infinite;\\n -webkit-animation: animate-th 1s linear infinite;\\n -moz-animation: animate-th 1s linear infinite;\\n}\\n\\n@keyframes animate-th {\\n\\t100% { \\n\\t\\tbackground-position: 20px 0, 20px 0, 20px 0;\\n\\t}\\n}\\n@-webkit-keyframes animate-th {\\n 100% { \\n\\t\\tbackground-position: 20px 0, 20px 0, 20px 0;\\n\\t}\\n}\\n@-moz-keyframes animate-th {\\n 100% { \\n\\t\\tbackground-position: 20px 0, 20px 0, 20px 0;\\n\\t}\\n}\",\"js\":\"$(\\\".text\\\").fitText(.25);\\n\\n$(\\\".block\\\").fitText(.25);\",\"html_pre_processor\":\"none\",\"css_pre_processor\":\"scss\",\"js_pre_processor\":\"none\",\"html_classes\":\"\",\"css_starter\":\"neither\",\"js_library\":null,\"created_at\":\"2018-07-26T19:37:51.000Z\",\"updated_at\":\"2019-11-06T21:14:53.000Z\",\"title\":\"Jules' Birthday CodeCard 2018\",\"description\":\"\",\"slug_hash\":\"QBqwWL\",\"head\":\"\",\"private\":false,\"slug_hash_private\":\"b68f0f7b47b2e209ae265a1f72c2cf33\",\"has_animation\":true,\"team_id\":0,\"css_prefix\":\"neither\",\"template\":false,\"parent_id\":0,\"comments_count\":0,\"custom_screenshot_filename\":null,\"loves_count\":0,\"pick\":false,\"popularity_score\":0,\"views_count\":0,\"pick_visible_at\":null,\"cpid\":\"0164d818-f298-7553-8ce5-f82aad28b874\",\"is_new_editor_pen\":false,\"pen_hash\":null,\"hashid\":\"QBqwWL\"}"}