{"version":3,"sources":["webpack:///./src/pages/index.js"],"names":["query","data","console","log","css","fluid","imageHero","childImageSharp","alt","to","imageApproach","pageApproach","title","dangerouslySetInnerHTML","__html","excerpt","slug","imageProjects","pageProjects","imageCampus","pageCampus"],"mappings":"8MASaA,EAAK,Y,snEAoDH,sBAAe,IAAZC,EAAW,EAAXA,KAEd,OADAC,QAAQC,IAAIF,GAER,YAAC,IAAD,KACI,YAAC,SAAD,KACI,+EAEJ,wBACI,sBACIG,IAAG,GAgDH,0BACI,YAAC,IAAD,CAAKC,MAAOJ,EAAKK,UAAUC,gBAAgBF,MAAOG,IAAI,MAE1D,qDAAgC,4DAChC,yJACA,mBACIJ,IAAG,GAOH,YAAC,IAAD,CAAMK,GAAG,YAAW,YAAC,IAAD,qBACpB,YAAC,IAAD,CAAMA,GAAG,mBAAkB,YAAC,IAAD,0BAGnC,mBACAL,IAAG,GAoGC,uBACIA,IAAG,GAmBH,0BACI,YAAC,IAAD,CAAKC,MAAOJ,EAAKS,cAAcH,gBAAgBF,MAAOG,IAAI,MAE9D,uBACI,sBAAKP,EAAKU,aAAaC,OACvB,mBAAKC,wBAAyB,CAAEC,OAAQb,EAAKU,aAAaI,WAC1D,YAAC,IAAD,CAAMN,GAAE,IAAMR,EAAKU,aAAaK,MAAQ,YAAC,IAAD,wBAGhD,2BACI,sBACIZ,IAAG,GAMH,YAAC,IAAD,CAAKC,MAAOJ,EAAKgB,cAAcV,gBAAgBF,MAAOG,IAAI,MAE9D,uBACI,sBAAKP,EAAKiB,aAAaN,OACvB,mBAAKC,wBAAyB,CAAEC,OAAQb,EAAKiB,aAAaH,WAC1D,YAAC,IAAD,CAAMN,GAAE,IAAMR,EAAKiB,aAAaF,MAAQ,YAAC,IAAD,4BAGhD,2BACI,0BACI,YAAC,IAAD,CAAKX,MAAOJ,EAAKkB,YAAYZ,gBAAgBF,MAAOG,IAAI,MAE5D,uBACI,kDACA,mBAAKK,wBAAyB,CAAEC,OAAQb,EAAKmB,WAAWL,WACxD,YAAC,IAAD,CAAMN,GAAE,IAAMR,EAAKmB,WAAWJ,MAAQ,YAAC,IAAD","file":"component---src-pages-index-js-19263c6a6bbf638296e3.js","sourcesContent":["import React from 'react'\nimport { Helmet } from 'react-helmet'\nimport { Link, graphql } from 'gatsby'\nimport { css } from '@emotion/core'\nimport Layout from '../components/layout'\nimport Button from '../components/Button'\nimport Img from 'gatsby-image'\n\n\nexport const query = graphql`\n    query {\n        imageHero: file(relativePath: { eq: \"images/acton-hero.png\" }) {\n            childImageSharp {\n                # Specify the image processing specifications right in the query.\n                fluid {\n                    ...GatsbyImageSharpFluid_withWebp_tracedSVG\n                }\n            }\n        }\n        imageApproach: file(relativePath: { eq: \"images/learn-by-doing.png\" }) {\n            childImageSharp {\n                # Specify the image processing specifications right in the query.\n                fluid {\n                    ...GatsbyImageSharpFluid_withWebp_tracedSVG\n                }\n            }\n        }\n        imageProjects: file(relativePath: { eq: \"images/learn-by-doing-2.png\" }) {\n            childImageSharp {\n                # Specify the image processing specifications right in the query.\n                fluid {\n                    ...GatsbyImageSharpFluid_withWebp_tracedSVG\n                }\n            }\n        }\n        imageCampus: file(relativePath: { eq: \"images/campus-alt.png\" }) {\n            childImageSharp {\n                # Specify the image processing specifications right in the query.\n                fluid {\n                    ...GatsbyImageSharpFluid_withWebp_tracedSVG\n                }\n            }\n        }\n        pageApproach: wordpressPage(slug: { eq: \"approach\" }) {\n            title\n            excerpt\n            slug\n        }\n        pageProjects: wordpressPage(slug: { eq: \"projects\" }) {\n            title\n            excerpt\n            slug\n        }\n        pageCampus: wordpressPage(slug: { eq: \"campus\" }) {\n            title\n            excerpt\n            slug\n        }\n    }\n`\n\nexport default ({ data }) => {\n    console.log(data)\n    return (\n        <Layout>\n            <Helmet>\n                <title>Turn Learning Upside Down / Acton Academy Upstate</title>\n            </Helmet>\n            <main>\n                <header\n                    css={css`\n                        position: relative;\n                        padding: 0 0 2em;\n                        h1 {\n                            position: relative;\n                            font-size: 2em;\n                            line-height: 1.1;\n                            em {\n                                font-style: normal;\n                            }\n                        }\n                        @media ( max-width: 48em ) {\n                            figure {\n                                margin-top: 0;\n                                margin-right: -8em;\n                                margin-left: -8em;\n                            }\n                        }\n                        @media ( min-width: 48em ) {\n                            padding-top: 10em;\n                            padding-bottom: 8em;\n                            padding-right: 45%;\n                            padding-left: 3em;\n                            figure {\n                                position: absolute;\n                                margin: 0;\n                                top: 0;\n                                width: 60%;\n                                left: 52%;\n                                bottom: 0;\n                                img {\n                                    max-width: 100%;\n                                }\n                            }\n                            h1 {\n                                font-size: 2.875em;\n                                em {\n                                    display: block;\n                                }\n                            }\n                            p {\n                                font-size: 1.25em;\n                                margin-top: 0;\n                                max-width: 30em;\n                            }\n                        }\n                    `}\n                >\n                    <figure>\n                        <Img fluid={data.imageHero.childImageSharp.fluid} alt=\"\" />\n                    </figure>\n                    <h1>Launch your Hero’s Journey: <em>Find a calling; change the world.</em></h1>\n                    <p>The Acton Academy mission is to inspire each child and parent who enters our doors to find a calling that will change the world.</p>\n                    <nav\n                        css={css`\n                            display: flex;\n                            a:not(:last-child) {\n                                margin-right: 1em;\n                            }\n                        `}\n                    >\n                        <Link to=\"/mission\"><Button>Our Mission</Button></Link>\n                        <Link to=\"/a-day-at-acton\"><Button>A Day at Acton</Button></Link>\n                    </nav>\n                </header>\n                <div\n                css={css`\n                    position: relative;\n                    background-color: #fff;\n                    &::before {\n                        content: '';\n                        position: absolute;\n                        top: 0;\n                        bottom: 0;\n                        width: 100vw;\n                        left: 50%;\n                        margin-left: -50vw;\n                        background-color: inherit;\n                    }\n                    section {\n                        position: relative;\n                        padding: 1.5em 0;\n                        h2 {\n                            font-size: 1.5em;\n                            margin: 0;\n                            line-height: 1.2;\n                        }\n                        p {\n                            margin: 0.5em 0 1em;\n                        }\n                    }\n                    @media ( max-width: 48em ) {\n                        section {\n                            padding-top: 2.5em;\n                            padding-bottom: 2.5em;\n                        }\n                        section:nth-of-type(odd) {\n                            padding-right: 35%;\n                        }\n                        section:nth-of-type(even) {\n                            padding-left: 38%;\n                        }\n                        section figure {\n                            position: absolute;\n                            top: 50%;\n                            width: 70%;\n                            transform: translate3d(0,-55%,0);\n                        }\n                        section:nth-of-type(odd) figure {\n                            left: 60%;\n                        }\n                        section:nth-of-type(even) figure {\n                            right: 60%;\n                        }\n                        section > div {\n                            position: relative;\n                        }\n                    }\n                    @media ( min-width: 48em ) {\n                        position: relative;\n                        display: grid;\n                \t\tgrid-template-columns: 15% 33% 6% 33% 15%;\n                \t\tgrid-template-rows: auto auto;\n                \t\tgrid-template-areas:\n                \t\t\t\". main main main .\"\n                \t\t\t\". second . third .\";\n                        section {\n                            padding: 2em 0;\n                            h2 {\n                                font-size: 2em;\n                            }\n                            p {\n                                font-size: 1.125em;\n                            }\n                        }\n                        section:not(:first-child) {\n                            display: flex;\n                            flex-direction: column;\n                            justify-content: flex-end;\n                            text-align: center;\n                            padding-bottom: 6em;\n                            figure {\n                                width: 100%;\n                                max-width: 30em;\n                                margin-right: auto;\n                                margin-left: auto;\n                            }\n                            & > div {\n                                display: flex;\n                                flex-direction: column;\n                                flex-grow: 1;\n                                a {\n                                    margin-top: auto;\n                                }\n                            }\n                        }\n                        section:nth-child(2) {\n                            grid-area: second;\n                    \t\tplace-self: stretch;\n                        }\n                        section:nth-child(3) {\n                            grid-area: third;\n                    \t\tplace-self: stretch;\n                        }\n                    }\n                `}>\n                    <section\n                        css={css`\n                            @media ( min-width: 48em ) {\n                        \t\tgrid-area: main;\n                        \t\tplace-self: stretch;\n                                display: flex;\n                                justify-content: center;\n                                align-items: center;\n                                width: 100%;\n                                figure {\n                                    width: 40%;\n                                    margin-right: 5%;\n                                }\n                                & > div {\n                                    width: 45%;\n                                }\n                            }\n\n                        `}\n                    >\n                        <figure>\n                            <Img fluid={data.imageApproach.childImageSharp.fluid} alt=\"\" />\n                        </figure>\n                        <div>\n                            <h2>{data.pageApproach.title}</h2>\n                            <div dangerouslySetInnerHTML={{ __html: data.pageApproach.excerpt }} />\n                            <Link to={`/${data.pageApproach.slug}`}><Button>Our Approach</Button></Link>\n                        </div>\n                    </section>\n                    <section>\n                        <figure\n                            css={css`\n                                @media ( min-width: 48em ) {\n                                    max-width: 21.95em !important;\n                                }\n                            `}\n                        >\n                            <Img fluid={data.imageProjects.childImageSharp.fluid} alt=\"\" />\n                        </figure>\n                        <div>\n                            <h2>{data.pageProjects.title}</h2>\n                            <div dangerouslySetInnerHTML={{ __html: data.pageProjects.excerpt }} />\n                            <Link to={`/${data.pageProjects.slug}`}><Button>Learner Projects</Button></Link>\n                        </div>\n                    </section>\n                    <section>\n                        <figure>\n                            <Img fluid={data.imageCampus.childImageSharp.fluid} alt=\"\" />\n                        </figure>\n                        <div>\n                            <h2>Located at Two Fox Farms</h2>\n                            <div dangerouslySetInnerHTML={{ __html: data.pageCampus.excerpt }} />\n                            <Link to={`/${data.pageCampus.slug}`}><Button>Campus</Button></Link>\n                        </div>\n                    </section>\n                </div>\n            </main>\n        </Layout>\n    )\n}\n"],"sourceRoot":""}