{"version":3,"file":"component---src-pages-visa-applications-tsx-792fc87ae8ddb901e72b.js","mappings":"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","sources":["webpack://gatsby-starter-default/./src/components/buttons/Enquirebutton.tsx","webpack://gatsby-starter-default/./src/components/lines/Line.tsx","webpack://gatsby-starter-default/./src/components/sections/VisaList.tsx","webpack://gatsby-starter-default/./src/components/sections/VisaSection.tsx","webpack://gatsby-starter-default/./src/pages/visa-applications.tsx","webpack://gatsby-starter-default/./src/styles/HeroElement.tsx"],"sourcesContent":["import { Link } from \"gatsby\"\nimport React, { FunctionComponent } from \"react\"\nimport styled from \"styled-components\"\nimport { H4 } from \"../../styles/TextStyles\"\n\ninterface EnquireButtonProps {\n  title?: string\n}\n\nconst EnquireButton: FunctionComponent<EnquireButtonProps> = ({\n  title = \"Enquire now\",\n}) => {\n  return (\n    <Button>\n      <Link to=\"/enquire\">\n        <Wrapper>\n          <Title>{title}</Title>\n        </Wrapper>\n      </Link>\n    </Button>\n  )\n}\n\nexport default EnquireButton\nconst Button = styled.div`\n  a {\n    text-decoration: none;\n  }\n`\nconst Wrapper = styled.div`\n  display: grid;\n  justify-content: center;\n  align-items: center;\n  width: 280px;\n  height: 77px;\n  background: blue;\n  color: white;\n  border-radius: 12px;\n  font-size: 17px;\n  cursor: pointer;\n  font-weight: 400;\n  @media (max-width: 640px) {\n    width: 230px;\n    height: 55px;\n  }\n`\nconst Title = styled(H4)``\n","import React, { FunctionComponent } from \"react\"\nimport styled from \"styled-components\"\n\ninterface LineProps {\n  title?: string\n}\n\nconst Line: FunctionComponent<LineProps> = props => {\n  const { title = \"Think Big, Think Joshua Organisation\" } = props\n  return (\n    <Wrapper>\n      <Title>{title}</Title>\n    </Wrapper>\n  )\n}\n\nexport default Line\n\nconst Wrapper = styled.div`\n  padding: 30px 0 30px 0;\n  width: 1438px;\n  background: blue;\n  height: 80px;\n\n  @keyframes blink-caret {\n    from,\n    to {\n      border-color: transparent;\n    }\n    50% {\n      border-color: #fff;\n    }\n  }\n  @keyframes typing {\n    0% {\n      width: 0%;\n    }\n    30% {\n      width: 100%;\n    }\n    80% {\n      width: 100%;\n    }\n    90% {\n      width: 0%;\n    }\n    100% {\n      width: 0%;\n    }\n  }\n\n  @media (max-width: 1024px) {\n    width: 800px;\n  }\n  @media (max-width: 768px) {\n    width: 700px;\n  }\n  @media (max-width: 640px) {\n    width: 300px;\n    height: 40px;\n  }\n`\nconst Title = styled.h1`\n  /* color: rgba(103, 128, 159, 1); */\n  color: white;\n  text-transform: uppercase;\n\n  text-align: center;\n  font-size: 19px;\n  @media (max-width: 640px) {\n    font-size: 14px;\n  }\n  //Aninmation\n  white-space: nowrap;\n  overflow: hidden;\n  animation: typing 15s steps(300) forwards, blink-caret 0.15s step-end infinite;\n  animation-iteration-count: infinite;\n`\n","import React, { FunctionComponent } from \"react\"\nimport styled from \"styled-components\"\nimport { H3 } from \"../../styles/TextStyles\"\n\ninterface VisaListProps {}\n\nconst VisaList: FunctionComponent<VisaListProps> = () => {\n  return (\n    <Wrapper>\n      <TextWrapper>\n        <Title>Types of South African Visa Applications:</Title>\n        <Description>❖ South African Study Visa</Description>\n        <Description>❖ South African Medical Visa</Description>\n        <Description>❖ South African Critical Skills Visa</Description>\n        <Description>❖ South African Work Visa</Description>\n        <Description>❖ South African Business Visa</Description>\n        <Description>❖ South African Relative Visa</Description>\n        <Description>❖ South African Spousal Visa</Description>\n        <Description>❖ South African Retirement Visa</Description>\n        <Description>❖ South African Permanent Residence Visa</Description>\n        <Description>❖ South African Inter-Company Transfer</Description>\n        <Description>❖ South African Holiday Visa</Description>\n        <Description>❖ Waivers</Description>\n        <Description>❖ Appeal Applications</Description>\n      </TextWrapper>\n    </Wrapper>\n  )\n}\n\nexport default VisaList\n\nconst Wrapper = styled.div`\n  padding: 40px 0 80px 0;\n`\nconst TextWrapper = styled.div`\n  max-width: 820px;\n  display: grid;\n  margin: 0 auto;\n  gap: 20px;\n  @media (max-width: 640px) {\n    max-width: 300px;\n  }\n`\nconst Title = styled(H3)`\n  @media (max-width: 640px) {\n    font-size: 18px;\n    font-weight: 500;\n    line-height: 130%;\n  }\n`\nconst Description = styled.p`\n  font-size: 14px;\n  line-height: 180%;\n  span {\n    font-weight: bold;\n  }\n`\n","import { graphql, useStaticQuery } from \"gatsby\"\nimport { GatsbyImage } from \"gatsby-plugin-image\"\nimport React, { FunctionComponent } from \"react\"\nimport {\n  ContentWrapper,\n  Description,\n  FileWrapper,\n  TextWrapperWrapper,\n  Title,\n  Wrapper,\n} from \"../../styles/HeroElement\"\n\n// import Enquirebutton from \"../buttons/Enquirebutton\"\n\ninterface VisaSectionProps {\n  title?: string\n  description?: string\n}\n\nconst VisaSection: FunctionComponent<VisaSectionProps> = props => {\n  const {\n    title = \"Visa Applications\",\n    description = \"Let us help you with your Visa application. We ensure an efficient, transparent and seamless process in applying for your required Visa.\",\n  } = props\n  const data = useStaticQuery(graphql`\n    query VisasQuery {\n      Image: file(relativePath: { eq: \"passport.jpeg\" }) {\n        childImageSharp {\n          gatsbyImageData(layout: CONSTRAINED, quality: 10)\n        }\n      }\n    }\n  `)\n  return (\n    <Wrapper>\n      <ContentWrapper>\n        <TextWrapperWrapper>\n          <Title>{title}</Title>\n          <Description>{description}</Description>\n          {/* <Enquirebutton /> */}\n        </TextWrapperWrapper>\n        <FileWrapper>\n          <GatsbyImage\n            style={styles}\n            alt=\"images\"\n            image={data.Image.childImageSharp.gatsbyImageData}\n          />\n        </FileWrapper>\n      </ContentWrapper>\n    </Wrapper>\n  )\n}\n\nexport default VisaSection\nconst styles = {\n  borderRadius: \"20px\",\n}\n","import React, { FunctionComponent } from \"react\"\nimport styled from \"styled-components\"\nimport EnquireButton from \"../components/buttons/Enquirebutton\"\n// import VisaCard from \"../components/cards/VisaCard\"\nimport Layout from \"../components/layout/Layout\"\nimport SEO from \"../components/layout/SEO\"\nimport Line from \"../components/lines/Line\"\nimport VisaList from \"../components/sections/VisaList\"\n// import VisaHero from \"../components/sections/VisaHero\"\nimport VisaSection from \"../components/sections/VisaSection\"\n\ninterface VisaProps {\n  title: string\n  name: string\n  content: string\n}\n\nconst Visa: FunctionComponent<VisaProps> = props => {\n  const {\n    title = \"Visa Application\",\n    name = \"Keywords\",\n    content = \"Education\",\n  } = props\n  return (\n    <Layout>\n      <SEO title={title} />\n      <meta name={name} content={content} />\n      <VisaSection />\n      <LineWrapper>\n        <Line />\n      </LineWrapper>\n      <VisaList />\n      {/* <VisaHero /> */}\n      {/* <VisaCard /> */}\n      <ButtonWrapper>\n        <EnquireButton />\n      </ButtonWrapper>\n    </Layout>\n  )\n}\n\nexport default Visa\n\nconst LineWrapper = styled.div`\n  margin: 50px 0 0 0;\n  display: grid;\n  justify-content: center;\n`\nconst ButtonWrapper = styled.div`\n  display: grid;\n  justify-content: center;\n  padding: 0 0 120px 0;\n  @media (max-width: 640px) {\n    padding: 10px 0 40px 0;\n  }\n`\n","import styled from \"styled-components\"\nimport { H1, Paragraph } from \"./TextStyles\"\n\nexport const Wrapper = styled.div`\n  padding: 100px 100px 0 100px;\n`\nexport const ContentWrapper = styled.div`\n  justify-content: center;\n  max-width: 1234px;\n  display: grid;\n  grid-template-columns: 500px auto;\n  gap: 40px;\n  align-items: center;\n  @media (max-width: 1024px) {\n    grid-template-columns: 500px;\n  }\n  @media (max-width: 768px) {\n    grid-template-columns: 500px;\n  }\n  @media (max-width: 640px) {\n    grid-template-columns: auto;\n  }\n`\nexport const TextWrapperWrapper = styled.div`\n  max-width: 500px;\n  display: grid;\n  gap: 30px;\n\n  @media (max-width: 640px) {\n    max-width: 360px;\n    grid-template-columns: 300px;\n  }\n`\nexport const FileWrapper = styled.div``\nexport const Image = styled.img`\n  width: 600px;\n  border-radius: 20px;\n  @media (max-width: 1024px) {\n    width: 500px;\n  }\n  @media (max-width: 768px) {\n    width: 500px;\n  }\n  @media (max-width: 640px) {\n    width: 300px;\n  }\n`\n\nexport const Title = styled(H1)`\n  @media (max-width: 640px) {\n    width: 300px;\n    font-size: 30px;\n  }\n  color: black;\n  font-weight: bold;\n`\nexport const Description = styled(Paragraph)`\n  line-height: 160%;\n`\n"],"names":["title","Button","Link","to","Wrapper","Title","styled","H4","props","TextWrapper","Description","H3","description","data","useStaticQuery","G","style","styles","alt","image","Image","childImageSharp","gatsbyImageData","borderRadius","name","content","Layout","SEO","LineWrapper","Line","ButtonWrapper","ContentWrapper","TextWrapperWrapper","FileWrapper","H1","Paragraph"],"sourceRoot":""}