{"version":3,"file":"components-titleWithImage-titleWithImage-f265af59ea32b743a606.js","mappings":"wKAoCA,UAhCuB,SAAC,GAAqB,IAAD,UAAlBA,EAAkB,EAAlBA,YACxB,OACE,gBAAC,gBAAD,KACE,gBAAC,IAAD,CAAKC,UAAU,QACZD,MAAAA,OAAA,EAAAA,EAAaE,OACZ,gBAAC,UAAD,CAAgBC,GAAI,GAAIC,GAAI,EAAGC,GAAI,EAAGC,GAAI,GACxC,gBAAC,YAAD,KACE,gBAAC,SAAD,CACE,WAAS,UACT,oBAAkB,OAClB,gBAAc,OACd,kBAAgB,OAEfN,MAAAA,GANH,UAMGA,EAAaE,YANhB,aAMG,EAAmBA,SAK3BF,MAAAA,GAAA,UAAAA,EAAaO,aAAb,mBAAoBC,YAApB,eAA0BC,MACzB,gBAAC,WAAD,CACEC,YAAaV,MAAAA,GAAF,UAAEA,EAAaO,aAAf,iBAAE,EAAoBC,YAAtB,aAAE,EAA0BC,IACvCL,GAAI,EACJC,GAAI,EACJC,GAAI,EACJL,UAAU,0B,wNCzBTU,EAAgBC,EAAAA,QAAAA,IAAAA,WAAH,+EAAGA,CAAH,sLAebC,GAAUD,EAAAA,EAAAA,SAAOE,EAAAA,GAAV,oFAAGF,CAAH,2ZAyBPG,EAAYH,EAAAA,QAAAA,IAAAA,WAAH,2EAAGA,CAAH,kEAMTI,EAASJ,EAAAA,QAAAA,GAAAA,WAAH,wEAAGA,CAAH,uhBAwCNK,GAAWL,EAAAA,EAAAA,SAAOE,EAAAA,GAAV,qFAAGF,CAAH,mNAKD,SAACM,GAAD,OAAWA,EAAMR","sources":["webpack://commercial-ultramar/./src/components/titleWithImage/titleWithImage.js","webpack://commercial-ultramar/./src/components/titleWithImage/titleWithImageStyles.js"],"sourcesContent":["import React from 'react';\nimport { Row } from 'react-bootstrap';\nimport * as Styled from './titleWithImageStyles';\n\nconst TitleWithImage = ({ sectionData }) => {\n  return (\n    <Styled.MainContainer>\n      <Row className=\"g-0\">\n        {sectionData?.text && (\n          <Styled.LeftCol xs={12} md={7} lg={6} xl={7}>\n            <Styled.HeaderDiv>\n              <Styled.Header\n                data-aos=\"fade-up\"\n                data-aos-duration=\"1000\"\n                data-aos-once=\"true\"\n                data-aos-offset=\"5px\"\n              >\n                {sectionData?.text?.text}\n              </Styled.Header>\n            </Styled.HeaderDiv>\n          </Styled.LeftCol>\n        )}\n        {sectionData?.image?.file?.url && (\n          <Styled.RightCol\n            $background={sectionData?.image?.file?.url}\n            md={5}\n            lg={6}\n            xl={5}\n            className=\"d-none d-md-block\"\n          ></Styled.RightCol>\n        )}\n      </Row>\n    </Styled.MainContainer>\n  );\n};\n\nexport default TitleWithImage;\n","import { Col } from 'react-bootstrap';\nimport styled from 'styled-components';\n\nexport const MainContainer = styled.div`\n  display: block;\n  position: relative;\n  margin-top: 220px;\n  @media (max-width: 1399px) {\n    margin-top: 210px;\n  }\n  @media (max-width: 1199px) {\n    margin-top: 310px;\n  }\n  @media (max-width: 991px) {\n    margin-top: 0;\n  }\n`;\n\nexport const LeftCol = styled(Col)`\n  height: 320px;\n  line-height: 300px;\n  padding: 0 100px 0 100px !important;\n  text-align: center;\n  background: linear-gradient(\n    to bottom,\n    rgba(0, 166, 232, 1) 0%,\n    rgba(0, 83, 157, 1) 100%\n  );\n  @media (max-width: 1399px) {\n    height: 250px;\n    line-height: 230px;\n  }\n  @media (max-width: 1199px) {\n    padding-left: 50px !important;\n    padding-right: 50px !important;\n  }\n  @media (max-width: 767px) {\n    height: auto;\n    padding: 30px 35px 50px 35px !important;\n    line-height: 33px;\n  }\n`;\n\nexport const HeaderDiv = styled.div`\n  display: inline-block;\n  vertical-align: middle;\n  line-height: 80px;\n`;\n\nexport const Header = styled.h1`\n  position: relative;\n  margin: 0;\n  padding: 0;\n  font-family: 'MrAlex', sans-serif;\n  font-size: 55px;\n  line-height: 55px;\n  text-transform: uppercase;\n  color: #fff;\n  @media (max-width: 1399px) {\n    font-size: 50px;\n    line-height: 50px;\n  }\n  @media (max-width: 1199px) {\n    font-size: 45px;\n    line-height: 45px;\n  }\n  @media (max-width: 991px) {\n    font-size: 40px;\n    line-height: 40px;\n  }\n  @media (max-width: 767px) {\n    font-size: 30px;\n    line-height: 33px;\n  }\n  :after {\n    content: '';\n    position: absolute;\n    left: 0;\n    right: 0;\n    bottom: -20px;\n    width: 75%;\n    height: 4px;\n    margin-left: auto;\n    margin-right: auto;\n    background: #ffc905;\n    border-radius: 4px;\n  }\n`;\n\nexport const RightCol = styled(Col)`\n  height: 320px;\n  border-left: 4px solid #fff;\n  background-repeat: no-repeat;\n  background-position: top center;\n  background: url(${(props) => props.$background}) no-repeat center center;\n  background-size: cover;\n  @media (max-width: 1399px) {\n    height: 250px;\n  }\n`;\n"],"names":["sectionData","className","text","xs","md","lg","xl","image","file","url","$background","MainContainer","styled","LeftCol","Col","HeaderDiv","Header","RightCol","props"],"sourceRoot":""}