{
  "version": 3,
  "sources": ["../javascripts/styled-components/components/Page/index.tsx"],
  "sourcesContent": ["import styled, { css } from 'styled-components';\n\nimport { size } from '../../layout/helpers';\n\nexport const Page = styled.div.withConfig({ componentId: 'sc-1ebfm8n-0' })`\n    padding: ${size(4)} 0;\n\n    ${(props) => props.theme.breakpoint.Md} {\n        padding: ${size(7)} 0;\n    }\n`;\n\ninterface PageSectionProps {\n  $tone?: 'alt';\n  $separators?: 'alt' | 'mobile';\n}\n\nexport const PageSection = styled.div.withConfig({ componentId: 'sc-1ebfm8n-1' })<PageSectionProps>`\n    --_spacing: ${size(4)};\n\n    ${(props) => props.theme.breakpoint.Md} {\n        --_spacing: ${size(7)};\n    }\n\n    & + & {\n        margin-top: var(--_spacing);\n    }\n\n    ${({ $tone }) =>\n      $tone === 'alt'\n        ? css`\n                  padding: var(--_spacing) 0;\n                  background-color: var(--c-bg-alt);\n              `\n        : undefined}\n\n    ${({ $separators }) =>\n      $separators === 'alt'\n        ? css`\n                  padding: var(--_spacing) 0;\n                  border-top: 1px solid var(--c-bg-alt);\n                  border-bottom: 1px solid var(--c-bg-alt);\n              `\n        : $separators === 'mobile'\n          ? css`\n                  ${(props) => props.theme.breakpoint.LtMd} {\n                      padding-bottom: var(--_spacing);\n                      border-bottom: ${size(1)} solid var(--c-bg-alt);\n                  }\n              `\n          : undefined}\n`;\n\n// Used to pop out element from PageSection (up) on larger screens.\n// Useful if the elements children should be overlapping with a hero.\nexport const PageSectionPopOutMd = styled.div.withConfig({ componentId: 'sc-1ebfm8n-2' })`\n    position: relative;\n    margin-top: ${size(-8)};\n    z-index: 15;\n\n    ${(props) => props.theme.breakpoint.Md} {\n        margin-top: ${size(-17)};\n        margin-bottom: -100%; // Allows the content to be placed on top of other content on the page\n    }\n`;\n\nexport const PageSearchContainer = styled.div.withConfig({ componentId: 'sc-1ebfm8n-3' })`\n    text-align: center;\n    max-width: ${size(79)};\n    margin: 0 auto;\n`;\n"],
  "mappings": "6DAIO,IAAMA,EAAOC,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA,eAC1DC,EAAK,CAAC,CAAC;AAAA;AAAA,MAEfC,GAAUA,EAAM,MAAM,WAAW,EAAE;AAAA,mBACvBD,EAAK,CAAC,CAAC;AAAA;AAAA,EASbE,EAAcH,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA,kBAC9DC,EAAK,CAAC,CAAC;AAAA;AAAA,MAElBC,GAAUA,EAAM,MAAM,WAAW,EAAE;AAAA,sBACpBD,EAAK,CAAC,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAOvB,CAAC,CAAE,MAAAG,CAAM,IACTA,IAAU,MACNC;AAAA;AAAA;AAAA,gBAIA,MAAS;AAAA;AAAA,MAEb,CAAC,CAAE,YAAAC,CAAY,IACfA,IAAgB,MACZD;AAAA;AAAA;AAAA;AAAA,gBAKAC,IAAgB,SACdD;AAAA,oBACSH,GAAUA,EAAM,MAAM,WAAW,IAAI;AAAA;AAAA,uCAEnBD,EAAK,CAAC,CAAC;AAAA;AAAA,gBAGlC,MAAS;AAAA,EAKRM,EAAsBP,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA,kBAEtEC,EAAK,EAAE,CAAC;AAAA;AAAA;AAAA,MAGnBC,GAAUA,EAAM,MAAM,WAAW,EAAE;AAAA,sBACpBD,EAAK,GAAG,CAAC;AAAA;AAAA;AAAA,EAKlBO,EAAsBR,EAAO,IAAI,WAAW,CAAE,YAAa,cAAe,CAAC;AAAA;AAAA,iBAEvEC,EAAK,EAAE,CAAC;AAAA;",
  "names": ["Page", "dt", "size", "props", "PageSection", "$tone", "lt", "$separators", "PageSectionPopOutMd", "PageSearchContainer"]
}