{"version":3,"sources":["App.js","spinner.gif","components/ScrollToTop.js","components/Home/HomeSectionElements.js","components/Home/HomeSection.js","components/Home/HomeSection2Elements.js","components/Home/HomeSection2.js","components/Home/HomeSection3Elements.js","components/Home/HomeSection3.js","components/Home/HomeSection4Elements.js","components/Home/HomeSection4.js","components/Home/HomeSection5Elements.js","components/Home/HomeSection5.js","components/Home/HomeSection6Elements.js","components/Home/HomeSection6.js","components/Home/HomeSection7Elements.js","components/Home/HomeSection7.js","components/Home/HomeSectionNewElements.js","components/Home/HomeSectionNew.js","pages/HomePage/Data.js","pages/HomePage/index.js","pages/Delete/DeleteElements.js","pages/Delete/index.js","index.js","globalStyles.js","components/Sidebar/SidebarElements.js","components/Sidebar/index.js","components/Navbar/NavbarElements.js","components/Navbar/index.js","components/Footer/FooterElements.js","components/Footer/index.js","Routes.js","SpinnerElements.js","components/Home/HomeSection8Elements.js","components/Home/HomeSection8.js"],"names":["style","height","width","lineHeight","borderRadius","backgroundColor","color","textAlign","fontSize","border","Spinner","src","spinner","alt","About","lazy","Privacy","Pricing","TermsofService","SupportCenter","Careers","Blogs","Security","Solutions","PaymentStand","Dashboard","Faq","Blog1","ScammedBlog","App","path","exact","component","Home","Delete","userAgent","navigator","vendor","window","opera","test","global","location","href","MSStream","fallback","className","ScrollToTop","pathname","useLocation","useEffect","scrollTo","InfoSec","styled","div","lightBg","InfoRow","imgStart","InfoColumn","TextWrapper","ImgWrapper","start","Img","img","Heading","h1","BtnFree","BtnWrap","Subtitle","p","AndriodImg","span","RecImg","linkStyle","textDecoration","HomeSection","description","buttonLabel","buttonLabel2","buttonLabel3","img2","alt2","imgHome","target","to","TopLine","CircleImg","HomeSection2","topLine","headline","InfoContainer","Column1","Column2","ImgWrap","HomeSection3","stepone","steptwo","one","two","title1","title2","headline1","description1","description2","headline2","Head","SubHead","h2","QrWrap","TitleWrap","Title","Title2","Title3","Title4","LineWrap","LineWrap2","Line1","Line2","Description","SlideWrap","FirstSlide","SecondSlide","ThirdSlide","Button","Step1","h3","ContentOne","HomeSection4","step1","step2","step3","content1","content2","content3","content4","content5","content6","subheadline","ref","useRef","goTo","slide","current","useState","showQR","setShowQR","showBank","setShowBank","isFirst","setIsFirst","isSecond","setIsSecond","isThird","setIsThird","matchMedia","matches","setMatches","addEventListener","e","switchQR","event","switchBank","onChange","currentSlide","btnStyle","marginRight","marginTop","background","actStyle","onClick","afterChange","effect","dots","display","justifyContent","alignItems","BtnWrap2","Flex","Flex2","WebApp","FreeImg","FreeImg2","FreeImg3","RightImg","Img1","Img2","Img3","Img4","HomeSection5","merchant","webApp","img1","img3","bank","qr","img4","img11","img12","alt11","img13","alt1","alt3","alt4","MssgWrap","PciWrap","Heading2","LockImg","HomeSection6","subHead","subHead2","description3","PartnersWrap","Partners","Values","PartnerImg","PartnerImg2","PartnerImg3","HomeSection7","paythru","genesys","tence","InfoColumnR","First","Second","DescriptionL","InfoRow2","Column3","HomeSectionNew","title3","firstImg","setFirstImg","secondImg","setSecondImg","thirdImg","setThirdImg","switchFirstImg","switchSecondImg","switchThirdImg","homeObjOne","homeObjTwo","homeObjThree","homeObjFour","stepthree","homeObjNew","image1","image2","image3","homeObjFive","fee","homeObjSix","homeObjSeven","Routes","HomeSection8","Position","show","setShow","ReactDOM","render","document","getElementById","GlobalStyle","createGlobalStyle","Container","Container2","button","Button2","ButtonGrey","ButtonApp","ButtonOS","Button22","Button3","Button44","Button5","Button6","Button7","SidebarContainer","aside","isOpen","SidebarLogo","LinkR","Icon","SidebarWrapper","SidebarMenu","ul","SidebarLink","LinkS","SidebarLink2","SideBtnWrap","SidebarRoute","SidebarRoute1","SidebarBtn","linksStyle","linkyStyle","Sidebar","toggle","solutions","Item","help","company","fill","viewBox","stroke-width","stroke","stroke-linecap","stroke-linejoin","d","overlay","Nav","nav","NavbarContainer","NavLogo","MobileIcon","NavMenu","NavItem","li","NavLinks","NavLink","NavBtn","NavBtnLink","Navbar","navbr","setNavbr","scrollY","scroll","scrollToTop","FooterContainer","FooterWrap","FooterLinksContainer","FooterLinksWrapper","FooterLinksWrapper2","FooterLinkItems","FooterLinkItems2","FooterLinkItems3","FooterLinkItems4","FooterLinkItems5","FooterLinkTitle","FooterLink","Link","FooterLink2","FooterLogo","section","FooterLine","hr","LastLine","SocialIcons","socialIcons","Footer","rel","aria-label","Date","getFullYear","children","setIsOpen","Spin","Card"],"mappings":"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","file":"static/js/main.2ba530f7.chunk.js","sourcesContent":["import React, { Suspense, lazy } from \"react\";\nimport { BrowserRouter as Router, Switch, Route } from \"react-router-dom\";\nimport GlobalStyle from \"./globalStyles\";\nimport Home from \"./pages/HomePage\";\nimport \"antd/dist/antd.css\";\nimport { FaAngleUp } from \"react-icons/fa\";\nimport { BackTop } from \"antd\";\nimport spinner from \"./spinner.gif\";\nimport { Spin, Img } from \"./SpinnerElements\";\nimport ScrollToTop from './components/ScrollToTop';\nimport Delete from \"./pages/Delete\";\n\nconst style = {\n  height: 40,\n  width: 40,\n  lineHeight: \"45px\",\n  borderRadius: 4,\n  backgroundColor: \"#ffffff\",\n  color: \"#1A71FF\",\n  textAlign: \"center\",\n  fontSize: 20,\n  border: \"0.5px solid #1A71FF\",\n};\n\nconst Spinner = () => (\n <Spin>\n     <Img src={spinner} alt=\"Loading...\" />\n </Spin>\n);\n\nconst About = lazy(() => import(\"./pages/About\"));\nconst Privacy = lazy(() => import(\"./pages/Privacy\"));\nconst Pricing = lazy(() => import(\"./pages/Pricing\"));\nconst TermsofService = lazy(() => import(\"./pages/TermsofService\"));\nconst SupportCenter = lazy(() => import(\"./pages/SupportCenter\"));\nconst Careers = lazy(() => import(\"./pages/Careers\"));\nconst Blogs = lazy(() => import(\"./pages/Blog\"));\nconst Security = lazy(() => import(\"./pages/Security\"));\nconst Solutions = lazy(() => import(\"./pages/Solutions/\"));\nconst PaymentStand = lazy(() => import(\"./pages/PaymentStand\"));\nconst Dashboard = lazy(() => import(\"./pages/Dashboard/\"));\nconst Faq = lazy(() => import(\"./pages/Faq\"));\nconst Blog1 = lazy(() => import(\"./pages/BlogPosts/Blog1\"))\nconst ScammedBlog = lazy(() => import(\"./pages/ScammedBlogPost/ScammedBlog\"))\n\nfunction App() {\n\n  function getMobileOperatingSystem() {\n    var userAgent = navigator.userAgent || navigator.vendor || window.opera;\n\n    // Windows Phone must come first because its UA also contains \"Android\"\n    if (/windows phone/i.test(userAgent)) {\n        return \"Windows Phone\";\n    }\n\n    if (/android/i.test(userAgent)) {\n       global.window && (global.window.location.href = 'https://play.google.com/store/apps/details?id=com.deempay.app');\n       return null;\n    }\n\n    // iOS detection from: http://stackoverflow.com/a/9039885/177710\n    if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {\n      global.window && (global.window.location.href = 'https://apps.apple.com/ng/app/deempay/id1660927213');\n      return null;\n    }\n\n    return \"unknown\";\n}\n\n  return (\n    <>\n      <Router>\n        <GlobalStyle />\n        <ScrollToTop />\n        <Switch>\n          <Route path=\"/\" exact component={Home} />\n          <Route path=\"/delete\" exact component={Delete} />\n          <Route\n              path=\"/dl\"\n              component={getMobileOperatingSystem}\n          />\n          {/* <Route\n              path=\"/dl\"\n              component={() => {\n              global.window && (global.window.location.href = 'https://play.google.com/store/apps/details?id=com.deempay.app');\n              return null;\n              }}\n          /> */}\n          <Suspense fallback={<Spinner />}>\n            <Route path=\"/deempay-app\" exact component={Solutions} />\n            <Route path=\"/deempay-dashboard\" exact component={Dashboard} />\n            <Route path=\"/careers\" exact component={Careers} />\n            <Route path=\"/security\" exact component={Security} />\n            <Route path=\"/pricing\" exact component={Pricing} />\n            <Route path=\"/faq\" exact component={Faq} />\n            <Route path=\"/supportcenter\" exact component={SupportCenter} />\n            <Route path=\"/payment-stand\" exact component={PaymentStand} />\n            <Route path=\"/privacy\" exact component={Privacy} />\n            <Route path=\"/termsofservice\" exact component={TermsofService} />\n            <Route path=\"/about\" exact component={About} />\n            <Route path=\"/blog\" exact component={Blogs} />\n            <Route path=\"/blog/creating-a-qr-code-for-your-business\"  component={Blog1} />\n            <Route path=\"/blog/how-i-was-scammed-at-my-shop\"  component={ScammedBlog} />\n          </Suspense>\n        </Switch>\n      </Router>\n      <BackTop>\n        <div style={style}>\n          <div className=\"\">{<FaAngleUp />}</div>\n        </div>\n      </BackTop>\n    </>\n  );\n}\n\nexport default App;\n","export default __webpack_public_path__ + \"static/media/spinner.577bbc3f.gif\";","import { useEffect } from 'react';\r\nimport { useLocation } from 'react-router-dom';\r\n\r\nexport default function ScrollToTop() {\r\n  const { pathname } = useLocation();\r\n\r\n  useEffect(\r\n    () => {\r\n      window.scrollTo(0, 0);\r\n    },\r\n    [pathname]\r\n  );\r\n\r\n  return null;\r\n}","import styled from \"styled-components\";\r\n\r\nexport const InfoSec = styled.div`\r\n  color: #fff;\r\n  padding: 160px 0;\r\n  background: ${({ lightBg }) => (lightBg ? \"#ffffff\" : \"#fafafa\")};\r\n  @media screen and (max-width: 480px) {\r\n    padding: 95px 0 80px 0;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: flex;\r\n  margin: 0 -15px -15px -15px;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  flex-direction: ${({ imgStart }) => (imgStart ? \"row-reverse\" : \"row\")};\r\n`;\r\n\r\nexport const InfoColumn = styled.div`\r\n  margin-bottom: 15px;\r\n  padding-right: 15px;\r\n  padding-left: 15px;\r\n  flex: 1;\r\n  max-width: 50%;\r\n  flex-basis: 50%;\r\n  @media screen and (max-width: 768px) {\r\n    max-width: 100%;\r\n    flex-basis: 100%;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 540px;\r\n  padding-top: 0;\r\n  padding-bottom: 60px;\r\n  @media screen and (max-width: 768px) {\r\n    padding-bottom: 65px;\r\n  }\r\n`;\r\n\r\nexport const ImgWrapper = styled.div`\r\n  max-width: 600px;\r\n  position: relative;\r\n  display: flex;\r\n  justify-content: ${({ start }) => (start ? \"flex-start\" : \"flex-end\")};\r\n`;\r\n\r\nexport const Img = styled.img`\r\n  padding-right: 0;\r\n  border: 0;\r\n  position: relative;\r\n  z-index: 2;\r\n  max-width: 100%;\r\n  vertical-align: middle;\r\n  display: inline-block;\r\n  max-height: 500px;\r\n`;\r\n\r\nexport const Heading = styled.h1`\r\n  max-width: 530px;\r\n  width: 100%;\r\n  line-height: 56px;\r\n  font-size: 48px;\r\n  font-weight: 600;\r\n  @media screen and (max-width: 480px) {\r\n    line-height: 1.1;\r\n    font-size: 38px;\r\n  }\r\n  @media screen and (max-width: 390px) {\r\n    font-size: 38px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    font-size: 34px;\r\n  }\r\n  @media screen and (max-width: 360px) {\r\n    font-size: 32px;\r\n  }\r\n  @media screen and (max-width: 1000px) {\r\n    max-width: 100%;\r\n  }\r\n`;\r\n\r\nexport const Head2 = styled.div`\r\n  margin-bottom: 24px;\r\n  max-width: 530px;\r\n  position: relative;\r\n  h2 {\r\n    font-size: 48px;\r\n    line-height: 1.1;\r\n    font-weight: 600;\r\n    margin-top: -60px;\r\n    color: #0d0d0d;\r\n    @media screen and (max-width: 480px) {\r\n      font-size: 40px;\r\n      text-align: center;\r\n      margin-top: -65px;\r\n    }\r\n    @media screen and (max-width: 360px) {\r\n      font-size: 38px;\r\n      text-align: left;\r\n      margin-top: -50px;\r\n    }\r\n  }\r\n`;\r\n\r\nexport const BtnFree = styled.div`\r\n  display: flex;\r\n  margin-bottom: 30px;\r\n  justify-content: flex-start;\r\n  @media screen and (max-width: 480px) {\r\n    width: 100%;\r\n    align-items: center;\r\n    justify-content: center;\r\n    margin-bottom: 25px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    margin-bottom: 0px;\r\n  }\r\n`;\r\n\r\nexport const BtnWrap = styled.div`\r\n  display: flex;\r\n  justify-content: flex-start;\r\n  @media screen and (max-width: 480px) {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    display: grid;\r\n    width: 100%;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const Subtitle = styled.p`\r\n  max-width: 490px;\r\n  margin-bottom: 35px;\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  color: #000000;\r\n`;\r\n\r\nexport const AndriodImg = styled.span`\r\n  padding-right: 10px;\r\n`;\r\n\r\nexport const RecImg = styled.img`\r\n  z-index: 1;\r\n  position: absolute;\r\n  max-width: 555px;\r\n  padding-right: 8.5rem;\r\n  margin-top: -1.2rem;\r\n  @media screen and (max-width: 991px) {\r\n    padding-right: 3rem;\r\n    margin-top: -2rem;\r\n  }\r\n  @media screen and (max-width: 768px) {\r\n    padding-right: 4rem;\r\n    margin-top: -2rem;\r\n    max-width: 400px;\r\n  }\r\n  @media screen and (max-width: 500px) {\r\n    padding-right: 3rem;\r\n    margin-top: -2rem;\r\n    max-width: 205px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    padding-right: 4rem;\r\n    margin-top: -1rem;\r\n    max-width: 300px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    padding-right: 4.6rem;\r\n    margin-top: -0.6rem;\r\n    max-width: 250px;\r\n  }\r\n  @media screen and (max-width: 280px) {\r\n    padding-right: 2rem;\r\n    margin-top: -1rem;\r\n    max-width: 200px;\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { Container, Button, Button2, Button7 } from \"../../globalStyles\";\r\nimport {\r\n  InfoSec,\r\n  InfoRow,\r\n  InfoColumn,\r\n  TextWrapper,\r\n  Heading,\r\n  Subtitle,\r\n  ImgWrapper,\r\n  Img,\r\n  BtnWrap,\r\n  AndriodImg,\r\n  RecImg,\r\n  BtnFree,\r\n} from \"./HomeSectionElements\";\r\nimport \"./HomeSection.css\";\r\n\r\nconst linkStyle = {\r\n  textDecoration: \"none\",\r\n};\r\n\r\nfunction HomeSection({\r\n  lightBg,\r\n  description,\r\n  buttonLabel,\r\n  buttonLabel2,\r\n  buttonLabel3,\r\n  alt,\r\n  img2,\r\n  alt2,\r\n  imgStart,\r\n  start,\r\n  imgHome,\r\n}) {\r\n  return (\r\n    <>\r\n      <InfoSec lightBg={lightBg}>\r\n        <Container>\r\n          <InfoRow imgStart={imgStart}>\r\n            <InfoColumn>\r\n              <TextWrapper>\r\n                <Heading>\r\n                  Fast and Modern <br />\r\n                  Payment Collections\r\n                  <br />\r\n                  For your Business.\r\n                </Heading>\r\n                <Subtitle>{description}</Subtitle>\r\n                <BtnFree>\r\n                  <Link\r\n                    target=\"_blank\"\r\n                    to={\"//app.deempay.com/registration\"}\r\n                    style={linkStyle}\r\n                  >\r\n                    <Button7>{buttonLabel}</Button7>\r\n                  </Link>\r\n                </BtnFree>\r\n                <BtnWrap>\r\n                  <Link\r\n                    target=\"_blank\"\r\n                    to={\r\n                      \"//play.google.com/store/apps/details?id=com.deempay.app\"\r\n                    }\r\n                    style={linkStyle}\r\n                  >\r\n                    <Button>\r\n                      <AndriodImg>\r\n                        <img src=\"images/google-play.svg\" alt=\"App\" />\r\n                      </AndriodImg>\r\n                      {buttonLabel2}\r\n                    </Button>\r\n                  </Link>\r\n                  <Link \r\n                   target=\"_blank\"\r\n                   to=\"//apps.apple.com/ng/app/deempay/id1660927213\"\r\n                   style={linkStyle}>\r\n                  <Button2>\r\n                    <AndriodImg>\r\n                      <img src=\"images/ios.svg\" alt=\"App\" />\r\n                    </AndriodImg>\r\n                    {buttonLabel3}\r\n                  </Button2>\r\n                  </Link>\r\n                </BtnWrap>\r\n              </TextWrapper>\r\n            </InfoColumn>\r\n            <InfoColumn>\r\n              <ImgWrapper start={start}>\r\n                <RecImg src={img2} alt={alt2} />\r\n                <Img\r\n                  src={imgHome} alt={alt} />\r\n              </ImgWrapper>\r\n            </InfoColumn>\r\n          </InfoRow>\r\n        </Container>\r\n      </InfoSec>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default HomeSection;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoSec = styled.div`\r\n  color: #fff;\r\n  padding: 100px 0;\r\n  background: ${({ lightBg }) => (lightBg ? \"#fafafa\" : \"#fafafa\")};\r\n  @media screen and (max-width: 480px) {\r\n    padding: 60px 0;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: flex;\r\n  margin: 0 -15px -15px -15px;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  flex-direction: ${({ imgStart }) => (imgStart ? \"row-reverse\" : \"row\")};\r\n`;\r\n\r\nexport const InfoColumn = styled.div`\r\n  margin-bottom: 15px;\r\n  padding-right: 15px;\r\n  padding-left: 15px;\r\n  flex: 1;\r\n  max-width: 50%;\r\n  flex-basis: 50%;\r\n  @media screen and (max-width: 768px) {\r\n    max-width: 100%;\r\n    flex-basis: 100%;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 540px;\r\n  padding-top: 0;\r\n  padding-bottom: 60px;\r\n  @media screen and (max-width: 768px) {\r\n    padding-bottom: 65px;\r\n  }\r\n`;\r\n\r\nexport const ImgWrapper = styled.div`\r\n  max-width: 600px;\r\n  display: flex;\r\n  justify-content: ${({ start }) => (start ? \"flex-start\" : \"flex-end\")};\r\n  @media screen and (max-width: 480px) {\r\n    margin-top: -3rem;\r\n  }\r\n`;\r\n\r\nexport const TopLine = styled.div`\r\n  color: #1a71ff;\r\n  font-size: 16px;\r\n  line-height: 16px;\r\n  font-weight: 500;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nexport const Img = styled.img`\r\n  padding-right: 0;\r\n  border: 0;\r\n  max-width: 100%;\r\n  vertical-align: middle;\r\n  display: inline-block;\r\n  max-height: 500px;\r\n`;\r\n\r\nexport const Heading = styled.h1`\r\n  margin-bottom: 24px;\r\n  font-size: 35px;\r\n  max-width: 525px;\r\n  line-height: 1.1;\r\n  font-weight: 600;\r\n  color: #0d0d0d;\r\n  @media screen and (max-width: 1000px) {\r\n    max-width: 100%;\r\n  }\r\n`;\r\n\r\nexport const BtnWrap = styled.div`\r\n  display: flex;\r\n  justify-content: flex-start;\r\n  @media screen and (max-width: 480px) {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    display: grid;\r\n    width: 100%;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const Subtitle = styled.p`\r\n  max-width: 520px;\r\n  margin-bottom: 35px;\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  color: #000000;\r\n`;\r\n\r\nexport const Subtitle2= styled.p`\r\n  max-width: 520px;\r\n  margin-bottom: 35px;\r\n  font-size: 18px;\r\n  line-height: 26px;\r\n  color: #000000;\r\n`;\r\n\r\nexport const CircleImg = styled.span`\r\n  padding-right: 5px;\r\n`;\r\n\r\nexport const TrustWrap = styled.div`\r\n  display: flex;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  grid-gap: 3rem;\r\n  @media screen and (max-width: 500px) {\r\n    grid-gap: 2rem;\r\n  }\r\n  `;\r\n","import React from \"react\";\r\nimport { Container } from \"../../globalStyles\";\r\nimport {\r\n  InfoSec,\r\n  InfoRow,\r\n  InfoColumn,\r\n  TextWrapper,\r\n  TopLine,\r\n  Heading,\r\n  Subtitle,\r\n  //Subtitle2,\r\n  ImgWrapper,\r\n  Img,\r\n  CircleImg,\r\n // TrustWrap,\r\n} from \"./HomeSection2Elements\";\r\n\r\nfunction HomeSection2({\r\n  lightBg,\r\n  topLine,\r\n  headline,\r\n  description,\r\n  //description1,\r\n  img,\r\n  alt,\r\n  imgStart,\r\n  start,\r\n}) {\r\n  return (\r\n    <>\r\n      <InfoSec lightBg={lightBg}>\r\n        <Container>\r\n          <InfoRow imgStart={imgStart}>\r\n            <InfoColumn>\r\n              <TextWrapper>\r\n                <TopLine>\r\n                  <CircleImg>\r\n                    <img src=\"images/cirle.svg\" alt=\"circle\" />\r\n                  </CircleImg>\r\n                  {topLine}\r\n                </TopLine>\r\n                <Heading>{headline}</Heading>\r\n                <Subtitle>{description}</Subtitle>\r\n                {/* <Subtitle2>{description1}</Subtitle2>\r\n                <TrustWrap>\r\n                <img src=\"images/arlaLogo.png\" alt=\"circle\" width=\"15%\" height=\"15%\"/>\r\n                <img src=\"images/arlaLogo.png\" alt=\"circle\" width=\"15%\" height=\"15%\"/>\r\n                <img src=\"images/arlaLogo.png\" alt=\"circle\" width=\"15%\" height=\"15%\"/>\r\n                </TrustWrap> */}\r\n              </TextWrapper>\r\n            </InfoColumn>\r\n            <InfoColumn>\r\n              <ImgWrapper start={start}>\r\n                <Img src={img} alt={alt}  />\r\n              </ImgWrapper>\r\n            </InfoColumn>\r\n          </InfoRow>\r\n        </Container>\r\n      </InfoSec>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default HomeSection2;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoContainer = styled.div`\r\n  padding: 90px 0;\r\n  background: #ffffff;\r\n  @media screen and (max-width: 768px) {\r\n    margin-top: -9rem;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    padding: 40px 0;\r\n    margin-top: 0rem;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: grid;\r\n  grid-auto-columns: minmax(auto, 1fr);\r\n  align-items: center;\r\n  grid-template-areas: \"col1 col2\";\r\n  @media screen and (max-width: 768px) {\r\n    grid-template-areas: \"col1\" \"col2\";\r\n  }\r\n`;\r\n\r\nexport const Column1 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col1;\r\n`;\r\n\r\nexport const Column2 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col2;\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 500px;\r\n  padding-top: 68px;\r\n  margin-left: auto;\r\n  padding-bottom: 0px;\r\n  z-index: 1;\r\n  @media screen and (max-width: 480px) {\r\n    margin-top: 0px;\r\n  }\r\n\r\n  @media screen and (max-width: 768px) {\r\n    padding-top: 0px;\r\n    margin: auto;\r\n    padding-bottom: 0px;\r\n  }\r\n`;\r\n\r\nexport const Heading = styled.p`\r\n  color: #000000;\r\n  font-size: 28px;\r\n  line-height: 32px;\r\n  font-weight: 500;\r\n  max-width: 400px;\r\n  padding-top: 40px;\r\n  margin-bottom: 16px;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 20px;\r\n  }\r\n`;\r\n\r\nexport const Subtitle = styled.p`\r\n  color: #333333;\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  font-style: regular;\r\n  margin-bottom: 40px;\r\n  max-width: 450px;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n  }\r\n`;\r\n\r\nexport const ImgWrap = styled.div`\r\n  max-width: 500px;\r\n  padding-top: 68px;\r\n  margin-left: auto;\r\n  height: 100%;\r\n  @media screen and (max-width: 768px) {\r\n    align-item: center;\r\n    padding-top: 0px;\r\n    margin: auto;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    margin-top: -1rem;\r\n  }\r\n`;\r\n\r\nexport const Img = styled.img`\r\n  width: 85%;\r\n  margin: 0 0 10px 0;\r\n  padding-right: 0;\r\n  margin-left: 0px;\r\n  @media screen and (max-width: 768px) {\r\n    align-item: center;\r\n    margin: auto;\r\n    padding-top: 0px;\r\n    padding: auto;\r\n    width: 100%;\r\n  }\r\n`;\r\n\r\n// export const Img2 = styled.img`\r\n//   width: 80%;\r\n//   margin: 0 0 10px 0;\r\n//   padding-right: 0;\r\n//   margin-left: 0px;\r\n//   @media screen and (max-width: 768px) {\r\n//     align-item: center;\r\n//     margin: auto;\r\n//     padding-top: 0px;\r\n//     padding: auto;\r\n//     width: 100%;\r\n//   }\r\n// `;\r\n","import React from \"react\";\r\nimport { Container } from \"../../globalStyles\";\r\n\r\nimport {\r\n  InfoContainer,\r\n  InfoRow,\r\n  Column1,\r\n  Column2,\r\n  TextWrapper,\r\n  ImgWrap,\r\n  Heading,\r\n  Subtitle,\r\n  Img,\r\n} from \"./HomeSection3Elements\";\r\nimport \"./HomeSection3.css\";\r\nfunction HomeSection3({\r\n  stepone,\r\n  steptwo,\r\n  one,\r\n  two,\r\n  title1,\r\n  title2,\r\n  headline1,\r\n  description1,\r\n  description2,\r\n  headline2,\r\n}) {\r\n  return (\r\n    <div>\r\n    <InfoContainer>\r\n      <h1 className=\"how-works\">{headline1}</h1>\r\n      <h2 className=\"payment-steps\">{headline2}</h2>\r\n      <Container>\r\n        <InfoRow>\r\n          <Column1>\r\n            <TextWrapper>\r\n              <Img src={stepone} alt={one}  className=\"merchant-img\" />\r\n              <Heading>{title1}</Heading>\r\n              <Subtitle>\r\n                <p className=\"description\">{description1}</p>\r\n              </Subtitle>\r\n            </TextWrapper>\r\n          </Column1>\r\n          <Column2>\r\n            <ImgWrap>\r\n              <Img src={steptwo} alt={two}  className=\"merchant-img\" />\r\n              <Heading>{title2}</Heading>\r\n              <Subtitle>\r\n                <p className=\"description\">{description2}</p>\r\n              </Subtitle>\r\n            </ImgWrap>\r\n          </Column2>\r\n          </InfoRow>\r\n      </Container>\r\n    </InfoContainer>\r\n</div>\r\n  );\r\n}\r\n\r\nexport default HomeSection3;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoContainer = styled.div`\r\n  padding: 90px 0;\r\n  background: #ffffff;\r\n  @media screen and (max-width: 768px) {\r\n    margin-top: -9rem;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    padding: 40px 0;\r\n    margin-top: -3.5rem;\r\n  }\r\n`;\r\n\r\nexport const Head = styled.h1`\r\n  display: flex;\r\n  text-align: start;\r\n  align-items: start;\r\n  color: #000000;\r\n  font-size: 32px;\r\n  font-weight: 500;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 22px;\r\n  }\r\n`;\r\n\r\nexport const SubHead = styled.h2`\r\n  display: flex;\r\n  text-align: start;\r\n  align-items: start;\r\n  color: rgba(0, 0, 0, 0.7);\r\n  font-weight: 400;\r\n  line-height: 16px;\r\n  font-size: 16px;\r\n`;\r\n\r\nexport const QrWrap = styled.div`\r\n  display: grid;\r\n`;\r\n\r\nexport const TitleWrap = styled.div`\r\n  display: flex;\r\n  justify-content: space-between;\r\n  margin-top: 50px;\r\n  margin-bottom: 22px;\r\n`;\r\n\r\nexport const Title = styled.div`\r\n  font-weight: 500;\r\n  line-height: 120%;\r\n  font-size: 20px;\r\n  color: #1a1a1a;\r\n  cursor: pointer;\r\n  &: hover {\r\n    color: #1a71ff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 18px;\r\n  }\r\n`;\r\n\r\nexport const Title2 = styled.div`\r\n  font-weight: 500;\r\n  line-height: 120%;\r\n  font-size: 20px;\r\n  color: #8c8c8c;\r\n  cursor: pointer;\r\n  padding-right: 420px;\r\n  &: hover {\r\n    color: #1a71ff;\r\n  }\r\n  @media screen and (max-width: 1290px) {\r\n    padding-right: 320px;\r\n  }\r\n  @media screen and (max-width: 1085px) {\r\n    padding-right: 220px;\r\n  }\r\n  @media screen and (max-width: 960px) {\r\n    padding-right: 0px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 18px;\r\n  }\r\n`;\r\n\r\nexport const Title3 = styled.div`\r\n  font-weight: 500;\r\n  line-height: 120%;\r\n  font-size: 20px;\r\n  color: #8c8c8c;\r\n  cursor: pointer;\r\n  &: hover {\r\n    color: #1a71ff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 18px;\r\n  }\r\n`;\r\n\r\nexport const Title4 = styled.div`\r\n  font-weight: 500;\r\n  line-height: 120%;\r\n  font-size: 20px;\r\n  color: #1a1a1a;\r\n  cursor: pointer;\r\n  padding-right: 420px;\r\n  &: hover {\r\n    color: #1a71ff;\r\n  }\r\n  @media screen and (max-width: 1290px) {\r\n    padding-right: 320px;\r\n  }\r\n  @media screen and (max-width: 1085px) {\r\n    padding-right: 220px;\r\n  }\r\n  @media screen and (max-width: 960px) {\r\n    padding-right: 0px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 18px;\r\n  }\r\n`;\r\n\r\nexport const LineWrap = styled.div`\r\n  background: #f8f8f8;\r\n  margin-bottom: 23px;\r\n`;\r\n\r\nexport const LineWrap2 = styled.div`\r\n  background: #1a71ff;\r\n  margin-bottom: 23px;\r\n`;\r\n\r\nexport const Line1 = styled.div`\r\n  background: #1a71ff;\r\n`;\r\n\r\nexport const Line2 = styled.div`\r\n  background: #f8f8f8;\r\n`;\r\n\r\nexport const Description = styled.div`\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  max-width: 100%;\r\n  margin-bottom: 49px;\r\n  color: rgba(0, 0, 0, 0.7);\r\n`;\r\n\r\nexport const SlideWrap = styled.div`\r\n  display: flex;\r\n  grid-template-columns: repeat(3, 1fr);\r\n  justify-content: space-between;\r\n`;\r\n\r\nexport const FirstSlide = styled.div`\r\n  display: grid;\r\n  @media screen and (max-width: 970px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  max-width: 600px;\r\n  margin-left: 22%;\r\n // margin-right: 12%;\r\n\r\n  }\r\n  @media screen and (max-width: 760px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 10%;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 5%;\r\n  max-width: 100%;\r\n\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 4%;\r\n  }\r\n`;\r\n\r\nexport const SecondSlide = styled.div`\r\n  display: grid;\r\n  @media screen and (max-width: 970px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  max-width: 600px;\r\n  margin-left: 22%;\r\n\r\n  }\r\n  @media screen and (max-width: 760px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 10%;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 5%;\r\n  max-width: 100%;\r\n\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 4%;\r\n  }\r\n`;\r\n\r\nexport const ThirdSlide = styled.div`\r\n  display: grid;\r\n  @media screen and (max-width: 970px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  max-width: 600px;\r\n  margin-left: 22%;\r\n  }\r\n  @media screen and (max-width: 760px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 10%;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 5%;\r\n  max-width: 100%;\r\n\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n  justify-content: center;\r\n  align-item: center;\r\n  margin-left: 4%;\r\n  }\r\n`;\r\n\r\nexport const Button = styled.div`\r\n  background: #e5efff;\r\n  border-radius: 4px;\r\n  width: 78px;\r\n  padding: 8px 16px 0px 16px;\r\n  margin-bottom: 16px;\r\n  @media screen and (max-width: 970px) {\r\n    padding: 8px 16px 0.017px 16px;\r\n  }\r\n`;\r\n\r\nexport const Step1 = styled.h3`\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  color: #003a99;\r\n`;\r\n\r\nexport const ContentOne = styled.p`\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  max-width: 293px;\r\n  color: rgba(0, 0, 0, 0.7);\r\n  margin-top: 23px;\r\n`;\r\n","import React, { useState, useEffect, useRef } from \"react\";\r\nimport { Container } from \"../../globalStyles\";\r\nimport { Carousel } from \"antd\";\r\nimport {\r\n  InfoContainer,\r\n  Head,\r\n  SubHead,\r\n  QrWrap,\r\n  Title,\r\n  TitleWrap,\r\n  Title2,\r\n  LineWrap,\r\n  Line1,\r\n  Line2,\r\n  Description,\r\n  SlideWrap,\r\n  FirstSlide,\r\n  SecondSlide,\r\n  ThirdSlide,\r\n  ContentOne,\r\n  Step1,\r\n  Button,\r\n  LineWrap2,\r\n  Title3,\r\n  Title4,\r\n} from \"./HomeSection4Elements\";\r\nimport \"./HomeSection4.css\";\r\nfunction HomeSection4({\r\n  step1,\r\n  step2,\r\n  step3,\r\n  content1,\r\n  content2,\r\n  content3,\r\n  content4,\r\n  content5,\r\n  content6,\r\n  title1,\r\n  title2,\r\n  headline,\r\n  description1,\r\n  description2,\r\n  subheadline,\r\n}) {\r\n  const ref = useRef();\r\n  const goTo = (slide) => {\r\n    ref.current.goTo(slide, false);\r\n  };\r\n\r\n  const [showQR, setShowQR] = useState(true);\r\n  const [showBank, setShowBank] = useState(false);\r\n  const [isFirst, setIsFirst] = useState(true);\r\n  const [isSecond, setIsSecond] = useState(false);\r\n  const [isThird, setIsThird] = useState(false);\r\n  const [matches, setMatches] = useState(\r\n    window.matchMedia(\"(max-width: 970px)\").matches\r\n  );\r\n\r\n  useEffect(() => {\r\n    window\r\n      .matchMedia(\"(max-width: 970px)\")\r\n      .addEventListener(\"change\", (e) => setMatches(e.matches));\r\n  }, []);\r\n\r\n  const switchQR = (event) => {\r\n    setShowQR(true);\r\n    setShowBank(false);\r\n  };\r\n\r\n  const switchBank = (event) => {\r\n    setShowQR(false);\r\n    setShowBank(true);\r\n  };\r\n\r\n  const onChange = (currentSlide) => {\r\n    if (currentSlide === 0) {\r\n      setIsFirst(true);\r\n      setIsSecond(false);\r\n      setIsThird(false);\r\n    } else if (currentSlide === 1) {\r\n      setIsFirst(false);\r\n      setIsSecond(true);\r\n      setIsThird(false);\r\n    } else if (currentSlide === 2) {\r\n      setIsFirst(false);\r\n      setIsSecond(false);\r\n      setIsThird(true);\r\n    }\r\n  };\r\n\r\n  const btnStyle = {\r\n    width: \"10px\",\r\n    height: \"10px\",\r\n    marginRight: \"16px\",\r\n    marginTop: \"20px\",\r\n    background: \"#1a71ff\",\r\n    border: \"none\",\r\n    borderRadius: \"50px\",\r\n  };\r\n\r\n  const actStyle = {\r\n    width: \"10px\",\r\n    height: \"10px\",\r\n    marginRight: \"16px\",\r\n    marginTop: \"20px\",\r\n    background: \"#f1f1f1\",\r\n    border: \"none\",\r\n    borderRadius: \"50px\",\r\n  };\r\n\r\n  return (\r\n    <div>\r\n      <InfoContainer>\r\n        <Container>\r\n          <Head>{headline}</Head>\r\n          <SubHead>{subheadline}</SubHead>\r\n          {matches ? (\r\n            <>\r\n              {showQR && (\r\n                <>\r\n                  <TitleWrap>\r\n                    <Title onClick={switchQR}>{title1}</Title>\r\n                    <Title2 onClick={switchBank}>{title2}</Title2>\r\n                  </TitleWrap>\r\n                  <LineWrap>\r\n                    <Line1 style={{ height: \"8px\", width: \"50%\" }} />\r\n                  </LineWrap>\r\n                  <Description>{description1}</Description>\r\n                  <Carousel\r\n                    ref={ref}\r\n                    afterChange={onChange}\r\n                    effect=\"fade\"\r\n                    dots={false}\r\n                  >\r\n                    <FirstSlide>\r\n                      <Button>\r\n                        <Step1>{step1}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/scan_1.png?alt=media&token=6413c7f6-1547-4fb9-833d-0b1a739e36e0\" alt=\"scan-Pay\" width=\"90%\" height=\"auto\"/>\r\n                      <ContentOne>{content1}</ContentOne>\r\n                    </FirstSlide>\r\n                    <SecondSlide>\r\n                      <Button>\r\n                        <Step1>{step2}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/scan_2.png?alt=media&token=58a69fd7-0134-4238-970f-5aea7da0c9bd\" alt=\"scan-Pay\" width=\"90%\" height=\"auto\" />\r\n\r\n                      <ContentOne>{content2}</ContentOne>\r\n                    </SecondSlide>\r\n                    <ThirdSlide>\r\n                      <Button>\r\n                        <Step1>{step3}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/scan_3.png?alt=media&token=e84bd0df-79b5-4ec0-ae71-343ce1cc12ab\" alt=\"scan-Pay\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content3}</ContentOne>\r\n                    </ThirdSlide>\r\n                  </Carousel>\r\n                  <div\r\n                    style={{\r\n                      display: \"flex\",\r\n                      justifyContent: \"center\",\r\n                      alignItems: \"center\",\r\n                    }}\r\n                  >\r\n                    <button\r\n                      onClick={() => goTo(0)}\r\n                      style={isFirst ? btnStyle : actStyle}\r\n                    />\r\n                    <button\r\n                      onClick={() => goTo(1)}\r\n                      style={isSecond ? btnStyle : actStyle}\r\n                    />\r\n                    <button\r\n                      onClick={() => goTo(2)}\r\n                      style={isThird ? btnStyle : actStyle}\r\n                    />\r\n                  </div>\r\n                </>\r\n              )}\r\n\r\n              {showBank && (\r\n                <>\r\n                  <TitleWrap>\r\n                    <Title3 onClick={switchQR}>{title1}</Title3>\r\n                    <Title4 onClick={switchBank}>{title2}</Title4>\r\n                  </TitleWrap>\r\n                  <LineWrap2>\r\n                    <Line2 style={{ height: \"8px\", width: \"50%\" }} />\r\n                  </LineWrap2>\r\n                  <Description>{description2}</Description>\r\n                  <Carousel\r\n                    ref={ref}\r\n                    afterChange={onChange}\r\n                    effect=\"fade\"\r\n                    dots={false}\r\n                  >\r\n                    <FirstSlide>\r\n                      <Button>\r\n                        <Step1>{step1}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/trans_1.png?alt=media&token=a826b3f4-cd8c-40ee-a472-b7c7678519d8\" alt=\"transfer\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content4}</ContentOne>\r\n                    </FirstSlide>\r\n                    <SecondSlide>\r\n                      <Button>\r\n                        <Step1>{step2}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/trans_2.png?alt=media&token=409acee8-651c-4995-b69a-ba29945f8900\" alt=\"transfer\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content5}</ContentOne>\r\n                    </SecondSlide>\r\n                    <ThirdSlide>\r\n                      <Button>\r\n                        <Step1>{step3}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/trans_3.png?alt=media&token=6667426c-6b6f-4995-bfd5-4e738f19f9a3\" alt=\"transfer\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content6}</ContentOne>\r\n                    </ThirdSlide>\r\n                  </Carousel>\r\n                  <div\r\n                    style={{\r\n                      display: \"flex\",\r\n                      justifyContent: \"center\",\r\n                      alignItems: \"center\",\r\n                    }}\r\n                  >\r\n                    <button\r\n                      onClick={() => goTo(0)}\r\n                      style={isFirst ? btnStyle : actStyle}\r\n                    />\r\n                    <button\r\n                      onClick={() => goTo(1)}\r\n                      style={isSecond ? btnStyle : actStyle}\r\n                    />\r\n                    <button\r\n                      onClick={() => goTo(2)}\r\n                      style={isThird ? btnStyle : actStyle}\r\n                    />\r\n                  </div>\r\n                </>\r\n              )}\r\n            </>\r\n          ) : (\r\n            <>\r\n              {showQR && (\r\n                <QrWrap>\r\n                  <TitleWrap>\r\n                    <Title onClick={switchQR}>{title1}</Title>\r\n                    <Title2 onClick={switchBank}>{title2}</Title2>\r\n                  </TitleWrap>\r\n                  <LineWrap>\r\n                    <Line1 style={{ height: \"8px\", width: \"50%\" }} />\r\n                  </LineWrap>\r\n                  <Description>{description1}</Description>\r\n                  <SlideWrap>\r\n                    <FirstSlide>\r\n                      <Button>\r\n                        <Step1>{step1}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/scan_1.png?alt=media&token=6413c7f6-1547-4fb9-833d-0b1a739e36e0\" alt=\"scan-Pay\" width=\"90%\" height=\"auto\"/>\r\n                      <ContentOne>{content1}</ContentOne>\r\n                    </FirstSlide>\r\n                    <SecondSlide>\r\n                      <Button>\r\n                        <Step1>{step2}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/scan_2.png?alt=media&token=58a69fd7-0134-4238-970f-5aea7da0c9bd\" alt=\"scan-Pay\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content2}</ContentOne>\r\n                    </SecondSlide>\r\n                    <ThirdSlide>\r\n                      <Button>\r\n                        <Step1>{step3}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/scan_3.png?alt=media&token=e84bd0df-79b5-4ec0-ae71-343ce1cc12ab\" alt=\"scan-Pay\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content3}</ContentOne>\r\n                    </ThirdSlide>\r\n                  </SlideWrap>\r\n                </QrWrap>\r\n              )}\r\n\r\n              {showBank && (\r\n                <QrWrap>\r\n                  <TitleWrap>\r\n                    <Title3 onClick={switchQR}>{title1}</Title3>\r\n                    <Title4 onClick={switchBank}>{title2}</Title4>\r\n                  </TitleWrap>\r\n                  <LineWrap2>\r\n                    <Line2 style={{ height: \"8px\", width: \"50%\" }} />\r\n                  </LineWrap2>\r\n                  <Description>{description2}</Description>\r\n                  <SlideWrap>\r\n                    <FirstSlide>\r\n                      <Button>\r\n                        <Step1>{step1}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/trans_1.png?alt=media&token=a826b3f4-cd8c-40ee-a472-b7c7678519d8\" alt=\"transfer\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content4}</ContentOne>\r\n                    </FirstSlide>\r\n                    <SecondSlide>\r\n                      <Button>\r\n                        <Step1>{step2}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/trans_2.png?alt=media&token=409acee8-651c-4995-b69a-ba29945f8900\" alt=\"transfer\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content5}</ContentOne>\r\n                    </SecondSlide>\r\n                    <ThirdSlide>\r\n                      <Button>\r\n                        <Step1>{step3}</Step1>\r\n                      </Button>\r\n                      <img src=\"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/trans_3.png?alt=media&token=6667426c-6b6f-4995-bfd5-4e738f19f9a3\" alt=\"transfer\" width=\"90%\" height=\"auto\" />\r\n                      <ContentOne>{content6}</ContentOne>\r\n                    </ThirdSlide>\r\n                  </SlideWrap>\r\n                </QrWrap>\r\n              )}\r\n            </>\r\n          )}\r\n        </Container>\r\n      </InfoContainer>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default HomeSection4;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoContainer = styled.div`\r\n  background: #ffffff;\r\n  padding: 120px 0px;\r\n  @media screen and (max-width: 480px) {\r\n    padding: 40px 0;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: grid;\r\n  grid-auto-columns: minmax(auto, 1fr);\r\n  align-items: center;\r\n  grid-template-areas: \"col1 col2\";\r\n  @media screen and (max-width: 960px) {\r\n    grid-template-areas: \"col1\" \"col2\";\r\n  }\r\n`;\r\n\r\nexport const Column1 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col1;\r\n`;\r\n\r\nexport const Column2 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col2;\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 540px;\r\n  padding-top: 0;\r\n  padding-bottom: 60px;\r\n  z-index: 1;\r\n  padding-left: 50px;\r\n  @media screen and (max-width: 960px) {\r\n  padding-left: 0px;\r\n    \r\n  }\r\n`;\r\n\r\nexport const TopLine = styled.p`\r\n  color: #000;\r\n  font-size: 24px;\r\n  font-weight: 700;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nexport const Heading = styled.h1`\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  font-weight: 400;\r\n  color: rgba(0, 0, 0, 0.7);\r\n  margin-bottom: 35px;\r\n`;\r\n\r\nexport const Subtitle = styled.p`\r\n  color: #000;\r\n  font-size: 18px;\r\n  font-weight: 600;\r\n  line-height: 24px;\r\n  margin-bottom: 16px;\r\n  max-width: 440px;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 32px;\r\n  }\r\n`;\r\n\r\nexport const BtnWrap = styled.div`\r\n  display: flex;\r\n  justify-content: flex-start;\r\n  padding-top: 15px;\r\n  @media screen and (max-width: 395px) {\r\n    display: grid;\r\n  }\r\n`;\r\n\r\nexport const BtnWrap2 = styled.div`\r\n  display: flex;\r\n  justify-content: flex-start;\r\n  padding-top: 28px;\r\n  @media screen and (max-width: 500px) {\r\n    padding-top: 18px;\r\n  }\r\n  @media screen and (max-width: 395px) {\r\n    display: grid;\r\n  }\r\n`;\r\n\r\nexport const Flex = styled.div`\r\n    display: flex;\r\n  @media screen and (max-width: 375px) {\r\n    display: flex;\r\n  }\r\n`;\r\n\r\nexport const Flex2 = styled.div`\r\n    display: flex;\r\n  @media screen and (max-width: 375px) {\r\n    display: flex;\r\n    padding-top: 20px;\r\n  }\r\n`;\r\n\r\nexport const WebApp = styled.div`\r\n  align-items: center;\r\n  display: flex;\r\n  justify-content: center;\r\n  padding-right: 8px;\r\n  color: #000;\r\n  @media screen and (max-width: 375px) {\r\n    padding-right: 2px;\r\n  }\r\n`;\r\n\r\nexport const ImgWrap = styled.div`\r\n  max-width: 600px;\r\n  height: 100%;\r\n  margin-top: -40px;\r\n  @media screen and (max-width: 280px) {\r\n    padding-right: 0px;\r\n    margin-left: -20px;\r\n  }\r\n`;\r\n\r\nexport const FreeImg = styled.div`\r\n  padding-right: 43px;\r\n  @media screen and (max-width: 480px) {\r\n    padding-right: 8px;\r\n  }\r\n`;\r\n\r\nexport const FreeImg2 = styled.div`\r\n  columns: #fff;\r\n`;\r\n\r\nexport const FreeImg3 = styled.div`\r\n  padding-right: 52px;\r\n  @media screen and (max-width: 480px) {\r\n    padding-right: 8px;\r\n  }\r\n`;\r\n\r\nexport const RightImg = styled.div`\r\n  display: flex;\r\n  @media screen and (max-width: 1200px) {\r\n    display: grid;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n`;\r\n\r\nexport const Img1 = styled.span`\r\n  padding-top: 0px;\r\n`;\r\n\r\nexport const Img2 = styled.span`\r\n  padding-top: 0px;\r\n  padding-left: 24px;\r\n  @media screen and (max-width: 1200px) {\r\n    padding-left: 0px;\r\n  padding-top: 16px;\r\n  display: grid;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n`;\r\n\r\nexport const Img3 = styled.span`\r\n  padding-top: 16px;\r\n  padding-right: 24px;\r\n  @media screen and (max-width: 1200px) {\r\n  padding-right: 0px;\r\n    display: grid;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n`;\r\n\r\nexport const Img4 = styled.span`\r\n  padding-top: 16px;\r\n  @media screen and (max-width: 1200px) {\r\n    padding-left: 0px;\r\n    display: grid;\r\n    align-items: center;\r\n    justify-content: center;\r\n}\r\n`;\r\n","import React from \"react\";\r\nimport { Container, Button3 } from \"../../globalStyles\";\r\nimport { Link } from \"react-router-dom\";\r\nimport {\r\n  InfoContainer,\r\n  Img1,\r\n  Img2,\r\n  Img3,\r\n  Img4,\r\n  InfoRow,\r\n  Column1,\r\n  Column2,\r\n  TextWrapper,\r\n  ImgWrap,\r\n  TopLine,\r\n  Heading,\r\n  Subtitle,\r\n  BtnWrap,\r\n  RightImg,\r\n  WebApp,\r\n  Flex,\r\n  Flex2,\r\n  FreeImg,\r\n  FreeImg2,\r\n  BtnWrap2,\r\n  FreeImg3,\r\n} from \"./HomeSection5Elements\";\r\n\r\nconst linkStyle = {\r\n  textDecoration: \"none\",\r\n};\r\n\r\nfunction HomeSection5({\r\n  headline,\r\n  description,\r\n  description2,\r\n  headline2,\r\n  buttonLabel,\r\n  merchant,\r\n  webApp,\r\n  img1,\r\n  img2,\r\n  img3,\r\n  bank,\r\n  qr,\r\n  img4,\r\n  img11,\r\n  img12,\r\n  alt11,\r\n  img13,\r\n  alt1,\r\n  alt2,\r\n  alt3,\r\n  alt4,\r\n}) {\r\n  return (\r\n    <div>\r\n      <InfoContainer>\r\n        <Container>\r\n          <InfoRow>\r\n            <Column1>\r\n              <TextWrapper>\r\n                <TopLine>{headline}</TopLine>\r\n                <Heading>{description}</Heading>\r\n                <Subtitle>\r\n                  <Link to=\"/pricing\" style={linkStyle}>\r\n                    <Button3>{buttonLabel}</Button3>\r\n                  </Link>\r\n                </Subtitle>\r\n                <BtnWrap>\r\n                  <Flex>\r\n                   <WebApp>\r\n                    {webApp}\r\n                   </WebApp>\r\n                  <FreeImg3>\r\n                      <img src={img11} alt={alt11} />\r\n                    </FreeImg3>\r\n                    </Flex>\r\n                    <Flex2>\r\n                  <WebApp>\r\n                    {qr}\r\n                  </WebApp>\r\n                  <FreeImg2>\r\n                      <img src={img12} alt={alt11} />\r\n                    </FreeImg2>\r\n                    </Flex2>\r\n                </BtnWrap>\r\n                <BtnWrap2>\r\n                  <Flex>\r\n                   <WebApp>\r\n                    {merchant}\r\n                   </WebApp>\r\n                  <FreeImg>\r\n                      <img src={img11} alt={alt11} />\r\n                    </FreeImg>\r\n                    </Flex>\r\n                    <Flex2>\r\n                  <WebApp>\r\n                    {bank}\r\n                  </WebApp>\r\n                  <FreeImg2>\r\n                      <img src={img13} alt={alt11} />\r\n                    </FreeImg2>\r\n                    </Flex2>\r\n                </BtnWrap2>\r\n              </TextWrapper>\r\n            </Column1>\r\n            <Column2>\r\n              <ImgWrap>\r\n                <TopLine>{headline2}</TopLine>\r\n                <Heading>{description2}</Heading>\r\n                <Subtitle>\r\n                  <RightImg>\r\n                    <Img1>\r\n                      <img src={img1} alt={alt1} />\r\n                    </Img1>\r\n                    <Img2>\r\n                      <img src={img2} alt={alt2} />\r\n                    </Img2>\r\n                  </RightImg>\r\n                  <RightImg>\r\n                    <Img3>\r\n                      <img src={img3} alt={alt3} />\r\n                    </Img3>\r\n                    <Img4>\r\n                      <img src={img4} alt={alt4} />\r\n                    </Img4>\r\n                  </RightImg>\r\n                </Subtitle>\r\n              </ImgWrap>\r\n            </Column2>\r\n          </InfoRow>\r\n        </Container>\r\n      </InfoContainer>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default HomeSection5;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoContainer = styled.div`\r\n  background: #fafafa;\r\n  padding: 60px 0px;\r\n  align-content: center;\r\n  @media screen and (max-width: 480px) {\r\n    padding: 45px 0;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: grid;\r\n  grid-auto-columns: minmax(auto, 1fr);\r\n  align-items: center;\r\n  grid-template-areas: \"col1 col2\";\r\n  @media screen and (max-width: 960px) {\r\n    grid-template-areas: \"col1\" \"col2\";\r\n  }\r\n`;\r\n\r\nexport const Column1 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col1;\r\n`;\r\n\r\nexport const Column2 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col2;\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 540px;\r\n  padding-top: 0;\r\n  padding-bottom: 60px;\r\n  z-index: 1;\r\n  padding-left: 50px;\r\n  @media screen and (max-width: 960px) {\r\n  padding-left: 0px;\r\n  }\r\n`;\r\n\r\nexport const TopLine = styled.p`\r\n  font-size: 24px;\r\n  line-height: 29.05px;\r\n  font-weight: 700;\r\n  color: #000000;\r\n  margin-bottom: 16px;\r\n`;\r\n\r\nexport const Heading = styled.p`\r\n  color: #333333;\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  margin-bottom: 20px;\r\n`;\r\n\r\nexport const MssgWrap = styled.span`\r\n display: flex;\r\n max-width: 360px;\r\n`;\r\n\r\nexport const PciWrap = styled.span`\r\n display: flex;\r\n max-width: 360px;\r\n margin-top: 34px;\r\n`;\r\n\r\nexport const Heading2 = styled.span`\r\n  color: #333333;\r\n  font-size: 16px;\r\n  font-weight: 700;\r\n  line-height: 24px;\r\n`;\r\n\r\nexport const Subtitle = styled.span`\r\n  color: #333333;\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  padding-left: 5px;\r\n  font-weight: 400;\r\n`;\r\n\r\nexport const BtnWrap = styled.div`\r\n  display: flex;\r\n  justify-content: flex-start;\r\n`;\r\n\r\nexport const ImgWrap = styled.div`\r\n  max-width: 555px;\r\n  height: 100%;\r\n`;\r\n\r\nexport const LockImg = styled.img`\r\n  transition: 1s ease;\r\n  /* &:hover {\r\n    -webkit-transform: rotateZ(-20deg);\r\n    -ms-transform: rotateZ(-20deg);\r\n    transform: rotateZ(-20deg);\r\n    transition: 1s ease;\r\n  } */\r\n  @media screen and (max-width: 78px) {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    width: 100%;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    display: flex;\r\n    width: 70%;\r\n    justify-content: center;\r\n    align-items: center;\r\n    padding-left: 90px;\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { Container } from \"../../globalStyles\";\r\n\r\nimport {\r\n  InfoContainer,\r\n  InfoRow,\r\n  Column1,\r\n  Column2,\r\n  TextWrapper,\r\n  ImgWrap,\r\n  TopLine,\r\n  Heading,\r\n  Heading2,\r\n  Subtitle,\r\n  LockImg,\r\n  MssgWrap,\r\n  PciWrap,\r\n} from \"./HomeSection6Elements\";\r\n\r\nfunction HomeSection6({\r\n  subHead,\r\n  subHead2,\r\n  headline,\r\n  description,\r\n  description3,\r\n  img,\r\n  alt,\r\n  description2,\r\n}) {\r\n  return (\r\n    <div>\r\n      <InfoContainer>\r\n        <Container>\r\n          <InfoRow>\r\n            <Column1>\r\n              <TextWrapper>\r\n                <LockImg src={img} alt={alt} width=\"60%\" height=\"auto\" />\r\n              </TextWrapper>\r\n            </Column1>\r\n            <Column2>\r\n              <ImgWrap>\r\n                <TopLine>{headline}</TopLine>\r\n                <Heading>{description}</Heading>\r\n                <MssgWrap>\r\n                <Heading2>{subHead}<Subtitle>{description2}</Subtitle></Heading2>\r\n                </MssgWrap>\r\n                <PciWrap>\r\n                <Heading2>{subHead2}<Subtitle>{description3}</Subtitle></Heading2>\r\n                </PciWrap>\r\n              </ImgWrap>\r\n            </Column2>\r\n          </InfoRow>\r\n        </Container>\r\n      </InfoContainer>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default HomeSection6;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoContainer = styled.div`\r\n  background: #ffffff;\r\n  padding: 100px 0px;     \r\n  @media screen and (max-width: 480px) {\r\n    padding: 60px 0;\r\n  }\r\n`;\r\n\r\nexport const PartnersWrap = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  padding-top: 62px;\r\n  padding-left: 24px;\r\n  padding-right: 24px;\r\n  @media screen and (max-width: 1200px) {\r\n    display: flex;\r\n    flex-wrap: wrap;\r\n  }\r\n\r\n  @media screen and (max-width: 768px) {\r\n    display: grid;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const Partners = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  color: #000000;\r\n  font-style: bold;\r\n  line-height: 47px;\r\n  font-size: 35px;\r\n  font-weight: 700;\r\n\r\n  @media screen and (max-width: 480px) {\r\n    align-items: flex-start;\r\n  }\r\n`;\r\n\r\nexport const Values = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  color: #000000;\r\n  font-weight: 400;\r\n  font-size: 16px;\r\n  line-height: 24px;\r\n  padding-left: 24px;\r\n  padding-right: 24px;\r\n  padding-top: 10px;\r\n  @media screen and (max-width: 480px) {\r\n    padding-left: 30px;\r\n    padding-right: 30px;\r\n  }\r\n`;\r\n\r\nexport const PartnerImg = styled.img`\r\n  margin-left: -0px;\r\n  @media screen and (max-width: 768px) {\r\n    padding-bottom: 40px;\r\n    padding-left: 0px;\r\n    padding-right: 0px;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n`;\r\n\r\nexport const PartnerImg2 = styled.img`\r\n  padding-left: 72px;\r\n  @media screen and (max-width: 768px) {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    padding-left: 0px;\r\n  }\r\n`;\r\n\r\nexport const PartnerImg3 = styled.img`\r\n  padding-left: 72px;\r\n  padding-right: 72px;\r\n  @media screen and (max-width: 768px) {\r\n    padding-top: 40px;\r\n    padding-left: 0px;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n`;\r\n\r\nexport const PartnerImg4 = styled.img`\r\n  padding-right: 72px;\r\n\r\n  @media screen and (max-width: 768px) {\r\n    padding-top: 40px;\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n    padding-bottom: 40px;\r\n  }\r\n`;\r\n\r\nexport const PartnerImg5 = styled.img`\r\n  @media screen and (max-width: 768px) {\r\n    display: flex;\r\n    justify-content: center;\r\n    align-items: center;\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport {\r\n  InfoContainer,\r\n  Partners,\r\n  Values,\r\n  PartnersWrap,\r\n  PartnerImg,\r\n  PartnerImg2,\r\n  PartnerImg3,\r\n} from \"./HomeSection7Elements\";\r\nimport { Container } from \"../../globalStyles\";\r\n\r\nfunction HomeSection7({\r\n  headline2,\r\n  paythru,\r\n  genesys,\r\n  tence,\r\n  headline,\r\n  alt,\r\n  alt2,\r\n  alt4,\r\n}) {\r\n  return (\r\n    <div>\r\n      <InfoContainer>\r\n        <Partners>{headline}</Partners>\r\n        <Values>{headline2}</Values>\r\n        <Container>\r\n          <PartnersWrap>\r\n            <PartnerImg src={paythru} alt={alt2} />\r\n            <PartnerImg2 src={genesys} alt={alt} />\r\n            <PartnerImg3 src={tence} alt={alt4} />\r\n          </PartnersWrap>\r\n        </Container>\r\n      </InfoContainer>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default HomeSection7;\r\n","import styled from \"styled-components\";\r\n\r\nexport const InfoContainer = styled.div`\r\n  padding: 90px 0;\r\n  background: #ffffff;\r\n  @media screen and (max-width: 768px) {\r\n    margin-top: -9rem;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    padding: 40px 0;\r\n    margin-top: 0rem;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: flex;\r\n  margin: 0 -15px -15px -15px;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  position: relative;\r\n  flex-direction: ${({ imgStart }) => (imgStart ? \"row-reverse\" : \"row\")};\r\n`;\r\n\r\nexport const InfoColumn = styled.div`\r\n  margin-top: 39px;\r\n  margin-bottom: 15px;\r\n  padding-right: 15px;\r\n  padding-left: 15px;\r\n  flex: 1;\r\n  max-width: 50%;\r\n  flex-basis: 50%;\r\n  @media screen and (max-width: 768px) {\r\n    max-width: 100%;\r\n    flex-basis: 100%;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const InfoColumnR = styled.div`\r\n  margin-top: 39px;\r\n  margin-bottom: 15px;\r\n  padding-right: 15px;\r\n  padding-left: 15px;\r\n  flex: 1;\r\n  max-width: 50%;\r\n  flex-basis: 50%;\r\n  @media screen and (max-width: 768px) {\r\n    max-width: 100%;\r\n    flex-basis: 100%;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 540px;\r\n  padding-top: 0;\r\n  padding-bottom: 60px;\r\n  @media screen and (max-width: 768px) {\r\n    padding-bottom: 65px;\r\n  }\r\n`;\r\n\r\nexport const ImgWrapper = styled.div`\r\n  max-width: 600px;\r\n  display: flex;\r\n  justify-content: ${({ start }) => (start ? \"flex-start\" : \"flex-end\")};\r\n  @media screen and (max-width: 480px) {\r\n    margin-top: -3rem;\r\n  }\r\n`;\r\n\r\nexport const Head = styled.h1`\r\n  display: flex;\r\n  text-align: start;\r\n  align-items: start;\r\n  color: #0d0d0d;\r\n  font-size: 32px;\r\n  font-weight: 700;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 22px;\r\n  }\r\n`;\r\n\r\nexport const SubHead = styled.h2`\r\n  display: flex;\r\n  text-align: start;\r\n  align-items: start;\r\n  color: rgba(0, 0, 0, 0.8);\r\n  font-weight: 400;\r\n  line-height: 160%;\r\n  font-size: 18px;\r\n  max-width: 595px;\r\n`;\r\n\r\nexport const Img = styled.img`\r\n  position: relative;\r\n  object-fit: cover;\r\n  width: 100%;\r\n  max-width: 100%;\r\n  height: auto;\r\n  @media screen and (max-width: 970px) {\r\n    margin-top: 30px;\r\n    margin-bottom: 30px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    margin-top: 20px;\r\n    margin-bottom: 15px;\r\n  }\r\n`;\r\n\r\nexport const First = styled.div`\r\n  border-left: 6px solid #1a71ff;\r\n  height: 100%;\r\n  padding-left: 42px;\r\n`;\r\n\r\nexport const Second = styled.div`\r\n  border-left: 6px solid white;\r\n  height: 100%;\r\n  padding-left: 42px;\r\n`;\r\n\r\nexport const Title = styled.div`\r\n  font-weight: 500;\r\n  line-height: 120%;\r\n  font-size: 20px;\r\n  color: #000000;\r\n  margin-bottom: 16px;\r\n  cursor: pointer;\r\n  @media screen and (max-width: 970px) {\r\n    margin-top: 16px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 18px;\r\n  margin-bottom: 10px;\r\n  }\r\n`;\r\n\r\nexport const LineBorder = styled.div`\r\n  position: relative;\r\n`;\r\n\r\nexport const LineWrap = styled.div`\r\n  transform: rotate(90deg);\r\n  background: #f8f8f8;\r\n  border-radius: 16px;\r\n`;\r\n\r\nexport const Line1 = styled.div`\r\n  background: #1a71ff;\r\n`;\r\n\r\nexport const Description = styled.div`\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  max-width: 432px;\r\n  margin-bottom: 100px;\r\n  color: rgba(0, 0, 0, 0.7);\r\n  @media screen and (max-width: 970px) {\r\n    margin-top: 5px;\r\n    margin-bottom: 0;\r\n  }\r\n  @media screen and (max-width: 500px) {\r\n    max-width: 100%;\r\n    margin-top: 5px;\r\n  }\r\n`;\r\n\r\nexport const DescriptionL = styled.div`\r\n  font-weight: 400;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  max-width: 432px;\r\n  color: rgba(0, 0, 0, 0.7);\r\n  @media screen and (max-width: 970px) {\r\n    margin-top: 16px;\r\n    margin-bottom: 0;\r\n  }\r\n  @media screen and (max-width: 500px) {\r\n    max-width: 80%;\r\n  }\r\n`;\r\n\r\nexport const InfoRow2 = styled.div`\r\n  display: grid;\r\n  grid-auto-columns: minmax(auto, 1fr);\r\n  align-items: center;\r\n  grid-template-areas: \"col1 col2 col3\";\r\n  @media screen and (max-width: 970px) {\r\n    grid-template-areas: \"col1\" \"col2\" \"col3\";\r\n  }\r\n`;\r\n\r\nexport const Column1 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col1;\r\n`;\r\n\r\nexport const Column2 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col2;\r\n`;\r\n\r\nexport const Column3 = styled.div`\r\n  margin-bottom: 15px;\r\n  padding: 0 15px;\r\n  grid-area: col3;\r\n`;\r\n\r\nexport const FirstSlide = styled.div`\r\n  display: grid;\r\n  @media screen and (max-width: 970px) {\r\n    justify-content: center;\r\n    align-item: center;\r\n  }\r\n`;\r\n\r\nexport const SecondSlide = styled.div`\r\n  display: grid;\r\n  @media screen and (max-width: 970px) {\r\n    justify-content: center;\r\n    align-item: center;\r\n  }\r\n`;\r\n\r\nexport const ThirdSlide = styled.div`\r\n  display: grid;\r\n  @media screen and (max-width: 970px) {\r\n    justify-content: center;\r\n    align-item: center;\r\n  }\r\n`;\r\n","import React, { useState, useEffect } from \"react\";\r\nimport { Container } from \"../../globalStyles\";\r\nimport {\r\n  InfoContainer,\r\n  Head,\r\n  SubHead,\r\n  Title,\r\n  // LineWrap,\r\n  // Line1,\r\n  Description,\r\n  InfoRow2,\r\n  Column1,\r\n  Column2,\r\n  Column3,\r\n  FirstSlide,\r\n  SecondSlide,\r\n  ThirdSlide,\r\n  InfoRow,\r\n  InfoColumn,\r\n  InfoColumnR,\r\n  TextWrapper,\r\n  ImgWrapper,\r\n  DescriptionL,\r\n  Img,\r\n  //LineBorder,\r\n  First,\r\n  Second,\r\n} from \"./HomeSectionNewElements\";\r\nimport \"./HomeSectionNew.css\";\r\n\r\nfunction HomeSectionNew({\r\n  title1,\r\n  title2,\r\n  title3,\r\n  headline,\r\n  description1,\r\n  description2,\r\n  description3,\r\n  subheadline,\r\n  imgStart,\r\n  start,\r\n}) {\r\n\r\n  const [firstImg, setFirstImg] = useState(true);\r\n  const [secondImg, setSecondImg] = useState(false);\r\n  const [thirdImg, setThirdImg] = useState(false);\r\n  const [matches, setMatches] = useState(\r\n    window.matchMedia(\"(max-width: 970px)\").matches\r\n  );\r\n\r\n  useEffect(() => {\r\n    window\r\n      .matchMedia(\"(max-width: 970px)\")\r\n      .addEventListener(\"change\", (e) => setMatches(e.matches));\r\n  }, []);\r\n\r\n  const switchFirstImg = (event) => {\r\n    setFirstImg(true);\r\n    setSecondImg(false);\r\n    setThirdImg(false);\r\n  };\r\n\r\n  const switchSecondImg = (event) => {\r\n    setFirstImg(false);\r\n    setSecondImg(true);\r\n    setThirdImg(false);\r\n  };\r\n\r\n  const switchThirdImg = (event) => {\r\n    setFirstImg(false);\r\n    setSecondImg(false);\r\n    setThirdImg(true);\r\n  };\r\n\r\n  return (\r\n    <div>\r\n      <InfoContainer>\r\n        <Container>\r\n          <Head>{headline}</Head>\r\n          <SubHead>{subheadline}</SubHead>\r\n          {matches ? (\r\n            <>\r\n              <InfoRow2>\r\n                <Column1>\r\n                  <FirstSlide>\r\n                    <Img src=\"images/frame1.svg\" alt=\"frame1\" />\r\n                    <Title>{title1}</Title>\r\n                    <Description>{description1}</Description>\r\n                  </FirstSlide>\r\n                </Column1>\r\n                <Column2>\r\n                  <SecondSlide>\r\n                    <Img src=\"images/frame2.svg\" alt=\"frame2\" width=\"70%\" />\r\n                    <Title>{title2}</Title>\r\n                    <Description>{description2}</Description>\r\n                  </SecondSlide>\r\n                </Column2>\r\n                <Column3>\r\n                  <ThirdSlide>\r\n                    <Img src=\"images/frame3.png\" alt=\"frame3\" width=\"70%\" />\r\n                    <Title>{title3}</Title>\r\n                    <Description>{description3}</Description>\r\n                  </ThirdSlide>\r\n                </Column3>\r\n              </InfoRow2>\r\n            </>\r\n          ) : (\r\n            <>\r\n              <InfoRow imgStart={imgStart}>\r\n                <InfoColumnR>\r\n                  {/* <LineBorder>\r\n                 <LineWrap>\r\n                        <Line1\r\n                          style={{\r\n                            height: \"8px\",\r\n                            width: \"33%\",\r\n                            borderRadius: \"16px\",\r\n                          }}\r\n                        />\r\n\r\n                      </LineWrap>\r\n                 </LineBorder> */}\r\n                  <TextWrapper>\r\n                    {firstImg && (\r\n                      <>\r\n                        <First>\r\n                          <Title onClick={switchFirstImg}>{title1}</Title>\r\n                          <Description>{description1}</Description>\r\n                        </First>\r\n                        <Second>\r\n                          <Title onClick={switchSecondImg}>{title2}</Title>\r\n                          <Description>{description2}</Description>\r\n                        </Second>\r\n                        <Second>\r\n                          <Title onClick={switchThirdImg}>{title3}</Title>\r\n                          <DescriptionL>{description3}</DescriptionL>\r\n                        </Second>\r\n                      </>\r\n                    )}\r\n                    {secondImg && (\r\n                      <>\r\n                        <Second>\r\n                          <Title onClick={switchFirstImg}>{title1}</Title>\r\n                          <Description>{description1}</Description>\r\n                        </Second>\r\n                        <First>\r\n                          <Title onClick={switchSecondImg}>{title2}</Title>\r\n                          <Description>{description2}</Description>\r\n                        </First>\r\n                        <Second>\r\n                          <Title onClick={switchThirdImg}>{title3}</Title>\r\n                          <DescriptionL>{description3}</DescriptionL>\r\n                        </Second>\r\n                      </>\r\n                    )}\r\n                    {thirdImg && (\r\n                      <>\r\n                        <Second>\r\n                          <Title onClick={switchFirstImg}>{title1}</Title>\r\n                          <Description>{description1}</Description>\r\n                        </Second>\r\n                        <Second>\r\n                          <Title onClick={switchSecondImg}>{title2}</Title>\r\n                          <Description>{description2}</Description>\r\n                        </Second>\r\n                        <First>\r\n                          <Title onClick={switchThirdImg}>{title3}</Title>\r\n                          <DescriptionL>{description3}</DescriptionL>\r\n                        </First>\r\n                      </>\r\n                    )}\r\n                  </TextWrapper>\r\n                </InfoColumnR>\r\n                <InfoColumn>\r\n                  <ImgWrapper start={start}>\r\n                    {firstImg && <img src=\"images/frame1.svg\" alt=\"frame1\" />}\r\n                    {secondImg && <img src=\"images/frame2.svg\" alt=\"frame2\" />}\r\n                    {thirdImg && <img src=\"images/frame3.png\" alt=\"frame3\" />}\r\n                  </ImgWrapper>\r\n                </InfoColumn>\r\n              </InfoRow>\r\n            </>\r\n          )}\r\n        </Container>\r\n      </InfoContainer>\r\n    </div>\r\n  );\r\n}\r\n\r\nexport default HomeSectionNew;\r\n","export const homeObjOne = {\r\n  lightBg: true,\r\n  topLine: \"\",\r\n  headline: \"Fast and Modern Payment Collections For your Business.\",\r\n  description:\r\n    \"A suite of modern tools to manage and grow your business. Accept in-store or in-person payments faster using bank transfer or QR code.\",\r\n  buttonLabel: \"Create free account\",\r\n  buttonLabel2: \"Get Android App\",\r\n  buttonLabel3: \"Get on iOS\",\r\n  imgStart: \"\",\r\n  imgHome: \"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/Frame%20159%20(5).png?alt=media&token=e59532a6-78f2-4ed8-aaf4-05f43002ac25\",\r\n  alt: \"homeimage\",\r\n  img2: \"images/rectangle.svg\",\r\n  alt2: \"rectangle\",\r\n  start: \"\",\r\n};\r\n\r\nexport const homeObjTwo = {\r\n  lightBg: true,\r\n  topLine: \"Cashless, Contactless & Cardless\",\r\n  headline: \"Fast, Secure and Safe Payment Experience.\",\r\n  description:\r\n    \"Give your customers the convenience to pay you from their smartphone. It keeps you, your customers and staff safe from Covid-19.\",\r\n\r\n  imgStart: \"\",\r\n  img: \"https://firebasestorage.googleapis.com/v0/b/deempay-d9d45.appspot.com/o/Mask%20Group%20(6).png?alt=media&token=334fcc2d-0cf5-4bc7-98ab-2d3b18abdf03\",\r\n  alt: \"homeimage2\",\r\n  start: \"\",\r\n  img4: \"images/web.svg\",\r\n  alt4: \"homeimage\",\r\n  description1: \"Trusted by businesses like\",\r\n};\r\n\r\nexport const homeObjThree = {\r\n  description1:\r\n    \"With your DeemPay NQR code, your customers can easily pay you by just scanning your QR code using any mobile bank app in Nigeria.\",\r\n  description2:\r\n    \"With your DeemPay virtual bank account, your customers can now pay you easily using transfer. Both you and your cashiers get instant payment notifications on the mobile or web app.\",\r\n  headline1: \"Multiple payment methods\",\r\n  headline2:\r\n    \"Accept mutiple cashless and contactless payment methods for your business\",\r\n  stepone: \"images/qr-payment.svg\",\r\n  steptwo: \"images/request-payment.svg\",\r\n  title1: \"QR Code\",\r\n  title2: \"Bank Transfer\",\r\n};\r\n\r\nexport const homeObjFour = {\r\n  description1:\r\n    \"Customers scan the DeemPay NQR code presented by the merchant to pay using any mobile bank app. The merchant instantly receives settlement to his/her bank account.\",\r\n  description2:\r\n    \"Customer make transfer to the DeemPay virtual bank account presented by the merchant to pay using USSD or mobile bank app. The merchant receives settlement to his/her bank account every end of the day.\",\r\n  headline: \"How to accept payments\",\r\n  subheadline: \"Start accepting payments\",\r\n  title1: \"With QR Code\",\r\n  title2:\r\n    \"With Bank Transfer\",\r\n  step1: \"Step 1\",\r\n  step2: \"Step 2\",\r\n  step3: \"Step 3\",\r\n  stepone: \"images/accept-payment.svg\",\r\n  steptwo: \"images/request-payment.svg\",\r\n  stepthree: \"images/request-payment.svg\",\r\n  content1: \"Customer scans the QR code with any bank app.\",\r\n  content2: \"Customer inputs the amount, PIN and pay.\",\r\n  content3: \"Payment successful. Merchant and his cashier receive instant notification.\",\r\n  content4: \"Customer enters the bank account using USSD or mobile bank app.\",\r\n  content5: \"Customer inputs the amount, select bank and pay.\",\r\n  content6: \"Payment successful. Merchant and his cashiers receive instant notification.\",\r\n};\r\n\r\nexport const homeObjNew = {\r\n  lightBg: true,\r\n  start: \"\",\r\n  imgStart: \"\",\r\n  description1:\r\n    \"DeemPay enables business owners to accept bank transfer and QR code as your payment option for ease of doing business.\",\r\n  description2:\r\n    \"With the DeemPay mobile or web app, your cashier can confirm all payments made at their points without contacting the business owner or the accountant.\",\r\n  description3:\r\n    \"See all cashier transaction history on the dashboard.\",\r\n  headline: \"How DeemPay helps your business\",\r\n  subheadline: \"With DeemPay, you don't only get tools to accept payment, but get tools to manage and grow your business.\",\r\n  title1: \"Accept Payment\",\r\n  title2: \"Retail Sub-account\",\r\n  title3: \"Transaction Reporting\",\r\n  image1: \"images/accept-payment.svg\",\r\n  image2: \"images/request-payment.svg\",\r\n  image3: \"images/request-payment.svg\",\r\n};\r\n\r\nexport const homeObjFive = {\r\n  headline: \"Clear pricing structure, zero hidden costs\",\r\n  headline2: \"Why use Deempay?\",\r\n  description2:\r\n    \"Our many starter benefits make it a no brainer. Start small, Scale quickly.\",\r\n  description:\r\n    \"Our transactional charges are among the lowest in the country, with a pay as you go model, we only make money when you sell.\",\r\n  fee: \"free\",\r\n  buttonLabel: \"Learn more\",\r\n  merchant: \"Dashboard App\",\r\n  webApp: \"DeemPay App\",\r\n  bank: \"Bank Transfer\",\r\n  qr: \"QR Code\",\r\n  img11: \"images/free.svg\",\r\n  img12: \"images/0.1.svg\",\r\n  img13: \"images/bank.svg\",\r\n  alt11: \"free\",\r\n  img1: \"images/fast-payment.svg\",\r\n  alt1: \"fast-payment\",\r\n  img2: \"images/instant-payment.svg\",\r\n  alt2: \"instant-payment\",\r\n  img3: \"images/low-charges.svg\",\r\n  alt3: \"low-charges\",\r\n  img4: \"images/no-charge.svg\",\r\n  alt4: \"transactions\",\r\n};\r\n\r\nexport const homeObjSix = {\r\n  headline: \"Maximum Security Assured\",\r\n  subHead: \"Bank Grade Encryption :\",\r\n  subHead2: \"PCI DSS and PA DSS :\",\r\n  description: \"At DeemPay we take security very seriously.\",\r\n  description2:\r\n    \"All your transactions and data are highly encrypted with the bank-grade encryption standard.\",\r\n  description3: \"All our systems and APPs are designed and developed following the best payment standards which is the payment card industry data security (PCIDSS).\",\r\n  imgStart: \"start\",\r\n  img: \"images/security.svg\",\r\n  alt: \"security\",\r\n};\r\n\r\nexport const homeObjSeven = {\r\n  headline: \"Our Partners\",\r\n  headline2:\r\n    \"We've partnered with experts in the industry to deliver lightning fast & secure payment infrastructure.\",\r\n  tence: \"images/tenece-logo.svg\",\r\n  alt4: \"tenece-logo\",\r\n  paythru: \"images/paythru-logo.png\",\r\n  alt2: \"paythru-logo\",\r\n  genesys: \"images/genesys-logo.png\",\r\n  alt: \"genesys-logo\",\r\n};\r\n","import React from \"react\";\r\nimport HomeSection from \"../../components/Home/HomeSection\";\r\nimport HomeSection2 from \"../../components/Home/HomeSection2\";\r\nimport HomeSection3 from \"../../components/Home/HomeSection3\";\r\nimport HomeSection4 from \"../../components/Home/HomeSection4\";\r\nimport HomeSection5 from \"../../components/Home/HomeSection5\";\r\nimport HomeSection6 from \"../../components/Home/HomeSection6\";\r\nimport HomeSection7 from \"../../components/Home/HomeSection7\";\r\nimport HomeSection8 from \"../../components/Home/HomeSection8\";\r\nimport HomeSectionNew from \"../../components/Home/HomeSectionNew\";\r\nimport Routes from \"../../Routes\";\r\n\r\nimport {\r\n  homeObjOne,\r\n  homeObjTwo,\r\n  homeObjThree,\r\n  homeObjFour,\r\n  homeObjFive,\r\n  homeObjSix,\r\n  homeObjSeven,\r\n  homeObjNew,\r\n} from \"./Data\";\r\n\r\n\r\n\r\nconst Home = () => {\r\n  return (\r\n    <Routes>\r\n      <HomeSection {...homeObjOne} />\r\n      <HomeSection2 {...homeObjTwo} />\r\n      <HomeSection3 {...homeObjThree} />\r\n      <HomeSection4 {...homeObjFour} />\r\n      <HomeSectionNew {...homeObjNew} />\r\n      <HomeSection5 {...homeObjFive} />\r\n      <HomeSection6 {...homeObjSix} />\r\n      <HomeSection7 {...homeObjSeven} />\r\n      <HomeSection8 />\r\n    </Routes>\r\n  );\r\n};\r\n\r\nexport default Home;\r\n","import styled from \"styled-components\";\n\nexport const InfoSec = styled.div`\n  color: #fff;\n  padding: 160px 0;\n  background: #fff;\n\n  @media screen and (max-width: 480px) {\n    padding: 80px 0;\n  }\n`;\n\nexport const TopLine = styled.div`\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  font-size: 48px;\n  font-weight: 700;\n  line-height: 70.5px;\n  padding-bottom: 10px;\n  color: #000000;\n\n  @media screen and (max-width: 480px) {\n    font-size: 38px;\n    line-height: 40px;\n    text-align: center;\n  }\n`;\n\nexport const Heading = styled.h1`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 16px;\n  font-weight: 400;\n  max-width: 45%;\n  margin: auto;\n  line-height: 23.5px;\n  flex-direction: column;\n  text-align: center;\n  padding-bottom: 33px;\n  color: #333333;\n  \n  @media screen and (max-width: 480px) {\n    max-width: 100%;\n    text-align: center;\n  }\n`;\n\nexport const BtnWrap = styled.div`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`;\n\nexport const Subtitle = styled.p`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 24px;\n  flex-direction: column;\n  text-align: center;\n  padding-top: 16px;\n  color: #333333;\n`;\n\nexport const Position = styled.span`\n  justify-content: center;\n  align-items: center;\n  font-size: 16px;\n  font-weight: 500;\n  line-height: 24px;\n  flex-direction: column;\n  display: flex;\n\n`;\n","import React, { useState } from \"react\";\nimport { Container, Button6 } from \"../../globalStyles\";\nimport Routes from \"../../Routes\";\n\nimport {\n  InfoSec,\n  TopLine,\n  Heading,\n  Subtitle,\n  BtnWrap,\n  Position,\n} from \"./DeleteElements\";\n\nconst Delete = () => {\n  const [show, setShow] = useState(false);\n\n  return (\n    <Routes>\n      <InfoSec>\n        <Container>\n          <TopLine>Come work with us</TopLine>\n          <Heading>\n            We are working on new and innovative ways to help businesses accept in-store\n            payments faster and grow quickly in the digital space.\n          </Heading>\n          <BtnWrap>\n            <Button6 onClick={() => setShow(!show)}>\n              <Position>Our Positions</Position>\n            </Button6>\n          </BtnWrap>\n          {show ? (\n            <Subtitle>\n              Sorry, we currently do not have any openings at the moment\n            </Subtitle>\n          ) : (\n            show\n          )}\n        </Container>\n      </InfoSec>\n    </Routes>\n  );\n};\n\nexport default Delete;\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport App from './App';\n\nReactDOM.render(<App />, document.getElementById('root')\n);\n\n\n","import styled, { createGlobalStyle } from \"styled-components\";\r\n\r\nconst GlobalStyle = createGlobalStyle`\r\n*{\r\n    box-sizing: border-box;\r\n    margin: 0;\r\n    padding: 0;\r\n    font-family: 'Heebo', sans-serif;\r\n}\r\n`;\r\n\r\nexport const Container = styled.div`\r\n  z-index: 1;\r\n  width: 100%;\r\n  max-width: 1300px;\r\n  margin-right: auto;\r\n  margin-left: auto;\r\n  padding-right: 24px;\r\n  padding-left: 24px;\r\n  @media screen and (max-width: 991px) {\r\n    padding-right: 24px;\r\n    padding-left: 24px;\r\n  }\r\n`;\r\n\r\nexport const Container2 = styled.div`\r\n  z-index: 1;\r\n  width: 100%;\r\n  max-width: 1300px;\r\n  margin-right: auto;\r\n  margin-left: auto;\r\n  padding-right: 130px;\r\n  padding-left: 130px;\r\n  @media screen and (max-width: 991px) {\r\n    padding-right: 30px;\r\n    padding-left: 30px;\r\n  }\r\n`;\r\n\r\nexport const Button = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  margin-right: 16px;\r\n  padding: 10px 16px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: #000;\r\n    color: #ffffff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    margin-right: 8px;\r\n    width: 175px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    margin-bottom: 16px;\r\n    width: 100%;\r\n    padding: 10px 35px;\r\n  }\r\n`;\r\n\r\nexport const Button2 = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  padding: 10px 16px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 175px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    width: 100%;\r\n    padding: 10px 35px;\r\n  }\r\n`;\r\n\r\nexport const ButtonGrey = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  margin-left: 16px;\r\n  padding: 10px 38px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  @media screen and (max-width: 670px) {\r\n    font-size: 15px;\r\n    margin-left: 0px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    margin-top: 20px;\r\n    width: 300px;\r\n    padding: 10px 16px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    width: 200px;\r\n  }\r\n`;\r\n\r\nexport const ButtonApp = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  padding: 10px 16px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  margin-right: 16px;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: rgb(15, 10, 10);\r\n    color: #ffffff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 175px;\r\n    margin-right: 8px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    margin-bottom: 16px;\r\n  }\r\n`;\r\n\r\nexport const ButtonOS = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  padding: 10px 16px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 175px;\r\n  }\r\n`;\r\n\r\nexport const Button22 = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  padding: 10px 16px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: rgb(15, 10, 10);\r\n    color: #ffffff;\r\n  }\r\n  @media screen and (max-width: 670px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 300px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    width: 200px;\r\n  }\r\n`;\r\n\r\nexport const Button3 = styled.button`\r\n  border-radius: 8px;\r\n  background: #000000;\r\n  white-space: nowrap;\r\n  padding: 8px 16px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  width: 128px;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  margin: 20px 0;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: rgb(15, 10, 10);\r\n    color: #ffffff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n  }\r\n`;\r\n\r\nexport const Button4 = styled.button`\r\n  border-radius: 8px;\r\n  background: #ffffff;\r\n  white-space: nowrap;\r\n  margin-right: 16px;\r\n  padding: 10px 8px;\r\n  color: #1a71ff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  width: 186px;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: #f7e2e2;\r\n    color: #1a71ff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    margin-bottom: 16px;\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 175px;\r\n  }\r\n`;\r\n\r\nexport const Button44 = styled.button`\r\n  border-radius: 8px;\r\n  background: #ffffff;\r\n  white-space: nowrap;\r\n  margin-right: 16px;\r\n  padding: 10px 16px;\r\n  color: #1a71ff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    border: 1px solid #f7e2e2;\r\n  }\r\n  @media screen and (max-width: 670px) {\r\n    margin-bottom: 20px;\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 300px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    width: 200px;\r\n  }\r\n`;\r\n\r\nexport const Button5 = styled.button`\r\n  border-radius: 8px;\r\n  background: #ffffff;\r\n  white-space: nowrap;\r\n  padding: 8px 16px;\r\n  color: #1a71ff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  width: 186px;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  margin: 20px 0;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    border: 1px solid #f7e2e2;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 210px;\r\n  }\r\n`;\r\n\r\nexport const Button6 = styled.button`\r\n  border-radius: 8px;\r\n  background: #1a71ff;\r\n  white-space: nowrap;\r\n  padding: 10px 8px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  width: 140px;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: #0f76d1;\r\n    color: #ffffff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n  }\r\n`;\r\n\r\nexport const Button7 = styled.button`\r\n  border-radius: 8px;\r\n  background: #1a71ff;\r\n  white-space: nowrap;\r\n  padding: 10px 55px;\r\n  color: #ffffff;\r\n  font-size: 17px;\r\n  outline: none;\r\n  border: none;\r\n  height: 48px;\r\n  font-weight: 500;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: #035ae8;\r\n    color: #ffffff;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 15px;\r\n    font-weight: 400;\r\n    line-height: 15px;\r\n    width: 100%;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    margin-bottom: 16px;\r\n    padding: 10px 40px;\r\n  }\r\n`;\r\n\r\nexport default GlobalStyle;\r\n","import styled from \"styled-components\";\r\nimport { Link as LinkR } from \"react-router-dom\";\r\nimport { Link as LinkS } from \"react-scroll\";\r\n\r\nexport const SidebarContainer = styled.aside`\r\n  position: fixed;\r\n  display: grid;\r\n  background: #fafafa;\r\n  height: 100%;\r\n  z-index: 999;\r\n  width: 100%;\r\n  align-items: center;\r\n  top: 0;\r\n  left: 0;\r\n  transition: 0.3s ease-in-out;\r\n  opacity: ${({ isOpen }) => (isOpen ? \"100%\" : \"0\")};\r\n  left: ${({ isOpen }) => (isOpen ? \"0\" : \"-100%\")};\r\n`;\r\n\r\nexport const SidebarLogo = styled(LinkR)`\r\n  justify-self: flex-start;\r\n  cursor: pointer;\r\n  text-decoration: none;\r\n  font-size: 1.5rem;\r\n  top: 1.5rem;\r\n  display: flex;\r\n  align-items: center;\r\n  font-weight: bold;\r\n  margin-left: 24px;\r\n  position: absolute;\r\n`;\r\n\r\nexport const Icon = styled.div`\r\n  display: block;\r\n  position: absolute;\r\n  top: 1.2rem;\r\n  right: 1.5rem;\r\n  margin-top: -5px;\r\n  font-size: 2rem;\r\n  cursor: pointer;\r\n  outline: none;\r\n`;\r\n\r\nexport const SidebarWrapper = styled.div`\r\n  color: #000;\r\n  padding-bottom: 2rem;\r\n`;\r\n\r\nexport const SidebarMenu = styled.ul`\r\n  display: grid;\r\n  grid-template-columns: 1fr;\r\n  grid-template-rows: repeat(7, 70px);\r\n  text-align: center;\r\n  @media screen and (max-width: 480px) {\r\n    grid-template-rows: repeat(5, 60px);\r\n  }\r\n`;\r\n\r\nexport const SidebarLink = styled(LinkS)`\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #000;\r\n  font-size: 17px;\r\n  font-style: normal;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  text-decoration: none;\r\n  list-style: none;\r\n  transition: 0.2s ease-in-out;\r\n  cursor: pointer;\r\n  &.hover {\r\n    transition: 0.2s ease-in-out;\r\n  }\r\n`;\r\n\r\nexport const SidebarLink2 = styled.span`\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #000;\r\n  font-size: 17px;\r\n  font-style: normal;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  text-decoration: none;\r\n  list-style: none;\r\n  transition: 0.2s ease-in-out;\r\n  cursor: pointer;\r\n  &.hover {\r\n    transition: 0.2s ease-in-out;\r\n  }\r\n`;\r\n\r\nexport const SideBtnWrap = styled.div`\r\n  display: flex;\r\n  justify-content: center;\r\n  margin-top: 10px;\r\n`;\r\n\r\nexport const SidebarRoute = styled(LinkR)`\r\n  font-size: 17px;\r\n  font-style: normal;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  color: #000;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    color: #000;\r\n  }\r\n`;\r\n\r\nexport const SidebarRoute1 = styled(LinkR)`\r\n  font-size: 17px;\r\n  font-style: normal;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  color: #fff;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    color: #fff;\r\n  }\r\n`;\r\n\r\nexport const SidebarBtn = styled.button`\r\n  border-radius: 8px;\r\n  background: #1a71ff;\r\n  white-space: nowrap;\r\n  height: 48px;\r\n  padding: 10px 20px;\r\n  color: #fff;\r\n  width: 200px;\r\n  font-size: 17px;\r\n  border: none;\r\n  text-decoration: none;\r\n  outline: none;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: #035ae8;\r\n    color: #ffffff;\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { Menu, Dropdown } from \"antd\";\r\nimport \"./Sidebar.css\";\r\nimport {\r\n  SidebarContainer,\r\n  SidebarBtn,\r\n  Icon,\r\n  SidebarWrapper,\r\n  SidebarMenu,\r\n  SidebarRoute,\r\n  SidebarRoute1,\r\n  SidebarLink,\r\n  SideBtnWrap,\r\n  SidebarLogo,\r\n  SidebarLink2,\r\n} from \"./SidebarElements\";\r\n\r\nconst linksStyle = {\r\n  textDecoration: \"none\",\r\n};\r\n\r\nconst linkStyle = {\r\n  textDecoration: \"none\",\r\n  color: \"#000000\",\r\n};\r\n\r\nconst linkyStyle = {\r\n  textDecoration: \"none\",\r\n  color: \"#ffffff\",\r\n};\r\n\r\nconst Sidebar = ({ isOpen, toggle }) => {\r\n  const solutions = (\r\n    <Menu className=\"bar-menu\">\r\n      <div className=\"img-dropdown\">\r\n        <img\r\n          src=\"images/solutions.svg\"\r\n          alt=\"solution-icon\"\r\n          className=\"pad-img1\"\r\n          width=\"23%\"\r\n          height=\"auto\"\r\n        />\r\n      </div>\r\n      <Menu.Item className=\"mo\">\r\n        <Link\r\n          to=\"/deempay-app\"\r\n          className=\"pad3\"\r\n          onClick={toggle}\r\n          style={linksStyle}\r\n        >\r\n          DeemPay App\r\n        </Link>\r\n      </Menu.Item>\r\n      <hr className=\"dropdown-horizontal-line2\"></hr>\r\n      <Menu.Item className=\"mo4\">\r\n        <Link\r\n          to=\"/deempay-dashboard\"\r\n          className=\"pad3\"\r\n          onClick={toggle}\r\n          style={linksStyle}\r\n        >\r\n          DeemPay Dashboard\r\n        </Link>\r\n      </Menu.Item>\r\n    </Menu>\r\n  );\r\n\r\n  const help = (\r\n    <Menu className=\"bar1-menu\">\r\n      <div className=\"img-dropdown\">\r\n        <img\r\n          src=\"images/help.svg\"\r\n          alt=\"help-icon\"\r\n          className=\"pad-img1\"\r\n          width=\"23%\"\r\n          height=\"auto\"\r\n        />\r\n      </div>\r\n      <Menu.Item className=\"mo3\">\r\n        <Link to=\"/faq\" className=\"pad\" onClick={toggle} style={linksStyle}>\r\n          FAQ\r\n        </Link>\r\n      </Menu.Item>\r\n      <hr className=\"dropdown-horizontal-line\"></hr>\r\n      <Menu.Item className=\"mo3\">\r\n        <Link\r\n          to=\"/supportcenter\"\r\n          className=\"pad\"\r\n          onClick={toggle}\r\n          style={linksStyle}\r\n        >\r\n          Support Center\r\n        </Link>\r\n      </Menu.Item>\r\n      <hr className=\"dropdown-horizontal-line\"></hr>\r\n      <Menu.Item className=\"mo3\">\r\n        <Link to=\"/blog\" className=\"pad\" onClick={toggle} style={linksStyle}>\r\n          Blog\r\n        </Link>\r\n      </Menu.Item>\r\n    </Menu>\r\n  );\r\n\r\n  const company = (\r\n    <Menu className=\"bar-menu\">\r\n      <div className=\"img-dropdown\">\r\n        <img\r\n          src=\"images/company.svg\"\r\n          alt=\"company-icon\"\r\n          className=\"pad-img1\"\r\n          width=\"23%\"\r\n          height=\"auto\"\r\n        />\r\n      </div>\r\n\r\n      <Menu.Item className=\"mo\">\r\n        <Link to=\"/about\" className=\"pad2\" onClick={toggle} style={linksStyle}>\r\n          About\r\n        </Link>\r\n      </Menu.Item>\r\n      <hr className=\"dropdown-horizontal-line2\"></hr>\r\n      <Menu.Item className=\"mo4\">\r\n        <Link\r\n          to=\"/careers\"\r\n          className=\"pad2\"\r\n          onClick={toggle}\r\n          style={linksStyle}\r\n        >\r\n          Careers\r\n        </Link>\r\n      </Menu.Item>\r\n    </Menu>\r\n  );\r\n\r\n  return (\r\n    <SidebarContainer isOpen={isOpen} onClick={toggle}>\r\n      <SidebarLogo>\r\n        <Link onClick={toggle} to=\"/\">\r\n          <img src={\"../../images/deempay-logo.svg\"} alt=\"logo\" />\r\n        </Link>\r\n      </SidebarLogo>\r\n      <Icon onClick={toggle}>\r\n        {\r\n          <span>\r\n            <svg\r\n              fill=\"none\"\r\n              viewBox=\"0 0 24 24\"\r\n              stroke-width=\"1.8\"\r\n              stroke=\"currentColor\"\r\n              width=\"38\"\r\n              height=\"35\"\r\n            >\r\n              <path stroke-linecap=\"round\" stroke-linejoin=\"round\" d=\"M6 18L18 6M6 6l12 12\" />\r\n            </svg>\r\n          </span>\r\n        }\r\n      </Icon>\r\n      <SidebarWrapper>\r\n        <SidebarMenu>\r\n          <SidebarLink style={linkStyle}>\r\n            <Dropdown overlay={solutions}>\r\n              <div className=\"ant-dropdown-link nav-links\">\r\n                Solutions\r\n                {\r\n                  <span className=\"drop2\">\r\n                    <svg\r\n                      fill=\"none\"\r\n                      viewBox=\"0 0 24 24\"\r\n                      stroke-width=\"4\"\r\n                      stroke=\"currentColor\"\r\n                      width=\"18\"\r\n                      height=\"11\"\r\n                    >\r\n                      <path\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                        d=\"M19.5 8.25l-7.5 7.5-7.5-7.5\"\r\n                      />\r\n                    </svg>\r\n                  </span>\r\n                }\r\n              </div>\r\n            </Dropdown>\r\n          </SidebarLink>\r\n          <SidebarLink style={linkStyle}>\r\n            <Link to=\"/pricing\" onClick={toggle} style={linkStyle}>\r\n              Pricing\r\n            </Link>\r\n          </SidebarLink>\r\n          <SidebarLink style={linkStyle}>\r\n            <Dropdown overlay={help}>\r\n              <div className=\"ant-dropdown-link nav-links\">\r\n                Help\r\n                {\r\n                  <span className=\"drop2\">\r\n                    <svg\r\n                      fill=\"none\"\r\n                      viewBox=\"0 0 24 24\"\r\n                      stroke-width=\"4\"\r\n                      stroke=\"currentColor\"\r\n                      //class=\"w-3 h-3\"\r\n\r\n                      width=\"18\"\r\n                      height=\"11\"\r\n                    >\r\n                      <path\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                        d=\"M19.5 8.25l-7.5 7.5-7.5-7.5\"\r\n                      />\r\n                    </svg>\r\n                  </span>\r\n                }\r\n              </div>\r\n            </Dropdown>\r\n          </SidebarLink>\r\n          <SidebarLink style={linkStyle}>\r\n            <Dropdown overlay={company}>\r\n              <div className=\"ant-dropdown-link nav-links\">\r\n                Company\r\n                {\r\n                  <span className=\"drop2\">\r\n                    <svg\r\n                      fill=\"none\"\r\n                      viewBox=\"0 0 24 24\"\r\n                      stroke-width=\"4\"\r\n                      stroke=\"currentColor\"\r\n                      //class=\"w-3 h-3\"\r\n\r\n                      width=\"18\"\r\n                      height=\"11\"\r\n                    >\r\n                      <path\r\n                        stroke-linecap=\"round\"\r\n                        stroke-linejoin=\"round\"\r\n                        d=\"M19.5 8.25l-7.5 7.5-7.5-7.5\"\r\n                      />\r\n                    </svg>\r\n                  </span>\r\n                }\r\n              </div>\r\n            </Dropdown>\r\n          </SidebarLink>\r\n          <SidebarLink2 style={linkStyle}>\r\n            <SidebarRoute\r\n              target=\"_blank\"\r\n              to={\"//app.deempay.com/login\"}\r\n              style={linkStyle}\r\n              onClick={toggle}\r\n            >\r\n              Log In\r\n            </SidebarRoute>\r\n          </SidebarLink2>\r\n          <SideBtnWrap>\r\n            <SidebarBtn>\r\n              <SidebarRoute1\r\n                target=\"_blank\"\r\n                to={\"//app.deempay.com/registration\"}\r\n                style={linkyStyle}\r\n              >\r\n                Get Started\r\n              </SidebarRoute1>\r\n            </SidebarBtn>\r\n          </SideBtnWrap>\r\n        </SidebarMenu>\r\n      </SidebarWrapper>\r\n    </SidebarContainer>\r\n  );\r\n};\r\n\r\nexport default Sidebar;\r\n","import styled from \"styled-components\";\r\nimport { Link as LinkR } from \"react-router-dom\";\r\nimport { Link as LinkS } from \"react-scroll\";\r\n\r\nexport const Nav = styled.nav`\r\n  background: #fff;\r\n  height: 80px;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  font-size: 1rem;\r\n  position: sticky;\r\n  top: 0;\r\n  z-index: 10;\r\n  @media screen and (max-width: 960px) {\r\n    transition: 0.8s all ease;\r\n  }\r\n`;\r\n\r\nexport const NavbarContainer = styled.div`\r\n  display: flex;\r\n  justify-content: space-between;\r\n  height: 80px;\r\n  z-index: 1;\r\n  width: 100%;\r\n  padding: 0 24px;\r\n  max-width: 1300px;\r\n  @media screen and (max-width: 960px) {\r\n    transition: 0.8s all ease;\r\n  }\r\n`;\r\n\r\nexport const NavLogo = styled(LinkR)`\r\n  justify-self: flex-start;\r\n  cursor: pointer;\r\n  text-decoration: none;\r\n  font-size: 1.5rem;\r\n  display: flex;\r\n  align-items: center;\r\n  font-weight: bold;\r\n  \r\n`;\r\n\r\nexport const MobileIcon = styled.div`\r\n  display: none;\r\n  @media screen and (max-width: 991px) {\r\n    display: block;\r\n    position: absolute;\r\n    top: 0;\r\n    margin-top: -10px;\r\n    right: 0;\r\n    transform: translate(-100%, 60%);\r\n    font-size: 1.8rem;\r\n    cursor: pointer;\r\n  }\r\n`;\r\n\r\nexport const NavMenu = styled.ul`\r\n  display: flex;\r\n  align-items: center;\r\n  list-style: none;\r\n  text-align: center;\r\n  margin-left: -22px;\r\n  @media screen and (max-width: 991px) {\r\n    display: none;\r\n  }\r\n`;\r\n\r\nexport const NavItem = styled.li`\r\n  height: 80px;\r\n`;\r\n\r\nexport const NavLinks = styled(LinkS)`\r\n  color: #000000;\r\n  font-size: 17px;\r\n  font-style: normal;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  display: flex;\r\n  margin-top: 7.5px;\r\n  align-items: center !important;\r\n  text-decoration: none;\r\n  padding: 0 1.3rem;\r\n  height: 100%;\r\n  cursor: pointer;\r\n`;\r\n\r\nexport const NavLink = styled(LinkR)`\r\n  color: #000000;\r\n  font-size: 17px;\r\n  font-style: normal;\r\n  font-weight: 500;\r\n  line-height: 24px;\r\n  display: flex;\r\n  align-items: center;\r\n  text-decoration: none;\r\n  padding: 0 1.2rem;\r\n  height: 100%;\r\n  cursor: pointer;\r\n`;\r\n\r\nexport const NavBtn = styled.nav`\r\n  display: flex;\r\n  align-items: center;\r\n  @media screen and (max-width: 991px) {\r\n    display: none;\r\n  }\r\n`;\r\n\r\nexport const NavBtnLink = styled(LinkR)`\r\n  border-radius: 8px;\r\n  height: 48px;\r\n  background: #1a71ff;\r\n  white-space: nowrap;\r\n  width: 128px;\r\n  padding: 10.5px 20px;\r\n  color: #ffffff;\r\n  font-weight: 500;\r\n  font-size: 17px;\r\n  border: none;\r\n  text-decoration: none;\r\n  outline: none;\r\n  cursor: pointer;\r\n  transition: all 0.2s ease-in-out;\r\n  &:hover {\r\n    transition: all 0.2s ease-in-out;\r\n    background: #035ae8;\r\n    color: #ffffff;\r\n    text-decoration: none;\r\n  }\r\n`;\r\n\r\n\r\n","import React, { useState } from \"react\";\r\nimport \"./Navbar.css\";\r\nimport { Menu, Dropdown } from \"antd\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { animateScroll as scroll } from \"react-scroll\";\r\nimport {\r\n  Nav,\r\n  NavbarContainer,\r\n  NavLogo,\r\n  MobileIcon,\r\n  NavMenu,\r\n  NavItem,\r\n  NavBtn,\r\n  NavLinks,\r\n  NavBtnLink,\r\n  NavLink,\r\n} from \"./NavbarElements\";\r\n\r\nconst linksStyle = {\r\n  textDecoration: \"none\",\r\n};\r\n\r\nconst linkStyle = {\r\n  textDecoration: \"none\",\r\n  color: \"#000000\",\r\n};\r\n\r\nconst solutions = (\r\n  <Menu className=\"top-menu\">\r\n    <div className=\"img-dropdown\">\r\n      <img\r\n        src=\"images/solutions.svg\"\r\n        alt=\"solution-icon\"\r\n        className=\"pad-img1\"\r\n        width=\"23%\"\r\n        height=\"auto\"\r\n      />\r\n    </div>\r\n    <Menu.Item className=\"mo\">\r\n      <Link to=\"/deempay-app\" className=\"pad3\" style={linksStyle}>\r\n        <span className=\"\">DeemPay App</span>\r\n      </Link>\r\n    </Menu.Item>\r\n    <hr className=\"dropdown-horizontal-line2\"></hr>\r\n    <Menu.Item className=\"mo4\">\r\n      <Link to=\"/deempay-dashboard\" className=\"pad3\" style={linksStyle}>\r\n        DeemPay Dashboard\r\n      </Link>\r\n    </Menu.Item>\r\n  </Menu>\r\n);\r\n\r\nconst help = (\r\n  <Menu className=\"top-menu\">\r\n    <div className=\"img-dropdown\">\r\n      <img\r\n        src=\"images/help.svg\"\r\n        alt=\"help-icon\"\r\n        className=\"pad-img1\"\r\n        width=\"23%\"\r\n        height=\"auto\"\r\n      />\r\n    </div>\r\n    <Menu.Item className=\"mo4\">\r\n      <Link to=\"/faq\" className=\"pad\" style={linksStyle}>\r\n        FAQ\r\n      </Link>\r\n    </Menu.Item>\r\n    <hr className=\"dropdown-horizontal-line\"></hr>\r\n    <Menu.Item className=\"mo4\">\r\n      <Link to=\"/supportcenter\" className=\"pad\" style={linksStyle}>\r\n        Support Center\r\n      </Link>\r\n    </Menu.Item>\r\n    <hr className=\"dropdown-horizontal-line\"></hr>\r\n    <Menu.Item className=\"mo4\">\r\n      <Link to=\"/blog\" className=\"pad\" style={linksStyle}>\r\n        Blog\r\n      </Link>\r\n    </Menu.Item>\r\n  </Menu>\r\n);\r\n\r\nconst company = (\r\n  <Menu className=\"top-menu\">\r\n    <div className=\"img-dropdown\">\r\n      <img\r\n        src=\"images/company.svg\"\r\n        alt=\"company-icon\"\r\n        className=\"pad-img1\"\r\n        width=\"23%\"\r\n        height=\"auto\"\r\n      />\r\n    </div>\r\n\r\n    <Menu.Item className=\"mo\">\r\n      <Link to=\"/about\" className=\"pad2\" style={linksStyle}>\r\n        About\r\n      </Link>\r\n    </Menu.Item>\r\n    <hr className=\"dropdown-horizontal-line2\"></hr>\r\n    <Menu.Item className=\"mo4\">\r\n      <Link to=\"/careers\" className=\"pad2\" style={linksStyle}>\r\n        {\" \"}\r\n        Careers{\" \"}\r\n      </Link>\r\n    </Menu.Item>\r\n  </Menu>\r\n);\r\n\r\nfunction Navbar({ toggle }) {\r\n  const [navbr, setNavbr] = useState(false);\r\n\r\n  const changeBackground = () => {\r\n    if (window.scrollY >= 80) {\r\n      setNavbr(true);\r\n    } else {\r\n      setNavbr(false);\r\n    }\r\n  };\r\n\r\n  window.addEventListener(\"scroll\", changeBackground);\r\n  const toggleHome = () => {\r\n    scroll.scrollToTop();\r\n  };\r\n\r\n  return (\r\n    <>\r\n      <Nav className={navbr ? \"navbr active\" : \"navbr\"}>\r\n        <NavbarContainer>\r\n          <NavLogo to=\"/\" onClick={toggleHome}>\r\n            <img src={\"../../images/deempay-logo.svg\"} alt=\"logo\" />\r\n          </NavLogo>\r\n          <MobileIcon onClick={toggle}>\r\n            {\r\n              <span>\r\n                <svg\r\n                  fill=\"none\"\r\n                  viewBox=\"0 0 24 24\"\r\n                  stroke-width=\"1.8\"\r\n                  stroke=\"currentColor\"\r\n                  width=\"38\"\r\n                  height=\"35\"\r\n                >\r\n                  <path\r\n                    stroke-linecap=\"round\"\r\n                    stroke-linejoin=\"round\"\r\n                    d=\"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5\"\r\n                  />\r\n                </svg>\r\n              </span>\r\n            }\r\n          </MobileIcon>\r\n          <NavMenu>\r\n            <NavItem>\r\n              <NavLinks style={linkStyle}>\r\n                <Dropdown overlay={solutions}>\r\n                  <div className=\"ant-dropdown-link nav-links\">\r\n                    Solutions\r\n                    {\r\n                      <span className=\"drop2\">\r\n                        <svg\r\n                          fill=\"none\"\r\n                          viewBox=\"0 0 24 24\"\r\n                          stroke-width=\"4\"\r\n                          stroke=\"currentColor\"\r\n                          //class=\"w-3 h-3\"\r\n\r\n                          width=\"18\"\r\n                          height=\"11\"\r\n                        >\r\n                          <path\r\n                            stroke-linecap=\"round\"\r\n                            stroke-linejoin=\"round\"\r\n                            d=\"M19.5 8.25l-7.5 7.5-7.5-7.5\"\r\n                          />\r\n                        </svg>\r\n                      </span>\r\n                    }\r\n                  </div>\r\n                </Dropdown>\r\n              </NavLinks>\r\n            </NavItem>\r\n            <NavItem>\r\n              <NavLinks style={linkStyle}>\r\n                <Link to=\"/pricing\" style={linkStyle}>\r\n                  Pricing\r\n                </Link>\r\n              </NavLinks>\r\n            </NavItem>\r\n            <NavItem>\r\n              <NavLinks style={linkStyle}>\r\n                <Dropdown overlay={help}>\r\n                  <div className=\"ant-dropdown-link nav-links\">\r\n                    Help\r\n                    {\r\n                      <span className=\"drop2\">\r\n                        <svg\r\n                          fill=\"none\"\r\n                          viewBox=\"0 0 24 24\"\r\n                          stroke-width=\"4\"\r\n                          stroke=\"currentColor\"\r\n                          //class=\"w-3 h-3\"\r\n\r\n                          width=\"18\"\r\n                          height=\"11\"\r\n                        >\r\n                          <path\r\n                            stroke-linecap=\"round\"\r\n                            stroke-linejoin=\"round\"\r\n                            d=\"M19.5 8.25l-7.5 7.5-7.5-7.5\"\r\n                          />\r\n                        </svg>\r\n                      </span>\r\n                      // <img\r\n                      //   src=\"images/drop.svg\"\r\n                      //   alt=\"icon\"\r\n                      //   className=\"drop-down\"\r\n                      // />\r\n                    }\r\n                  </div>\r\n                </Dropdown>\r\n              </NavLinks>\r\n            </NavItem>\r\n            <NavItem>\r\n              <NavLinks style={linkStyle}>\r\n                <Dropdown overlay={company}>\r\n                  <div className=\"ant-dropdown-link nav-links\">\r\n                    Company\r\n                    {\r\n                      <span className=\"drop2\">\r\n                        <svg\r\n                          fill=\"none\"\r\n                          viewBox=\"0 0 24 24\"\r\n                          stroke-width=\"4\"\r\n                          stroke=\"currentColor\"\r\n                          //class=\"w-3 h-3\"\r\n\r\n                          width=\"18\"\r\n                          height=\"11\"\r\n                        >\r\n                          <path\r\n                            stroke-linecap=\"round\"\r\n                            stroke-linejoin=\"round\"\r\n                            d=\"M19.5 8.25l-7.5 7.5-7.5-7.5\"\r\n                          />\r\n                        </svg>\r\n                      </span>\r\n                    }\r\n                  </div>\r\n                </Dropdown>\r\n              </NavLinks>\r\n            </NavItem>\r\n          </NavMenu>\r\n          <NavBtn>\r\n            <NavLink\r\n              target=\"_blank\"\r\n              to={\"//app.deempay.com/login\"}\r\n              style={linkStyle}\r\n            >\r\n              Log In\r\n            </NavLink>\r\n            <NavBtnLink target=\"_blank\" to={\"//app.deempay.com/registration\"}>\r\n              Get Started\r\n            </NavBtnLink>\r\n          </NavBtn>\r\n        </NavbarContainer>\r\n      </Nav>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default Navbar;\r\n","import styled from \"styled-components\";\r\nimport { Link } from \"react-router-dom\";\r\n\r\nexport const FooterContainer = styled.div`\r\n  background-color: #fafafa;\r\n`;\r\n\r\nexport const FooterWrap = styled.div`\r\n  padding: 60px 10px;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: center;\r\n  align-items: center;\r\n  max-width: 1300px;\r\n  margin: 0 auto;\r\n  @media screen and (max-width: 480px) {\r\n    padding: 24px;\r\n  }\r\n`;\r\n\r\nexport const FooterLinksContainer = styled.div`\r\n  display: flex;\r\n  width: 100%;\r\n  margin-bottom: 5px;\r\n  @media screen and (max-width: 820px) {\r\n    padding-top: 32px;\r\n  }\r\n`;\r\n\r\nexport const FooterLinksWrapper = styled.div`\r\n  display: flex;\r\n  @media screen and (max-width: 850px) {\r\n    flex-direction: column;\r\n  }\r\n`;\r\n\r\nexport const FooterLinksWrapper2 = styled.div`\r\n  display: flex;\r\n  @media screen and (max-width: 1000px) {\r\n    margin-left: -15px;\r\n  }\r\n  @media screen and (max-width: 991px) {\r\n    margin-left: 0px;\r\n  }\r\n    @media screen and (max-width: 1200px) {\r\n    flex-direction: column;\r\n  }\r\n`;\r\n\r\nexport const FooterLinkItems = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  margin: 16px;\r\n  text-align: left;\r\n  width: 160px;\r\n  box-sizing: border-box;\r\n  padding-left: 0px;\r\n  color: #fff;\r\n  @media screen and (max-width: 420px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 0px;\r\n    width: 100%;\r\n  }\r\n`;\r\n\r\nexport const FooterLinkItems2 = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  margin: 16px;\r\n  text-align: left;\r\n  max-width: 240px;\r\n  box-sizing: border-box;\r\n  padding-left: 90px;\r\n  @media screen and (max-width: 900px) {\r\n    padding-left: 10px;\r\n  }\r\n  @media screen and (max-width: 850px) {\r\n    padding-left: 0px;\r\n  }\r\n  @media screen and (max-width: 420px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 0px;\r\n    width: 100%;\r\n  }\r\n`;\r\nexport const FooterLinkItems3 = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  margin: 16px;\r\n  text-align: left;\r\n  max-width: 220px;\r\n  box-sizing: border-box;\r\n  padding-left: 150px;\r\n  @media screen and (max-width: 900px) {\r\n    padding-left: 10px;\r\n  }\r\n  @media screen and (max-width: 850px) {\r\n    padding-left: 0px;\r\n  }\r\n  @media screen and (max-width: 420px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 0px;\r\n    width: 100%;\r\n  }\r\n`;\r\n\r\nexport const FooterLinkItems4 = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  margin: 16px;\r\n  text-align: left;\r\n  max-width: 250px;\r\n  box-sizing: border-box;\r\n  padding-left: 130px;\r\n  color: #fff;\r\n  @media screen and (max-width: 480px) {\r\n    margin: 0;\r\n    padding-top: 10px;\r\n    padding-left: 50px;\r\n    width: 100%;\r\n  }\r\n  @media screen and (max-width: 400px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 20px;\r\n    width: 100%;\r\n  }\r\n  @media screen and (max-width: 280px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 20px;\r\n    width: 10%;\r\n  }\r\n`;\r\n\r\nexport const FooterLinkItems5 = styled.div`\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  margin-top: 16px;\r\n  text-align: left;\r\n  max-width: 275px;\r\n  box-sizing: border-box;\r\n  padding-left: 150px;\r\n  @media screen and (max-width: 480px) {\r\n    margin: 0;\r\n    padding-top: 10px;\r\n    padding-left: 50px;\r\n    width: 100%;\r\n  }\r\n  @media screen and (max-width: 400px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 20px;\r\n    width: 100%;\r\n  }\r\n  @media screen and (max-width: 280px) {\r\n    margin: 0;\r\n    padding: 10px 10px 10px 20px;\r\n    width: 20%;\r\n  }\r\n`;\r\n\r\nexport const FooterLinkTitle = styled.h2`\r\n  margin-bottom: 16px;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  font-weight: 500;\r\n  color: #000000;\r\n`;\r\n\r\nexport const FooterLink = styled(Link)`\r\n  color: #565656;\r\n  text-decoration: none;\r\n  margin-bottom: 0.5rem;\r\n  line-height: 24px;\r\n  font-size: 16px;\r\n  &:hover {\r\n    color: #1a71ff;\r\n    transition: 0.3s ease-out;\r\n  }\r\n`;\r\n\r\nexport const FooterLink2 = styled(Link)`\r\n  color: #565656;\r\n  text-decoration: none;\r\n  margin-bottom: 0.2rem;\r\n  line-height: 24px;\r\n  cursor: auto;\r\n  font-size: 16px;\r\n  &:hover {\r\n    color: #565656;\r\n    transition: 0.3s ease-out;\r\n  }\r\n`;\r\n\r\nexport const SocialMedia = styled.section`\r\n  max-width: 1300px;\r\n  width: 100%;\r\n`;\r\n\r\nexport const SocialMediaWrap = styled.div`\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  max-width: 1100px;\r\n  margin: 40px auto 0 auto;\r\n  @media screen and (max-width: 820px) {\r\n    flex-direction: column;\r\n  }\r\n`;\r\n\r\nexport const FooterLogo = styled(Link)`\r\n  color: #fff;\r\n`;\r\n\r\nexport const FooterLine = styled.hr`\r\n  border: 0.5px solid #dfdfdf;\r\n  width: 97%;\r\n  margin-top: 20px;\r\n  margin-bottom: 10px;\r\n\r\n  @media screen and (max-width: 480px) {\r\n    width: 98%;\r\n  }\r\n`;\r\n\r\nexport const LastLine = styled.div`\r\n  margin-bottom: 10px;\r\n  line-height: 24px;\r\n  font-size: 14px;\r\n  padding: 0 10px;\r\n  margin-left: 5px;\r\n  color: #565656;\r\n  margin-top: 10px;\r\n  @media screen and (max-width: 1000px) {\r\n    margin-left: 0px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    padding: 0 0px;\r\n  }\r\n`;\r\n\r\nexport const SocialIcons = styled.div`\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  width: 120px;\r\n  margin-top: 150px;\r\n  @media screen and (max-width: 1700px) {\r\n    width: 100px;\r\n  }\r\n  @media screen and (max-width: 1000px) {\r\n    width: 70px;\r\n  }\r\n  @media screen and (max-width: 960px) {\r\n    width: 110px;\r\n  }\r\n  @media screen and (max-width: 280px) {\r\n    display: grid;\r\n    width: 10%;\r\n  }\r\n`;\r\n","import React from \"react\";\r\nimport { animateScroll as scroll } from \"react-scroll\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { FaFacebook, FaInstagram, FaTwitter, FaLinkedin } from \"react-icons/fa\";\r\nimport {\r\n  FooterContainer,\r\n  FooterLogo,\r\n  FooterWrap,\r\n  FooterLinksContainer,\r\n  FooterLinksWrapper,\r\n  FooterLinksWrapper2,\r\n  FooterLinkItems,\r\n  FooterLinkItems2,\r\n  FooterLinkItems3,\r\n  FooterLinkItems4,\r\n  FooterLinkItems5,\r\n  FooterLinkTitle,\r\n  FooterLink,\r\n  FooterLink2,\r\n  FooterLine,\r\n  LastLine,\r\n  SocialIcons,\r\n} from \"./FooterElements\";\r\n\r\nconst linkStyle = {\r\n  textDecoration: \"none\",\r\n};\r\n\r\nconst socialIcons = {\r\n  color: \"#000000\",\r\n  fontSize: \"20px\",\r\n};\r\n\r\n\r\nfunction Footer() {\r\n  const toggleHome = () => {\r\n    scroll.scrollToTop();\r\n  };\r\n\r\n  return (\r\n    <FooterContainer>\r\n      <FooterWrap>\r\n        <FooterLinksContainer>\r\n          <FooterLinksWrapper>\r\n            <FooterLinkItems>\r\n              <FooterLinkTitle>\r\n                <FooterLogo to=\"/\" onClick={toggleHome}>\r\n                  <img src={\"../../images/deempay-logo.svg\"} alt=\"logo\" />\r\n                </FooterLogo>\r\n              </FooterLinkTitle>\r\n              <FooterLink2 style={linkStyle} >294 Herbert Macaulay</FooterLink2>\r\n              <FooterLink2 style={linkStyle}>Way, Yaba 101212</FooterLink2>\r\n              <FooterLink2 style={linkStyle}>Lagos, Nigeria</FooterLink2>\r\n              <br />\r\n              <FooterLink2 style={linkStyle} >hello@deempay.com</FooterLink2>\r\n              <FooterLink2 style={linkStyle} >+234 8179470378</FooterLink2>\r\n            </FooterLinkItems>\r\n            <FooterLinkItems2>\r\n              <FooterLinkTitle>Our Solutions</FooterLinkTitle>\r\n              <FooterLink to=\"/deempay-app\" style={linkStyle} >DeemPay App</FooterLink>\r\n              <FooterLink to=\"/deempay-dashboard\" style={linkStyle} >DeemPay Dashboard</FooterLink>\r\n            </FooterLinkItems2>\r\n            <FooterLinkItems3>\r\n              <FooterLinkTitle>Company</FooterLinkTitle>\r\n              <FooterLink to=\"/about\" style={linkStyle} >About</FooterLink>\r\n              {/* <FooterLink to=\"/security\" style={linkStyle} >Security</FooterLink> */}\r\n              <FooterLink to=\"/careers\" style={linkStyle} >Careers</FooterLink>\r\n            </FooterLinkItems3>\r\n          </FooterLinksWrapper>\r\n          <FooterLinksWrapper2>\r\n            <FooterLinkItems4>\r\n              <FooterLinkTitle>Help</FooterLinkTitle>\r\n              <FooterLink\r\n                target=\"_blank\"\r\n                rel=\"noreferrer\"\r\n                to={\"//www.youtube.com/channel/UCR_nKmQ37Yp49aqyyItxW6A\"}\r\n                style={linkStyle} \r\n              >\r\n                Video Tutorial\r\n              </FooterLink>\r\n              <FooterLink to=\"/faq\" style={linkStyle} >FAQ</FooterLink>\r\n              <FooterLink to=\"/supportcenter\" style={linkStyle} >Support Center</FooterLink>\r\n              <FooterLink to=\"/blog\" style={linkStyle} >Blog</FooterLink>\r\n            </FooterLinkItems4>\r\n            <FooterLinkItems5>\r\n              <FooterLinkTitle>Legal</FooterLinkTitle>\r\n              <FooterLink to=\"/privacy\" style={linkStyle} >Privacy Policy</FooterLink>\r\n              <FooterLink to=\"/termsofservice\" style={linkStyle} >Terms of Service</FooterLink>\r\n              <SocialIcons>\r\n              <Link\r\n                style={socialIcons}\r\n                to={\r\n                  \"//www.linkedin.com/company/deempay/about/?viewAsMember=true\"\r\n                }\r\n                target=\"_blank\"\r\n                aria-label=\"LinkedIn\"\r\n              >\r\n                <FaLinkedin />\r\n              </Link>\r\n              <Link\r\n                style={socialIcons}\r\n                to={\"//twitter.com/deempay\"}\r\n                target=\"_blank\"\r\n                aria-label=\"Twitter\"\r\n              >\r\n                <FaTwitter />\r\n              </Link>\r\n\r\n              <Link\r\n                style={socialIcons}\r\n                to={\"//www.instagram.com/deempay_ng/\"}\r\n                target=\"_blank\"\r\n                aria-label=\"Instagram\"\r\n              >\r\n                <FaInstagram />\r\n              </Link>\r\n              <Link\r\n                style={socialIcons}\r\n                to={\"//www.facebook.com/DeemPay-120820392659915/\"}\r\n                target=\"_blank\"\r\n                aria-label=\"Facebook\"\r\n              >\r\n                <FaFacebook />\r\n              </Link>\r\n            </SocialIcons>\r\n            </FooterLinkItems5>\r\n          </FooterLinksWrapper2>\r\n        </FooterLinksContainer>\r\n        \r\n        <FooterLine />\r\n\r\n        <LastLine>\r\n          DeemPay Technology Limited (\"DeemPay\") is a Financial Technology Company duly registered with\r\n          the Corporate Affairs Commission of Nigeria (RC: 1770757), with our office at 294 Herbert Macaulay Way, Yaba, Lagos.\r\n        </LastLine>\r\n        <LastLine>\r\n          We help businesses accept payments via QR code and virtual bank transfer, we also customize solutions to meet different merchants needs. The Deempay QR code\r\n          are generated by Nigeria Interbank-settlment Scheme (NIBSS) while Wema Bank generates the virtual bank account, and any mobile bank app in Nigeria can \r\n          scan and equally transfer and make payments on it. \r\n        </LastLine>\r\n        <LastLine>\r\n        © {new Date().getFullYear()} DeemPay Technology Limited.\r\n        </LastLine>\r\n      </FooterWrap>\r\n    </FooterContainer>\r\n  );\r\n}\r\n\r\nexport default Footer;\r\n","import React, { useState } from \"react\";\r\nimport Sidebar from \"./components/Sidebar\";\r\nimport Navbar from \"./components/Navbar\";\r\nimport Footer from \"./components/Footer\";\r\n\r\n\r\nconst Routes = ({children}) => {\r\n  const [isOpen, setIsOpen] = useState(false);\r\n\r\n  const toggle = () => {\r\n    setIsOpen(!isOpen);\r\n  };\r\n\r\n  return (\r\n    <>\r\n\r\n      <div>\r\n        <main>\r\n        <Sidebar isOpen={isOpen} toggle={toggle} />\r\n        <Navbar toggle={toggle} />\r\n        {children}\r\n        </main>\r\n        \r\n\r\n        <Footer />\r\n      </div>\r\n     \r\n    </>\r\n  );\r\n};\r\n\r\nexport default Routes;\r\n","import styled from \"styled-components\";\r\n\r\nexport const Spin = styled.div`\r\n     display: flex;\r\n     align-items: center;\r\n     justify-content: center;\r\n`;\r\n\r\nexport const Img = styled.img`\r\n     width: auto;\r\n     height: auto;\r\n     max-width: 100%;\r\n     max-height: 100%;\r\n     left: 50%;\r\n     top: 50%;\r\n     margin: 350px auto;    \r\n     @media screen and (max-width: 480px) {\r\n        margin: 200px auto;    \r\n    \r\n  }\r\n`;","import styled from \"styled-components\";\r\n\r\nexport const InfoSec = styled.div`\r\n  color: #fff;\r\n  padding: 100px 0;\r\n  background: #ffffff;\r\n  @media screen and (max-width: 480px) {\r\n    padding: 40px 0;\r\n  }\r\n`;\r\n\r\nexport const Card = styled.div`\r\n  background: #1a71ff;\r\n  box-shadow: none;\r\n  border: none;\r\n  border-radius: 40px !important;\r\n  max-width: 1300px;\r\n  height: 311px;\r\n  padding-left: 60px;\r\n  padding-top: 69px;\r\n  padding-right: 20px;\r\n  text-decoration: none;\r\n  @media screen and (max-width: 1100px) {\r\n    height: 530px;\r\n    border-radius: 20px;\r\n    padding: 30px 40px;\r\n    margin-left: 0px;\r\n  }\r\n  @media screen and (max-width: 960px) {\r\n    height: 480px;\r\n    border-radius: 20px;\r\n    padding: 30px 40px;\r\n    margin-left: 0px;\r\n  }\r\n  @media screen and (max-width: 768px) {\r\n    height: 600px;\r\n    border-radius: 20px;\r\n    padding: 30px 40px;\r\n    margin-left: 0px;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    height: 360px;\r\n    border-radius: 20px;\r\n    padding: 30px 40px 30px 52px;\r\n    margin-left: 0px;\r\n  }\r\n  @media screen and (max-width: 375px) {\r\n    height: 380px;\r\n  }\r\n`;\r\n\r\nexport const InfoRow = styled.div`\r\n  display: flex;\r\n  margin: 0 -15px -15px -15px;\r\n  flex-wrap: wrap;\r\n  align-items: center;\r\n  flex-direction: ${({ imgStart }) => (imgStart ? \"row-reverse\" : \"row\")};\r\n`;\r\n\r\nexport const InfoColumn = styled.div`\r\n  margin-bottom: 15px;\r\n  padding-right: 15px;\r\n  padding-left: 15px;\r\n  flex: 1;\r\n  max-width: 50%;\r\n  flex-basis: 50%;\r\n  @media screen and (max-width: 1110px) {\r\n    max-width: 100%;\r\n    flex-basis: 100%;\r\n    display: flex;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const TextWrapper = styled.div`\r\n  max-width: 1040px;\r\n  padding-top: 0;\r\n  padding-bottom: 60px;\r\n`;\r\n\r\nexport const ImgWrapper = styled.div`\r\n  max-width: 600px;\r\n  display: flex;\r\n  justify-content: ${({ start }) => (start ? \"flex-start\" : \"flex-end\")};\r\n  @media screen and (max-width: 480px) {\r\n    display: none;\r\n  }\r\n`;\r\n\r\nexport const Img = styled.img`\r\n  padding-right: 0;\r\n  border: 0;\r\n  max-width: 100%;\r\n  vertical-align: middle;\r\n  display: inline-block;\r\n  max-height: 500px;\r\n  @media screen and (max-width: 960px) {\r\n    margin-top: -50px;\r\n  }\r\n  @media screen and (max-width: 768px) {\r\n    margin-top: -40px;\r\n  }\r\n  @media screen and (max-width: 495px) {\r\n    margin-top: 0px;\r\n  }\r\n`;\r\n\r\nexport const Heading = styled.h1`\r\n  margin-bottom: 35px;\r\n  font-size: 34px;\r\n  max-width: 400px;\r\n  line-height: 1.1;\r\n  font-weight: 600;\r\n  color: #fff;\r\n  @media screen and (max-width: 1000px) {\r\n    max-width: 100%;\r\n  }\r\n  @media screen and (max-width: 480px) {\r\n    font-size: 28px;\r\n  }\r\n`;\r\n\r\nexport const BtnWrap = styled.div`\r\n  display: flex;\r\n  max-width: 100%;\r\n  //justify-content: flex-start;\r\n  @media screen and (max-width: 670px) {\r\n    display: grid;\r\n    width: 100%;\r\n    max-width: 100%;\r\n    align-items: center;\r\n    justify-content: center;\r\n  }\r\n`;\r\n\r\nexport const AndriodImg = styled.span`\r\n  padding-right: 10px;\r\n`;\r\n","import React from \"react\";\r\nimport { Link } from \"react-router-dom\";\r\nimport { Container, Button22, Button44, ButtonGrey } from \"../../globalStyles\";\r\nimport {\r\n  InfoSec,\r\n  InfoRow,\r\n  InfoColumn,\r\n  TextWrapper,\r\n  Heading,\r\n  ImgWrapper,\r\n  Img,\r\n  BtnWrap,\r\n  AndriodImg,\r\n  Card,\r\n} from \"./HomeSection8Elements\";\r\n\r\nconst linkStyle = {\r\n  textDecoration: \"none\",\r\n};\r\n\r\nfunction HomeSection8({ lightBg, imgStart, start }) {\r\n  return (\r\n    <>\r\n      <InfoSec lightBg={lightBg}>\r\n        <Container>\r\n          <Card>\r\n            <InfoRow imgStart={imgStart}>\r\n              <InfoColumn>\r\n                <TextWrapper>\r\n                  <Heading>Start accepting payments in 3 minutes</Heading>\r\n                  <BtnWrap>\r\n                    <Link\r\n                      target=\"_blank\"\r\n                      to={\"//app.deempay.com/registration\"}\r\n                      style={linkStyle}\r\n                    >\r\n                      <Button44>Create free account</Button44>\r\n                    </Link>\r\n                    <Link\r\n                      target=\"_blank\"\r\n                      to={\r\n                        \"//play.google.com/store/apps/details?id=com.deempay.app\"\r\n                      }\r\n                      style={linkStyle}\r\n                    >\r\n                      <Button22>\r\n                        <AndriodImg>\r\n                          <img src=\"images/google-play.svg\" alt=\"App\" />\r\n                        </AndriodImg>\r\n                        Get Android App\r\n                      </Button22>\r\n                    </Link>\r\n                    <Link\r\n                      target=\"_blank\"\r\n                      to=\"//apps.apple.com/ng/app/deempay/id1660927213\" \r\n                      style={linkStyle}\r\n                    >\r\n                    <ButtonGrey>\r\n                      <AndriodImg>\r\n                          <img src=\"images/ios.svg\" alt=\"App\" />\r\n                        </AndriodImg>\r\n                        Get on iOS\r\n                      </ButtonGrey>\r\n                      </Link>\r\n                  </BtnWrap>\r\n                </TextWrapper>\r\n              </InfoColumn>\r\n              <InfoColumn>\r\n                <ImgWrapper start={start}>\r\n                  <Img src=\"images/Appss.png\" alt=\"Apps-group\" />\r\n                </ImgWrapper>\r\n              </InfoColumn>\r\n            </InfoRow>\r\n          </Card>\r\n        </Container>\r\n      </InfoSec>\r\n    </>\r\n  );\r\n}\r\n\r\nexport default HomeSection8;\r\n"],"sourceRoot":""}