{"version":3,"sources":["helper/ScrollToTop.js","components/common/element/elements.js","components/common/styles/global.js","components/common/styles/sidebar.js","components/common/Sidebar.js","components/common/styles/stickyMenu.js","components/common/StickyMenu.js","components/common/styles/mobileMenu.js","components/common/MobileMenu.js","components/styles/headerTwo.js","components/HeaderTwo.js","components/styles/heroSlider.js","components/HeroSlider.js","components/styles/aboutUs.js","components/AboutUs.js","components/styles/portfolioFilter.js","components/PortfolioFilter.js","components/styles/testimonialSlider.js","redux/actions/testimonial.js","redux/constants/testimonial.js","components/TestimonialSlider.js","redux/constants/commons.js","components/common/styles/backToTop.js","components/common/BackToTop.js","components/styles/footerTwo.js","components/FooterTwo.js","HomeOne.js","components/common/styles/breadcrumb.js","components/common/Breadcrumb.js","pages/buildingfacility/styles/buildFacility.js","pages/buildingfacility/BuildingFacilityDetails.js","pages/concierge/styles/concierge.js","pages/concierge/ConciergeService.js","pages/cleaning/styles/cleaning.js","pages/cleaning/CleaningService.js","pages/service/styles/service.js","pages/service/Services.js","pages/contact/styles/contact.js","redux/actions/contact.js","redux/constants/contact.js","pages/contact/Contact.js","pages/404/styles/pageNotFound.js","pages/404/PageNotFound.js","pages/shop/styles/product.js","redux/actions/product.js","redux/constants/product.js","pages/shop/Products.js","pages/gardening/styles/gardeningLandscaping.js","pages/gardening/GardeningLandscaping.js","pages/developer/styles/projectDeveloper.js","pages/developer/ProjectAndDeveloperService.js","pages/community/styles/community.js","components/styles/faqEvent.js","components/FaqEvent.js","pages/community/CommunityPortal.js","pages/investment/styles/investment.js","pages/investment/Investment.js","pages/clientsTestimonial/styles/testimonial.js","pages/clientsTestimonial/ClientsTestimonial.js","redux/reducers/product.js","redux/reducers/testimonial.js","redux/reducers/contact.js","redux/reducers/index.js","redux/store/index.js","helper/styles/fullPageLoader.js","helper/FullPageLoader.js","App.js","serviceWorker.js","index.js"],"names":["ScrollToTop","pathname","useLocation","useEffect","window","scrollTo","colors","fonts","GlobalStyle","createGlobalStyle","Styles","styled","div","Sidebar","sidebarBtn","document","getElementById","sidebarOverlay","sidebarBody","sidebarExit","addEventListener","e","preventDefault","classList","add","remove","href","className","id","to","src","alt","onClick","location","StickyMenu","stickyMenu","querySelector","scrollY","Container","fluid","Row","Col","md","data-toggle","MobileMenu","hmBtn","mdSidebarOverlay","mdSidebarBody","mdSidebarExit","toggle","querySelectorAll","forEach","button","content","nextElementSibling","contains","style","maxHeight","scrollHeight","sm","HeaderTwo","lg","Component","HeroSlider","props","state","sliders","a","axios","get","process","then","res","setState","data","catch","error","console","fetchAllProducts","settings","slidesPerView","loop","speed","autoplay","delay","disableOnInteraction","watchSlidesVisibility","effect","navigation","nextEl","prevEl","renderPrevButton","renderNextButton","this","length","map","i","key","substring","indexOf","sliderImg","sliderTitle","sliderDesc","AboutUs","useState","aboutUs","setAboutUs","err","Fragment","display","alignItems","aboutImg","dangerouslySetInnerHTML","__html","aboutDesc","aboutTagLine","PortfolioFilter","homePageService","setHomePageService","response","getHomePageService","buttons","children","items","j","target","getAttribute","k","Datas","secTitle","data-target","data-id","targetId","urlSlug","backgroundImage","serviceImg","serviceName","serviceDesc","getTestimonials","testimonials","type","payload","TestimonialSlider","useSelector","allTestimonials","dispatch","useDispatch","fetchAllTestimonials","spaceBetween","pagination","el","clickable","breakpoints","0","576","768","992","toUpperCase","testimonialTitle","testimonialDesc","authorImg","authorName","authorTitle","BackToTop","topBtn","startPosition","pageYOffset","distance","start","requestAnimationFrame","step","timestamp","t","b","c","progress","FooterTwo","footers","setFooters","getFooters","footerAddress","footerEmail","footerPhone","footerLocations","focusArea","focus","HomeOne","title","BreadcrumbBox","BuildingFacilityDetails","allServices","setAllServices","fetchAllServices","Tab","defaultActiveKey","Content","Pane","eventKey","service","serviceType","servicesIncl","serviceIncl","serviceTagLine","ConciergeService","CleaningService","Services","getContacts","contacts","Contact","allContacts","fetchAllContacts","contact","contactName","designation","phoneOne","phoneTwo","emailOne","PageNotFound","getProducts","products","connect","allProducts","productImg","productTitle","GardeningLandscaping","ProjectAndDeveloperService","FaqEvent","open","setOpen","featuresList","setFeaturesList","getFeatures","Button","aria-controls","aria-expanded","faqData","featureName","Collapse","in","featureDesc","CommunityPortal","communityWebPortalInfo","setCommunityWebPortalInfo","getPortalInfo","info","communityTagLine","communityDesc","investmentInfo","setInvestmentInfo","investmentAdditionalDisburseInfo","setInvestmentAdditionalDisburseInfo","getInvestmentInfo","getDisburseInfo","investServiceDesc","Table","bordered","responsive","invServiceTitle","invServiceSubTitle","st","size","val","hasDisburseFeature","hasClientExpense","ClientsTestimonial","Card","Body","Title","color","Text","initialState","loading","reducers","combineReducers","store","createStore","__REDUX_DEVTOOLS_EXTENSION__","FullPageLoader","ReactGA","initialize","App","pageview","search","exact","path","component","Investment","Product","Boolean","hostname","match","ReactDOM","render","navigator","serviceWorker","ready","registration","unregister","message"],"mappings":"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","file":"static/js/main.ec8aae37.chunk.js","sourcesContent":["import { useEffect } from \"react\";\nimport { useLocation } from \"react-router-dom\";\n\nexport default function ScrollToTop() {\n const { pathname } = useLocation();\n\n useEffect(() => {\n window.scrollTo(0, 0);\n }, [pathname]);\n\n return null;\n}\n","export const colors = {\n\n bg1: \"#182B49\",\n bg2: \"#F6F9FF\",\n // gr_bg: \"linear-gradient(90deg, #11B67A 0%, #009444 100%)\",\n gr_bg: \"linear-gradient(90deg, #21a3d1 0%, #00B4F5 100%)\",\n gr_bg2: \"linear-gradient(90deg, #00B4F5 0%, #21a3d1 100%)\",\n copy_bg: \"#122340\",\n blue: \"#2c97ea\",\n green: \"#21a3d1\",\n // green: \"#11B67A\",\n green2: \"#00B4F5\",\n // green2: \"#00a76a\",\n red: \"#ff6f6f\",\n purple: \"#84479c\",\n yellow: \"#fbab19\",\n black1: \"#182B49\",\n black2: \"#444444\",\n text1: \"#555555\",\n text2: \"#666666\",\n text3: \"#969696\",\n text4: \"#aaaaaa\",\n text5: \"#cccccc\",\n border1: \"#eeeeee\",\n border2: \"#3e3e3e\",\n border3: \"#dddddd\",\n footer1: \"#1a1b25\",\n footer2: \"#16171f\",\n ftext: \"#8D8E92\",\n light_blue: \"#00B4F5\"\n \n}\n\nexport const fonts = {\n roboto: \"'muli', sans-serif\",\n poppins: \"'muli', sans-serif\",\n\n}","\nimport { createGlobalStyle } from \"styled-components\";\nimport { colors, fonts } from \"../element/elements.js\";\n\nexport const GlobalStyle = createGlobalStyle`\n html {\n color : ${colors.bg1};\n font-size : 13px;\n line-height: 1.4;\n }\n\n ::-moz-selection {\n background : #b3d4fc;\n text-shadow: none;\n }\n\n ::selection {\n background : #b3d4fc;\n text-shadow: none;\n }\n\n hr {\n display : block;\n height : 1px;\n border : 0;\n border-top: 1px solid ${colors.border3};\n margin : 1em 0;\n padding : 0;\n }\n\n .custom-card {\n padding: 30px;\n box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;\n border-radius: 10px;\n } \n \n\n audio,\n canvas,\n iframe,\n img,\n svg,\n video {\n vertical-align: middle;\n }\n\n fieldset {\n border : 0;\n margin : 0;\n padding: 0;\n }\n\n textarea {\n resize: vertical;\n }\n\n body {\n font-size : 12px;\n background : #ffffff;\n color : ${colors.text1};\n letter-spacing: 0.3px;\n font-family : ${fonts.roboto};\n }\n\n h1,\n h1 a {\n font-size: 40px;\n }\n\n h2,\n h2 a {\n font-size: 32px;\n }\n\n h3,\n h3 a {\n font-size: 28px;\n }\n\n h4,\n h4 a {\n font-size: 24px;\n }\n\n h5,\n h5 a {\n font-size: 20px;\n }\n\n h6,\n h6 a {\n font-size: 16px;\n }\n\n h1,\n h1 a,\n h2,\n h2 a,\n h3,\n h3 a,\n h4,\n h4 a,\n h5,\n h5 a,\n h6,\n h6 a {\n font-family: ${fonts.poppins};\n margin : 0;\n }\n\n a,\n button,\n li,\n p {\n font-size : 13px;\n font-family : ${fonts.roboto};\n margin : 0;\n letter-spacing: 0.3px;\n }\n\n ul {\n padding: 0;\n margin : 0;\n }\n\n a,\n a:active,\n a:focus,\n a:hover,\n button:focus,\n button:hover {\n text-decoration: none;\n outline : none;\n }\n\n a,\n button {\n transition: all 0.2s ease;\n }\n\n input:focus,\n textarea:focus {\n outline: none;\n }\n\n .padding-fix {\n padding-left : 0;\n padding-right: 0;\n }\n\n .padding-fix-r {\n padding-right: 0;\n }\n\n .padding-fix-l {\n padding-left: 0;\n }\n\n .margin-fix {\n margin-left : 0;\n margin-right: 0;\n }\n`;","import styled from \"styled-components\";\nimport { colors } from \"../element/elements.js\";\n\nexport const Styles = styled.div`\n a.nav-sidebar {\n padding: 18px 0 0 10px;\n\n i {\n font-size: 20px;\n color : ${colors.border1};\n }\n }\n \n .sidebar {\n background-color: #ffffff;\n padding : 40px;\n height : 100%;\n width : 400px;\n position : fixed;\n top : 0;\n right : -470px;\n overflow-y : auto;\n z-index : 9999;\n transition : all 400ms cubic-bezier(0.785, 0.135, 0.15, 0.86);\n\n .side-logo {\n margin-bottom: 40px;\n\n a {\n i {\n font-size: 18px;\n color : ${colors.green};\n border : 1px solid ${colors.border1};\n padding : 6px;\n border-radius : 50%;\n\n &:hover {\n background : ${colors.green};\n color : #ffffff;\n border-color: ${colors.green};\n }\n }\n }\n }\n\n .side-content {\n h5 {\n color : ${colors.green};\n text-transform: uppercase;\n font-weight : 500;\n margin-bottom : 18px;\n position : relative;\n\n &::before {\n position : absolute;\n content : \"\";\n background: ${colors.border1};\n width : 60%;\n height : 1px;\n top : 11px;\n right : 0;\n }\n }\n\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height : 25px;\n margin-bottom: 30px;\n text-align: justify;\n }\n }\n\n .side-post {\n margin-bottom: 40px;\n\n h5 {\n color : ${colors.green};\n text-transform: uppercase;\n font-weight : 500;\n margin-bottom : 25px;\n position : relative;\n\n &::before {\n position : absolute;\n content : \"\";\n background: ${colors.border1};\n width : 50%;\n height : 1px;\n top : 11px;\n right : 0;\n }\n }\n\n .post-box {\n margin-bottom: 15px;\n\n .post-img {\n img {\n max-width: 90px;\n border-radius : 5px;\n margin-right: 15px;\n }\n }\n\n .post-title {\n p {\n font-size : 13px;\n color : ${colors.black2};\n font-weight : 500;\n margin-bottom: 6px;\n }\n\n span {\n font-size: 12px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n .side-gallery {\n margin-bottom: 32px;\n\n h5 {\n color : ${colors.green};\n text-transform: uppercase;\n font-weight : 500;\n margin-bottom : 25px;\n position : relative;\n\n &::before {\n position : absolute;\n content : \"\";\n background: ${colors.border1};\n width : 65%;\n height : 1px;\n top : 11px;\n right : 0;\n }\n }\n\n img {\n max-width: 96px;\n border-radius : 5px;\n margin-right : 5px;\n margin-bottom: 6px;\n }\n }\n\n .side-contact {\n margin-bottom: 20px;\n\n h5 {\n color : ${colors.green};\n text-transform: uppercase;\n font-weight : 500;\n margin-bottom : 15px;\n position : relative;\n\n &::before {\n position : absolute;\n content : \"\";\n background: ${colors.border1};\n width : 50%;\n height : 1px;\n top : 11px;\n right : 0;\n }\n }\n\n ul {\n li {\n font-size : 14px;\n color : ${colors.text2};\n margin-bottom: 12px;\n\n i {\n font-size : 18px;\n color : ${colors.green};\n margin-top : 1px;\n margin-right : 6px;\n vertical-align: text-bottom;\n float : left;\n height : 30px;\n }\n\n &:nth-child(3) {\n cursor : pointer;\n text-decoration : underline;\n\n &:hover {\n color: #00B4F5;\n }\n }\n }\n }\n }\n\n .side-social {\n ul {\n li {\n a {\n font-size : 13px;\n color : ${colors.green};\n display : inline-block;\n border : 1px solid ${colors.border1};\n width : 30px;\n height : 30px;\n text-align : center;\n padding-top: 5px;\n border-radius : 50%;\n\n &:hover {\n background : ${colors.green};\n border-color: ${colors.green};\n color : #fff;\n }\n }\n }\n }\n }\n }\n\n .sidebar.opened {\n right: 0 !important;\n }\n\n .sidebar-overlay {\n position : fixed;\n left : 0;\n top : 0;\n height : 100%;\n width : 100%;\n display : block;\n background-color: rgba(0, 0, 0, 0.8);\n z-index : 1111;\n visibility : hidden;\n opacity : 0;\n transition : 0.3s ease;\n }\n\n .sidebar-overlay.visible {\n visibility: visible;\n opacity : 1;\n }\n`;","import React, { useEffect } from 'react';\nimport { Link } from 'react-router-dom';\nimport { Styles } from \"./styles/sidebar.js\";\n\nfunction Sidebar() {\n useEffect(() => {\n const sidebarBtn = document.getElementById(\"sidebar-btn\");\n\n if (sidebarBtn) {\n const sidebarOverlay = document.getElementById(\"sidebar-overlay\");\n const sidebarBody = document.getElementById(\"sidebar-body\");\n const sidebarExit = document.getElementById(\"close-sidebar\");\n\n sidebarBtn.addEventListener(\"click\", function (e) {\n e.preventDefault();\n sidebarOverlay.classList.add(\"visible\");\n sidebarBody.classList.add(\"opened\");\n });\n\n sidebarOverlay.addEventListener(\"click\", function (e) {\n e.preventDefault();\n sidebarOverlay.classList.remove(\"visible\");\n sidebarBody.classList.remove(\"opened\");\n });\n\n sidebarExit.addEventListener(\"click\", function (e) {\n e.preventDefault();\n sidebarOverlay.classList.remove(\"visible\");\n sidebarBody.classList.remove(\"opened\");\n });\n }\n });\n\n return (\n \n {/* Sidebar */}\n \n \n \n\n
\n
\n
\"\"
\n
\n
\n
\n
About Us
\n

REAL Facilities Management Pty Ltd is an Australian owned, integrated, and independent property facility management organisation with combined management experience of over 60 years.

\n
\n \n
\n
Gallery
\n \"\"\n \"\"\n \"\"\n \"\"\n \"\"\n \"\"\n
\n
\n
Contact Us
\n
    \n
  • Terrace 7, 82-86 Pacific Highway, St Leonards NSW 2065
    • \n
  • +612 9930 0730
    • \n
  • window.location = 'mailto:admin@realfm.net.au?subject=Email From Website&body=Dear Concerned, %0A '}>admin@realfm.net.au
    • \n
\n
\n
\n
    \n
    • \n
\n
\n
\n
\n \n )\n}\n\nexport default Sidebar\n","import styled from \"styled-components\";\nimport { colors } from \"../element/elements.js\";\n\nexport const Styles = styled.div`\n .sticky-menu {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n z-index: 11;\n animation: 300ms ease-in-out 0s normal none 1 fadeInDown;\n background: #ffffff;\n height: 75px;\n padding-top: 18px;\n box-shadow: 0 0 20px -10px #222222;\n\n .logo {\n a {\n img {\n @media(max-width: 1199px) {\n max-width : 100%;\n }\n }\n }\n }\n\n div.menu-box {\n ul.nav.menu-nav {\n li.nav-item {\n position: relative;\n\n a.nav-link {\n font-size : 14px;\n color : ${colors.black1};\n text-transform: uppercase;\n font-weight : 500;\n padding : 10px 10px 20px;\n\n i {\n font-size: 12px;\n }\n\n &:after {\n content: none;\n }\n\n &:hover {\n color: ${colors.green};\n }\n\n @media(max-width: 1199px) {\n padding-left : 0;\n padding-right: 8px;\n }\n\n @media(max-width: 991px) {\n padding-right: 6px;\n }\n }\n\n ul.dropdown {\n position : absolute;\n left : 0;\n top : 100%;\n min-width : 190px;\n background: #fff;\n border : 1px solid ${colors.border1};\n text-align: left;\n padding : 0;\n border-radius : 5px;\n transition : 0.2s ease;\n opacity : 0;\n transform : scaleY(0);\n visibility : hidden;\n z-index : 999;\n transform-origin: center top 0;\n\n li.nav-item {\n position: relative;\n\n a.nav-link {\n font-size : 13px;\n color : ${colors.text1};\n padding : 10px 20px;\n text-transform: capitalize;\n font-weight : 400;\n margin-right : 0;\n border-bottom : 1px solid ${colors.border1};\n\n &:hover {\n color: ${colors.green};\n\n i {\n color: #fff;\n }\n }\n\n i {\n float : right;\n margin-top: 4px;\n }\n }\n\n &:last-child {\n margin-left: 0;\n\n a.nav-link {\n border-bottom: none;\n }\n }\n\n ul.dropdown2 {\n position : absolute;\n top : 0;\n left : 100%;\n min-width : 180px;\n background: #fff;\n border : 1px solid ${colors.border1};\n transition : 0.2s ease;\n opacity : 0;\n transform : scaleY(0);\n visibility : hidden;\n z-index : 999;\n transform-origin: center top 0;\n }\n\n &:hover {\n ul.dropdown2 {\n opacity : 1;\n transform : scaleY(1);\n visibility: visible;\n }\n }\n }\n }\n\n &:hover {\n ul.dropdown {\n opacity : 1;\n transform : scaleY(1);\n visibility: visible;\n }\n }\n }\n }\n\n .apply-btn {\n margin-left: 70px;\n margin-top : -1px;\n\n a {\n font-size : 13px;\n color : #ffffff;\n background : ${colors.gr_bg};\n display : inline-block;\n width : 110px;\n height : 40px;\n text-align : center;\n text-transform: uppercase;\n font-weight : 500;\n padding : 11px;\n border-radius : 0 5px 5px 0;\n position: relative;\n\n i {\n position : absolute;\n font-size: 20px;\n left : -40px;\n top : 0;\n padding : 10px;\n width : 40px;\n height : 100%;\n border-radius : 5px 0 0 5px;\n background-color: ${colors.green2};\n }\n\n &:hover {\n background: ${colors.gr_bg2};\n }\n }\n\n @media(max-width: 1199px) {\n margin-left: 45px;\n }\n\n @media(max-width: 991px) {\n display : none;\n }\n }\n }\n @media(max-width: 767px) {\n display: none;\n }\n }\n .sticky-menu.sticky {\n display: block;\n \n @media(max-width: 767px) {\n display: none;\n }\n }\n`;","import React, { useEffect } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport { Container, Row, Col } from 'react-bootstrap';\r\nimport { Styles } from \"./styles/stickyMenu.js\";\r\n\r\nfunction StickyMenu() {\r\n useEffect(() => {\r\n // document.title = \"Our Experience || REAL FM\"\r\n window.addEventListener(\"scroll\", () => {\r\n const stickyMenu = document.querySelector(\".sticky-menu\");\r\n\r\n if (window.scrollY > 160) {\r\n stickyMenu.classList.add(\"sticky\");\r\n } else {\r\n stickyMenu.classList.remove(\"sticky\");\r\n }\r\n });\r\n });\r\n\r\n return (\r\n \r\n {/* Sticky Menu */}\r\n
\r\n \r\n \r\n \r\n
\r\n \"\"\r\n
\r\n \r\n \r\n
\r\n
    \r\n
  • \r\n Home \r\n
    • \r\n
  • \r\n Our Services \r\n
      \r\n
    • Building & Facilities Management Services
      • \r\n
    • Concierge Services
      • \r\n
    • Cleaning Services
      • \r\n
    • Gardening and Landscaping Services
      • \r\n
    \r\n
    • \r\n
  • \r\n Developers \r\n
    • \r\n
  • \r\n Community Web Portal \r\n
    • \r\n \r\n {/*
  • \r\n Facilities Management\r\n
    • */}\r\n
  • \r\n Our Experience \r\n
    • \r\n
  • \r\n Our Clients Say \r\n
    • \r\n
  • \r\n Investment \r\n
    • \r\n
  • \r\n Contact Us\r\n
    • \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default StickyMenu","import styled from \"styled-components\";\nimport { colors } from \"../element/elements.js\";\n\nexport const Styles = styled.div`\n.mobile-menu-area {\n background : ${colors.bg1};\n display: none;\n .mb-topbar {\n border-bottom: 1px solid ${colors.black2};\n .topbar-item {\n p {\n font-size: 13px;\n color: ${colors.text4};\n padding: 8px 0;\n i {\n font-size: 16px;\n color: ${colors.green};\n vertical-align: text-top;\n margin-right: 5px;\n }\n }\n ul {\n padding: 8px 0;\n li {\n a {\n font-size : 13px;\n color : ${colors.green};\n font-weight : 500;\n text-transform : uppercase;\n &:hover {\n color : #ffffff;\n }\n }\n &:nth-child(2) {\n color : ${colors.text3};\n }\n }\n }\n }\n }\n\n .mb-logo-area {\n padding : 18px 0;\n .mb-logo-box {\n .hm-button {\n margin-top: 8px;\n margin-right: 35px;\n position: relative;\n &:before {\n position: absolute;\n content : \"\";\n background : ${colors.text1};\n width: 1px;\n height: 25px;\n top: -4px;\n right: -16px;\n }\n a#mb-sidebar-btn {\n i {\n font-size : 20px;\n color : ${colors.green};\n }\n }\n\n @media(max-width: 480px) {\n margin-top: 6px;\n margin-right: 8px;\n &:before {\n content : none;\n }\n }\n }\n .mb-logo {\n a {\n img {\n max-width: 150px;\n @media(max-width: 480px) {\n max-width : 120px;\n }\n }\n }\n }\n }\n\n .mb-search-box {\n form {\n width: 170px;\n position: relative;\n input {\n width: 100%;\n height: 35px;\n border: 1px solid ${colors.text2};\n background: transparent;\n color : #ffffff;\n border-radius: 5px;\n padding-left: 15px;\n &::placeholder {\n font-size : 14px;\n color : ${colors.text3};\n }\n &:focus {\n border-color : ${colors.green};\n }\n\n @media(max-width: 480px) {\n max-width : 280px;\n }\n\n @media(max-width: 320px) {\n display : none;\n }\n }\n button {\n position: absolute;\n top: 0;\n right: 0;\n height: 100%;\n width: 40px;\n background: transparent;\n border: none;\n font-size: 16px;\n color: ${colors.green};\n i {\n\n }\n\n @media(max-width: 320px) {\n display : none;\n }\n }\n\n @media(max-width: 480px) {\n max-width : 130px;\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n display : block;\n }\n}\n\n.mb-sidebar {\n background: #ffffff;\n height: 100%;\n width: 320px;\n position: fixed;\n top : 0;\n left: -320px;\n overflow-y: auto;\n z-index: 9999;\n transition: all 400ms cubic-bezier(0.785,0.135,0.15,0.86);\n display: none;\n .mb-sidebar-heading {\n background: ${colors.gr_bg};\n padding: 25px;\n h5 {\n color: #ffffff;\n text-transform: uppercase;\n }\n a#close-mb-sidebar {\n i {\n font-size : 22px;\n color : #ffffff;\n }\n }\n }\n .mb-sidebar-menu {\n padding: 25px;\n .mb-menu-item {\n border-top: 1px solid ${colors.border1};\n &:last-child {\n border-bottom: 1px solid ${colors.border1};\n }\n button.mb-menu-button {\n border : none;\n background : transparent;\n display : block;\n width : 100%;\n padding : 10px 0;\n text-align : left;\n\n p {\n font-size : 14px;\n color : ${colors.black1};\n text-transform: uppercase;\n i {\n font-size: 13px;\n float: right;\n border: 1px solid ${colors.border3};\n border-radius: 25px;\n padding: 3px;\n }\n &:hover {\n color : ${colors.green};\n i {\n border-color : ${colors.green};\n }\n }\n }\n }\n\n .mb-menu-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n\n ul {\n li {\n border-top: 1px solid ${colors.border1};\n a {\n font-size : 13px;\n color : ${colors.black2};\n display : block;\n padding : 10px 0;\n padding-left: 15px;\n &:hover {\n color : ${colors.green};\n }\n }\n }\n }\n }\n\n .mb-menu-content.show {\n max-height: 100%;\n }\n }\n }\n\n @media(max-width: 767px) {\n display : block;\n }\n\n @media(max-width: 480px) {\n max-width: 275px;\n }\n}\n\n.mb-sidebar.opened {\n left: 0 !important;\n}\n\n.mb-sidebar-overlay {\n position : fixed;\n left : 0;\n top : 0;\n height : 100%;\n width : 100%;\n display : block;\n background-color: rgba(0, 0, 0, 0.8);\n z-index : 1111;\n visibility : hidden;\n opacity : 0;\n transition : 0.3s ease;\n}\n\n.mb-sidebar-overlay.visible {\n visibility: visible;\n opacity : 1;\n}\n`;","import React, { useEffect } from 'react';\nimport { Link } from 'react-router-dom';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport { Styles } from \"./styles/mobileMenu.js\";\n\nfunction MobileMenu() {\n useEffect(() => {\n // Mobile Menu\n const hmBtn = document.getElementById(\"mb-sidebar-btn\");\n\n if (hmBtn) {\n const mdSidebarOverlay = document.getElementById(\"mb-sidebar-overlay\");\n const mdSidebarBody = document.getElementById(\"mb-sidebar-body\");\n const mdSidebarExit = document.getElementById(\"close-mb-sidebar\");\n\n hmBtn.addEventListener(\"click\", function (e) {\n e.preventDefault();\n mdSidebarOverlay.classList.toggle(\"visible\");\n mdSidebarBody.classList.toggle(\"opened\");\n });\n\n mdSidebarOverlay.addEventListener(\"click\", function (e) {\n e.preventDefault();\n mdSidebarOverlay.classList.remove(\"visible\");\n mdSidebarBody.classList.remove(\"opened\");\n });\n\n mdSidebarExit.addEventListener(\"click\", function (e) {\n e.preventDefault();\n mdSidebarOverlay.classList.remove(\"visible\");\n mdSidebarBody.classList.remove(\"opened\");\n });\n }\n\n // Menu Accordion -----------------\n const menuButton = document.querySelectorAll(\".mb-menu-button\");\n menuButton.forEach(button => {\n button.addEventListener(\"click\", () => {\n button.classList.toggle(\"active\");\n const content = button.nextElementSibling;\n\n if (button.classList.contains(\"active\")) {\n content.className = \"mb-menu-content show\";\n content.style.maxHeight = content.scrollHeight + \"px\";\n } else {\n content.className = \"mb-menu-content\";\n content.style.maxHeight = \"0\";\n }\n });\n });\n });\n\n return (\n \n {/* Mobile Menu */}\n
\n \n \n \n
\n
\n

+612 9930 0730

\n
\n \n
\n
\n
\n
\n \n \n \n
\n
\n \"\"\n
\n
\n \n
\n \n \n \n
\n\n {/* Mobile Menu Sidebar */}\n
\n
\n
Menu
\n
\n
\n
\n
\n \n
\n
    \n
  • Home
    • \n
\n
\n
\n
\n \n
\n
    \n
  • Building & Facilities Management Services
    • \n
  • Concierge Services
    • \n
  • Cleaning Services
    • \n
  • Gardening and Landscaping Services
    • \n
\n
\n
\n \n
\n \n
\n
    \n
  • Developers
    • \n \n
\n
\n
\n
\n \n
\n
    \n
  • Community Web Portal
    • \n \n
\n
\n
\n {/*
\n \n
\n
    \n
  • Facilities Management
    • \n \n
\n
\n
*/}\n
\n \n
\n
    \n
  • Our Clients Say
    • \n \n
\n
\n
\n
\n \n
\n
    \n
  • Our Experience
    • \n \n
\n
\n
\n
\n \n
\n
    \n
  • Investment
    • \n \n
\n
\n
\n
\n \n
\n
    \n
  • Contact Us
    • \n \n
\n
\n
\n
\n
\n
\n \n )\n}\n\nexport default MobileMenu","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n .top-bar2 {\n height : 40px;\n border-bottom: 1px solid ${colors.border1};\n\n .bar-left {\n margin-top: 8px;\n\n ul {\n li {\n font-size : 14px;\n color : ${colors.text2};\n margin-right: 20px;\n display : inline-block;\n\n i {\n font-size : 18px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 5px;\n\n @media(max-width: 1199px) {\n margin-right : 2px;\n }\n }\n\n &:nth-child(2) {\n cursor : pointer;\n text-decoration : underline;\n }\n @media(max-width: 1199px) {\n margin-right : 8px;\n }\n\n @media(max-width: 991px) {\n font-size : 13px;\n }\n }\n }\n }\n\n .bar-right {\n margin-top: 6px;\n\n ul.bar-lang {\n margin-right: 30px;\n position : relative;\n margin-top : 3px;\n\n &::before {\n position : absolute;\n content : \"\";\n background: ${colors.border1};\n width : 1px;\n height : 20px;\n top : 0;\n right : -15px;\n }\n\n li {\n .dropdown {\n button.dropdown-toggle {\n font-size : 13px;\n color : ${colors.text2};\n background: transparent;\n border : none;\n padding : 0;\n box-shadow: none;\n\n img {\n margin-right: 5px;\n max-width : 21px;\n }\n\n i {\n font-size : 12px;\n margin-left: 3px;\n }\n\n &::after {\n display: none;\n }\n\n &:hover {\n cursor: pointer;\n color : ${colors.green};\n }\n }\n\n ul.dropdown-menu {\n padding : 0;\n margin : 0;\n border : none;\n background-color: #ffffff;\n border-radius : 5px;\n top : 50% !important;\n left : -16px !important;\n box-shadow: 0 0 2px rgba(0, 0, 0, 0.2);\n\n li {\n display : block;\n border-bottom: 1px solid ${colors.border1};\n padding : 7px 15px;\n color : ${colors.text3};\n cursor : pointer;\n\n img {\n max-width : 21px;\n margin-right: 5px;\n }\n\n &:hover {\n color : ${colors.black1};\n font-weight : 500;\n background-color: transparent;\n }\n\n &:last-child {\n border-bottom: none;\n }\n }\n }\n }\n }\n }\n\n ul.bar-social {\n margin-right: 30px;\n position : relative;\n\n &::before {\n position : absolute;\n content : '';\n background: ${colors.border1};\n width : 1px;\n height : 20px;\n top : 3px;\n right : -15px;\n }\n\n li {\n a {\n font-size : 13px;\n color : ${colors.green};\n background : ${colors.border1};\n display : inline-block;\n width : 25px;\n height : 25px;\n text-align : center;\n padding-top: 3px;\n border-radius : 5px;\n\n &:hover {\n background: ${colors.green};\n color : #ffffff;\n }\n }\n\n &:last-child {\n a {\n margin-right: 0;\n }\n }\n }\n\n @media(max-width: 991px) {\n display: none;\n }\n }\n\n ul.sidebar-button {\n li.side-box {\n a.nav-link {\n font-size : 20px;\n padding : 0;\n line-height: 28px;\n i {\n color : ${colors.green};\n }\n }\n }\n }\n }\n \n @media(max-width: 767px) {\n display: none;\n }\n }\n\n .logo-area2 {\n height : 82px;\n padding-top: 20px;\n\n .logo {\n a {\n img {\n @media(max-width: 991px) {\n max-width: 100%;\n }\n }\n }\n }\n\n div.menu-box {\n ul.nav.menu-nav {\n li.nav-item {\n position: relative;\n\n a.nav-link {\n font-size : 14px;\n color : ${colors.black1};\n text-transform: uppercase;\n font-weight : 500;\n padding : 10px 10px 20px;\n\n i {\n font-size: 12px;\n }\n\n &:after {\n content: none;\n }\n\n &:hover {\n color: ${colors.green};\n }\n\n @media(max-width: 1199px) {\n padding: 10px 2px 20px;\n letter-spacing: 0;\n }\n }\n\n ul.dropdown {\n position : absolute;\n left : 0;\n top : 100%;\n min-width : 190px;\n background: #fff;\n border : 1px solid ${colors.border1};\n text-align: left;\n padding : 0;\n border-radius : 5px;\n transition : 0.2s ease;\n opacity : 0;\n transform : scaleY(0);\n visibility : hidden;\n z-index : 999;\n transform-origin: center top 0;\n\n li.nav-item {\n position: relative;\n\n a.nav-link {\n font-size : 13px;\n color : ${colors.text1};\n padding : 10px 20px;\n text-transform: capitalize;\n font-weight : 400;\n margin-right : 0;\n border-bottom : 1px solid ${colors.border1};\n\n &:hover {\n color: ${colors.green};\n\n i {\n color: #fff;\n }\n }\n\n i {\n float : right;\n margin-top: 4px;\n }\n }\n\n &:last-child {\n margin-left: 0;\n\n a.nav-link {\n border-bottom: none;\n }\n }\n\n ul.dropdown2 {\n position : absolute;\n top : 0;\n left : 100%;\n min-width : 180px;\n background: #fff;\n border : 1px solid ${colors.border1};\n transition : 0.2s ease;\n opacity : 0;\n transform : scaleY(0);\n visibility : hidden;\n z-index : 999;\n transform-origin: center top 0;\n }\n\n &:hover {\n ul.dropdown2 {\n opacity : 1;\n transform : scaleY(1);\n visibility: visible;\n }\n }\n }\n }\n\n &:hover {\n ul.dropdown {\n opacity : 1;\n transform : scaleY(1);\n visibility: visible;\n }\n }\n }\n }\n\n .search-box {\n margin-left: 18px;\n margin-top : 11px;\n\n a {\n padding: 0;\n\n i {\n font-size: 18px;\n color : ${colors.green};\n }\n }\n\n i.close-btn {\n position : absolute;\n top : 25px;\n right : -12px;\n font-size: 26px;\n color : ${colors.green};\n cursor : pointer;\n }\n\n @media(max-width: 1199px) {\n margin-left : 5px;\n }\n }\n\n .apply-btn {\n margin-left: 70px;\n margin-top : -1px;\n\n a {\n font-size : 13px;\n color : #ffffff;\n background : ${colors.gr_bg};\n display : inline-block;\n width : 110px;\n height : 40px;\n text-align : center;\n text-transform: uppercase;\n font-weight : 500;\n padding : 11px;\n border-radius : 0 5px 5px 0;\n position: relative;\n\n i {\n position : absolute;\n font-size: 20px;\n left : -40px;\n top : 0;\n padding : 10px;\n width : 40px;\n height : 100%;\n border-radius : 5px 0 0 5px;\n background-color: ${colors.green2};\n }\n\n &:hover {\n background: ${colors.gr_bg2};\n }\n }\n\n @media(max-width: 991px) {\n display : none;\n }\n }\n }\n\n @media(max-width: 767px) {\n display: none;\n }\n }\n`;","import React, { Component } from 'react';\r\nimport { Link } from 'react-router-dom';\r\nimport { Container, Row, Col } from 'react-bootstrap';\r\nimport Sidebar from './common/Sidebar';\r\nimport StickyMenu from './common/StickyMenu';\r\nimport MobileMenu from './common/MobileMenu';\r\nimport { Styles } from \"./styles/headerTwo.js\";\r\n\r\nclass HeaderTwo extends Component {\r\n render() {\r\n return (\r\n \r\n {/* Topbar 2 */}\r\n
\r\n \r\n \r\n \r\n
\r\n
    \r\n
  • 02 9930 0730
    • \r\n
  • window.location = 'mailto:bdm@realfm.net.au?subject=Email From Website&body=Dear Concerned, %0A '}>bdm@realfm.net.au
    • \r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n
    \r\n \r\n
    • \r\n
\r\n\r\n
    \r\n
  • \r\n \r\n
    • \r\n
\r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {/* Logo Area 2 */}\r\n
\r\n \r\n \r\n \r\n
\r\n \"\"\r\n
\r\n \r\n \r\n
\r\n
    \r\n
  • \r\n Home\r\n
    • \r\n
  • \r\n Our Services \r\n
      \r\n
    • Building & Facilities Management Services
      • \r\n
    • Concierge Services
      • \r\n
    • Cleaning Services
      • \r\n
    • Gardening and Landscaping Services
      • \r\n
    \r\n
    • \r\n\r\n
  • \r\n Developers\r\n
    • \r\n
  • \r\n Community Web Portal\r\n
    • \r\n {/*
  • \r\n Facilities Management\r\n
    • */}\r\n
  • \r\n Our Experience\r\n
    • \r\n
  • \r\n Our Clients Say\r\n
    • \r\n
  • \r\n Investment\r\n
    • \r\n
  • \r\n Contact Us\r\n
    • \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {/* Sticky Menu */}\r\n \r\n\r\n {/* Mobile Menu */}\r\n \r\n \r\n )\r\n }\r\n}\r\n\r\nexport default HeaderTwo\r\n","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n .hero-slider-area {\n .swiper-container {\n position: relative;\n\n .swiper-wrapper {\n .swiper-slide.slider-item {\n position: relative;\n\n .image-container {\n width : 100%;\n display : block;\n overflow: hidden;\n position: relative;\n height : 700px;\n\n img.slider-image {\n width : auto;\n margin-top: 0;\n transition : all 6000ms linear;\n transform: scale(1);\n }\n\n @media(max-width: 767px) {\n height : 450px;\n }\n\n @media(max-width: 575px) {\n height : 360px;\n }\n }\n\n .slider-table {\n display : table;\n width : 100%;\n height : 100%;\n position: absolute;\n top : 0;\n left : 0;\n z-index : 9999;\n\n .slider-tablecell {\n display : table-cell;\n vertical-align: middle;\n\n .slider-box {\n .slider-title {\n p {\n font-size : 18px;\n color : ${colors.border3};\n text-transform: uppercase;\n margin-bottom : 8px;\n }\n }\n\n .slider-desc {\n h1 {\n font-size : 46px;\n color : #ffffff;\n max-width : 700px;\n margin-bottom: 32px;\n font-weight : 600;\n\n @media(max-width: 767px) {\n font-size : 26px;\n font-weight : 500;\n }\n }\n }\n\n .slider-btn {\n a.slider-btn1 {\n font-size : 14px;\n color : #fff;\n background: ${colors.gr_bg};\n display : inline-block;\n width : 145px;\n height : 40px;\n text-align: center;\n padding : 11px;\n border-radius : 5px;\n\n &:hover {\n background: ${colors.gr_bg2};\n }\n }\n\n a.slider-btn2 {\n font-size : 14px;\n color : #fff;\n display : inline-block;\n background: ${colors.bg1};\n width : 145px;\n height : 40px;\n text-align: center;\n padding : 11px;\n border-radius : 5px;\n margin-left: 15px;\n\n &:hover {\n background: ${colors.gr_bg};\n border : none;\n color : #ffffff;\n }\n }\n }\n @media(max-width: 575px) {\n text-align : center !important;\n }\n }\n\n ${'' /* .slider-box2 {\n .slider-desc {\n h1 {\n margin-left: auto;\n }\n }\n } */}\n }\n }\n }\n\n .swiper-slide.slider-item.swiper-slide-visible.swiper-slide-active {\n .image-container {\n img.slider-image {\n transform: scale(1.15);\n }\n }\n\n .slider-table {\n .slider-tablecell {\n .slider-title {\n animation-name : fadeInDown;\n animation-duration : 1s;\n animation-delay : 0.2s;\n animation-fill-mode: both;\n }\n\n .slider-desc {\n animation-name : fadeInUp;\n animation-duration : 1.5s;\n animation-delay : 0.2s;\n animation-fill-mode: both;\n }\n\n .slider-btn {\n animation-name : fadeInUp;\n animation-duration : 2s;\n animation-delay : 0.2s;\n animation-fill-mode: both;\n }\n }\n }\n }\n }\n\n .swiper-btn {\n position : absolute;\n top : 50%;\n left : 40px;\n width : 45px;\n height : 45px;\n font-size : 24px;\n color : ${colors.border1};\n text-align : center;\n padding-top: 5px;\n border-radius : 5px;\n transition : all 0.3s ease;\n margin-top: -35px;\n z-index : 111;\n\n i {}\n\n &:hover {\n background: ${colors.gr_bg};\n color : #ffffff;\n }\n }\n\n .swiper-btn.slider-button-next {\n left : inherit;\n right: 40px;\n }\n }\n }\n`;","import React, { Component } from 'react';\nimport { Link } from 'react-router-dom';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport Swiper from 'react-id-swiper';\nimport { Styles } from \"./styles/heroSlider.js\";\nimport axios from 'axios';\n\nclass HeroSlider extends Component {\n constructor(props) {\n super(props);\n this.state = {sliders: []}\n }\n\n componentDidMount() {\n const fetchAllProducts = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/sliders/find-all`).then((res) => {\n // console.log(\"Slider\" + res.data);\n this.setState({sliders: res.data});\n }).catch(error => {\n console.error(error);\n });\n };\n fetchAllProducts();\n }\n render() {\n const settings = {\n slidesPerView: 1,\n loop: true,\n speed: 3000,\n autoplay: {\n delay: 3000,\n disableOnInteraction: false\n },\n watchSlidesVisibility: true,\n effect: 'fade',\n navigation: {\n nextEl: '.slider-button-next',\n prevEl: '.slider-button-prev'\n },\n renderPrevButton: () => (\n
\n ),\n renderNextButton: () => (\n
\n )\n };\n\n return (\n \n {/* Hero Slider */}\n
\n \n {\n this.state.sliders !== null && this.state.sliders.length > 0 ? this.state.sliders.map((data, i) => (\n
\n
\n {data.sliderTitle}\n {/* {data.backgroundImage} */}\n
\n
\n
\n \n \n \n
\n
\n

{data.sliderTitle}

\n
\n
\n

{data.sliderDesc}

\n
\n
\n Contact Us\n Our Services\n
\n
\n \n \n \n
\n
\n
\n )) : \"\"\n }\n \n
\n \n )\n }\n}\n\nexport default HeroSlider\n","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n .about-us {\n padding: 78px 0 85px;\n \n .about-image {\n position: relative;\n \n img.main-img {\n width : 90%;\n border-radius: 5px;\n\n @media(max-width: 767px) {\n display : none;\n }\n }\n\n img.pattern-img {\n position: absolute;\n top : 100%;\n left : 0;\n\n @media(max-width: 1199px) {\n max-width : 100%;\n }\n\n @media(max-width: 767px) {\n display : none;\n }\n }\n\n .video-player {\n position : absolute;\n bottom : -83px;\n right : 0;\n width : 205px;\n height : 255px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px;\n\n &::before {\n position : absolute;\n content : '';\n background-color: rgba(0, 0, 0, 0.2);\n width : 100%;\n height : 100%;\n top : 0;\n left : 0;\n border-radius : 5px;\n }\n\n button.play-button {\n position : absolute;\n z-index : 10;\n top : 50%;\n left : 50%;\n transform : translateX(-50%) translateY(-50%);\n box-sizing: content-box;\n display : block;\n width : 32px;\n height : 44px;\n border-radius : 50%;\n\n i {\n position : relative;\n font-size : 40px;\n color : ${colors.bg1};\n z-index : 11;\n padding-top: 2px;\n margin-left: -2px;\n }\n\n &::before {\n content : \"\";\n position : absolute;\n z-index : 0;\n left : 50%;\n top : 50%;\n transform : translateX(-50%) translateY(-50%);\n display : block;\n width : 70px;\n height : 70px;\n background: #ffffff;\n border-radius : 50%;\n animation: pulse-border 1500ms ease-out infinite;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n z-index : 1;\n left : 50%;\n top : 50%;\n transform : translateX(-50%) translateY(-50%);\n display : block;\n width : 70px;\n height : 70px;\n background: #ffffff;\n border-radius : 50%;\n transition : all 200ms;\n }\n\n &:hover {\n i {\n color: ${colors.green};\n }\n }\n\n @keyframes pulse-border {\n 0% {\n transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);\n opacity : 1;\n }\n\n 100% {\n transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);\n opacity : 0;\n }\n }\n }\n\n @media(max-width: 991px) {\n bottom: -70%;\n }\n\n @media(max-width: 767px) {\n position: unset;\n width: 100%;\n height: 250px;\n margin-bottom: 30px;\n }\n }\n }\n\n .about-content {\n h1.about-title {\n color : #000;\n line-height : 35px;\n font-weight : 500;\n margin-bottom: 25px;\n font-size : 36px !important;\n\n @media(max-width: 575px) {\n margin-bottom: 15px;\n font-size: 20px;\n }\n }\n\n h4.about-tag-line {\n color : ${colors.light_blue};\n line-height : 35px;\n ${'' /* font-weight : 600; */}\n margin-bottom: 25px;\n font-size : 18px !important;\n text-align : center;\n background: black;\n padding: 10px 0px;\n border-radius: 6px;\n\n @media(max-width: 575px) {\n margin-bottom: 15px;\n font-size: 14px;\n }\n }\n\n p.about-para {\n font-size : 13px;\n color : #000;\n line-height : 25px;\n margin-bottom: 40px;\n text-align: justify;\n\n span {\n display : block;\n margin-top: 20px;\n }\n\n @media(max-width: 575px) {\n margin-bottom : 20px;\n }\n }\n\n .counter-box {\n h3 {\n margin-bottom: 10px;\n\n span {\n font-weight: 600;\n }\n\n i {\n font-size : 20px;\n vertical-align: middle;\n }\n }\n\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n\n @media(max-width: 575px) {\n display : none;\n }\n }\n\n .counter-box.box1 {\n h3 {\n color: ${colors.red};\n }\n }\n\n .counter-box.box2 {\n h3 {\n color: ${colors.purple};\n }\n }\n\n .counter-box.box3 {\n h3 {\n color: ${colors.blue};\n }\n }\n\n a.readmore-btn {\n font-size : 14px;\n color : #fff;\n background: ${colors.gr_bg};\n display : inline-block;\n width : 145px;\n height : 40px;\n text-align: center;\n padding : 11px;\n border-radius : 5px;\n margin-top: 40px;\n\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n margin-top : 0;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 30px 0 40px;\n }\n }\n`;","import React, { Component, useEffect, useState } from 'react';\nimport Datas from '../data/about-us/about-us.json';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport { Styles } from \"./styles/aboutUs.js\";\nimport axios from 'axios';\n\nconst AboutUs = () => {\n // constructor() {\n // super()\n // this.state = {\n // isOpen: false\n // }\n // this.openModal = this.openModal.bind(this)\n // }\n\n // openModal() {\n // this.setState({ isOpen: true })\n // }\n const [aboutUs, setAboutUs] = useState([]);\n useEffect(() => {\n const aboutUs = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/abouts/find-all`).then(res => {\n setAboutUs(res.data)\n }).catch(err => console.error(err))\n }\n aboutUs();\n },[])\n\n return (\n \n {/* About Us */}\n
\n \n \n {\n aboutUs !== null && aboutUs.length > 0 ? aboutUs.map((data, i) => (\n \n \n
\n \n \"AboutImg\"\n\n \n {/* \"\" */}\n {/* \"\" */}\n
\n \n \n
\n

About Us

\n

\n

{data.aboutTagLine}

\n
\n \n \n )): \"No about content\"\n }\n \n \n \n
\n \n )\n \n}\n\nexport default AboutUs\n","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n .course-filter {\n background: ${colors.bg2};\n padding : 62px 0 70px;\n\n .sec-title {\n h4 {\n color : #00B4F5;\n line-height : 35px;\n font-weight : 600;\n max-width : 550px;\n margin : auto;\n margin-bottom: 42px;\n\n @media(max-width: 575px) {\n margin-bottom: 15px;\n font-size: 20px;\n }\n }\n }\n\n .filter-btns {\n ul.filter-btn-list {\n background-color: #ffffff;\n display : inline-block;\n border-radius : 5px;\n box-shadow : 0 12px 25px rgba(0, 0, 0, 0.07);\n margin-bottom: 52px;\n\n li {\n font-size : 14px;\n color : ${colors.black2};\n font-weight : 500;\n padding : 10px 20px;\n cursor : pointer;\n border-radius: 5px;\n\n @media(max-width: 767px) {\n font-size: 13px;\n padding: 8px 12px;\n }\n }\n\n li.active {\n background: ${colors.gr_bg};\n color : #ffffff;\n }\n\n @media(max-width: 575px) {\n margin-bottom: 35px;\n }\n }\n }\n\n .filter-items {\n .course-item {\n transition : all 0.2s ease;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 220px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n border-radius : 0 0 5px 5px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n ${'' /* border-bottom : 1px solid ${colors.border1}; */}\n padding-bottom: 10px;\n margin-bottom : 12px;\n text-align : justify;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n .viewall-btn {\n a {\n font-size : 15px;\n color : #fff;\n background : ${colors.gr_bg};\n display : inline-block;\n width : 200px;\n height : 48px;\n text-transform: uppercase;\n font-weight : 500;\n text-align : center;\n padding : 14px;\n border-radius : 5px;\n margin-top: 20px;\n\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size: 13px;\n width: 170px;\n height: 42px;\n padding: 12px;\n margin-top: 10px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 25px 0 40px;\n }\n }\n`;","import React, { useEffect,useState } from 'react';\nimport Datas from '../data/portfolio/filter.json';\nimport { Link } from 'react-router-dom';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport { Styles } from \"./styles/portfolioFilter.js\";\nimport axios from 'axios';\nimport slugify from 'slugify';\n\nfunction PortfolioFilter() {\n\n const [homePageService, setHomePageService] = useState([]);\n useEffect(() => {\n const getHomePageService = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/homepage-services/find-all`).then((response) => setHomePageService(response.data))\n .catch((error) => console.error(error));\n }\n getHomePageService();\n },[])\n\n useEffect(() => {\n const buttons = document.querySelector(\".filter-btn-list\").children;\n const items = document.querySelector(\".filter-items\").children;\n\n for (let i = 0; i < buttons.length; i++) {\n buttons[i].addEventListener(\"click\", function () {\n\n for (let j = 0; j < buttons.length; j++) {\n buttons[j].classList.remove(\"active\");\n }\n\n this.classList.add(\"active\");\n const target = this.getAttribute(\"data-target\");\n\n for (let k = 0; k < items.length; k++) {\n items[k].style.display = \"none\";\n\n if (items[k].getAttribute(\"data-id\") === target) {\n items[k].style.display = \"block\";\n }\n\n if (target === \"*\") {\n items[k].style.display = \"block\";\n }\n }\n })\n }\n });\n\n return (\n \n {/* Course Area */}\n
\n \n \n \n
\n

{Datas.secTitle}

\n
\n \n \n
\n
    \n
  • All
    • \n
  • Building Management
    • \n
  • Facilities Management
    • \n
  • Developer Services
    • \n
  • Concierge
    • \n
  • Cleaning
    • \n
  • Gardening & Landscaping
    • \n
\n
\n \n {\n homePageService && homePageService.length > 0 ? homePageService.map((data, i) => (\n \n
\n \n
\n
\n \n \n
\n
{data.serviceName}
\n

\n \n
\n
\n \n )) : \"No home page content\"\n }\n \n \n \n
\n View All Services\n
\n \n \n \n
\n \n )\n}\n\nexport default PortfolioFilter\n","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n .testimonial-area {\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n padding : 63px 0;\n position : relative;\n\n &:before {\n position : absolute;\n content : '';\n background: ${colors.bg1};\n opacity : 0.98;\n width : 100%;\n height : 100%;\n top : 0;\n left : 0;\n }\n\n .sec-title {\n h4 {\n color : #ffffff;\n line-height : 35px;\n font-weight : 600;\n max-width : 550px;\n margin : auto;\n margin-bottom: 43px;\n\n @media(max-width: 575px) {\n margin-bottom: 15px;\n font-size: 20px;\n }\n }\n }\n\n .testimonial-slider {\n .slider-item {\n .desc {\n background-color: rgba(255, 255, 255, 0.08);\n padding : 30px 38px;\n border-radius : 5px;\n position: relative;\n\n &::before {\n content : \"\";\n position : absolute;\n border-width : 15px 15px;\n border-style : solid;\n border-top-color: rgba(255, 255, 255, 0.08);\n ;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n top : 100%;\n left : 47px;\n z-index : 1;\n }\n\n h5 {\n font-size : 18px;\n color : ${colors.green2};\n margin-bottom: 15px;\n }\n\n p {\n font-size : 14px;\n color : ${colors.border3};\n line-height: 25px;\n }\n }\n\n .writer {\n margin-top : 35px;\n margin-left: 30px;\n\n img {\n max-width: 65px;\n border-radius : 50%;\n float : left;\n margin-right: 15px;\n }\n\n h6 {\n color : ${colors.border1};\n padding-top : 10px;\n margin-bottom: 3px;\n }\n\n p {\n color: ${colors.border3};\n }\n }\n }\n\n .slider-dot {\n margin-top: 48px !important;\n\n .swiper-pagination-bullet {\n width : 22px;\n height : 9px;\n background: ${colors.text4};\n display : inline-block;\n margin : 3px;\n opacity : 1 !important;\n border-radius : 5px;\n }\n\n .swiper-pagination-bullet.swiper-pagination-bullet-active {\n background: ${colors.green};\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 30px 0;\n }\n }\n`;","\r\nimport { GET_TESTIMONIALS} from '../constants/testimonial';\r\nimport { SHOW_LOADING, HIDE_LOADING } from '../constants/commons';\r\n\r\nexport const getTestimonials = (testimonials) => {\r\n return {\r\n type: GET_TESTIMONIALS,\r\n payload: testimonials\r\n }\r\n}\r\n\r\nexport const showLoading = () => {\r\n return {\r\n type: SHOW_LOADING\r\n }\r\n}\r\n\r\nexport const hideLoading = () => {\r\n return {\r\n type: HIDE_LOADING\r\n }\r\n}","export const GET_TESTIMONIALS = 'GET_TESTIMONIALS';\r\n","import React, { useEffect } from 'react';\nimport Datas from '../data/testimonial/testimonial-slider.json';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport Swiper from 'react-id-swiper';\nimport { Styles } from \"./styles/testimonialSlider.js\";\nimport { useDispatch, useSelector, connect } from 'react-redux';\nimport { getTestimonials, showLoading, hideLoading } from '../redux/actions/testimonial';\nimport axios from 'axios';\n\nconst TestimonialSlider = () => {\n const testimonials = useSelector(state => state.allTestimonials.testimonials);\n const dispatch = useDispatch();\n\n useEffect(() => {\n const fetchAllTestimonials = async () => {\n dispatch(showLoading());\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/testimonials/find-all`).then((res) => {\n dispatch(getTestimonials(res.data));\n dispatch(hideLoading());\n\n }).catch(error => {\n console.error(error);\n });\n };\n fetchAllTestimonials();\n }, [dispatch]);\n\n\n const settings = {\n slidesPerView: 2,\n loop: true,\n speed: 1000,\n autoplay: {\n delay: 3000,\n disableOnInteraction: false\n },\n spaceBetween: 30,\n watchSlidesVisibility: true,\n pagination: {\n el: '.slider-dot.text-center',\n clickable: true\n },\n breakpoints: {\n 0: {\n slidesPerView: 1\n },\n 576: {\n slidesPerView: 1\n },\n 768: {\n slidesPerView: 2\n },\n 992: {\n slidesPerView: 2\n }\n }\n };\n\n return (\n \n {/* Testimonial Slider */}\n
\n \n \n \n
\n

{Datas.secTitle.toUpperCase()}

\n
\n \n \n \n {\n testimonials !== null && testimonials.length > 0 ? testimonials.map((data, i) => (\n
\n
\n
{data.testimonialTitle}
\n

{data.testimonialDesc}

\n
\n
\n {data.testimonialTitle}\n\n {/* {data.authorImg} */}\n
{data.authorName}
\n

{data.authorTitle}

\n
\n
\n )) : \"\"\n }\n \n \n \n \n
\n \n )\n}\n\nexport default TestimonialSlider\n","export const SHOW_LOADING = 'SHOW_LOADING';\r\nexport const HIDE_LOADING = 'HIDE_LOADING';","import styled from \"styled-components\";\nimport { colors } from \"../element/elements.js\";\n\nexport const Styles = styled.div`\n button.totop-btn {\n background : ${colors.gr_bg};\n position: fixed;\n bottom : 1px;\n right : 30px;\n width : 45px;\n height: 45px;\n border-radius : 5px;\n display : flex;\n align-items : center;\n justify-content : center;\n font-size : 28px;\n border : none;\n color : #ffffff;\n text-decoration : none;\n z-index : 1000;\n opacity: 0;\n pointer-events : none;\n transition : all 0.4s;\n &:hover {\n background : ${colors.gr_bg2};\n }\n }\n\n button.totop-btn.show {\n bottom : 40px;\n opacity: 1;\n pointer-events : auto;\n }\n`;","import React, { useEffect } from 'react';\nimport { Styles } from \"./styles/backToTop.js\";\n\nfunction BackToTop() {\n useEffect(() => {\n const topBtn = document.querySelector(\".totop-btn\");\n\n window.addEventListener(\"scroll\", () => {\n if (window.scrollY > 750) {\n topBtn.classList.add(\"show\");\n } else {\n topBtn.classList.remove(\"show\");\n }\n });\n\n topBtn.addEventListener(\"click\", smoothScrollBackToTop);\n\n function smoothScrollBackToTop() {\n const targetPosition = 0;\n const startPosition = window.pageYOffset;\n const distance = targetPosition - startPosition;\n const duration = 750;\n let start = null;\n\n window.requestAnimationFrame(step);\n\n function step(timestamp) {\n if (!start) start = timestamp;\n const progress = timestamp - start;\n window.scrollTo(0, easeInOutCubic(progress, startPosition, distance, duration));\n if (progress < duration) window.requestAnimationFrame(step);\n }\n }\n\n function easeInOutCubic(t, b, c, d) {\n t /= d / 2;\n if (t < 1) return c / 2 * t * t * t + b;\n t -= 2;\n return c / 2 * (t * t * t + 2) + b;\n };\n });\n\n return (\n \n {/* Back To Top */}\n \n \n )\n}\n\nexport default BackToTop","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n footer.footer2 {\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n position : relative;\n padding : 55px 0 33px;\n ${'' /* padding : 70px 0 80px; */}\n\n &:before {\n position : absolute;\n content : \"\";\n background: ${colors.bg1};\n opacity : 0.98;\n width : 100%;\n height : 100%;\n top : 0;\n left : 0;\n }\n\n .footer-logo-info {\n img {\n max-width : 100%;\n margin-bottom: 30px;\n\n @media(max-width: 767px) {\n margin-bottom: 18px;\n }\n }\n\n p {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 28px;\n margin-bottom: 20px;\n\n @media(max-width: 991px) {\n line-height: 25px;\n margin-bottom: 12px;\n }\n }\n\n ul {\n li {\n color : ${colors.text3};\n margin-bottom: 12px;\n\n i {\n font-size : 18px;\n color : ${colors.green};\n width : 35px;\n vertical-align: top;\n\n @media(max-width: 991px) {\n width : 20px;\n }\n }\n\n &:nth-child(2) {\n cursor : pointer;\n text-decoration : underline;\n }\n &:last-child {\n margin-bottom : 0;\n }\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 30px;\n }\n }\n\n .f-links {\n padding-left: 25px;\n text-align: right;\n columns: 2 auto;\n h5 {\n color : ${colors.border1};\n text-transform: uppercase;\n margin-top : 8px;\n margin-bottom : 35px;\n text-align: right;\n\n @media(max-width: 991px) {\n font-size: 18px;\n margin-bottom: 29px;\n }\n\n @media(max-width: 767px) {\n margin-bottom: 10px;\n }\n }\n \n\n ul {\n li {\n a {\n font-size : 14px;\n color : ${colors.text3};\n line-height: 39px;\n\n i {\n font-size : 12px;\n color : ${colors.green};\n margin-right: 10px;\n\n @media(max-width: 991px) {\n margin-right: 5px;\n }\n }\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n }\n\n @media(max-width: 991px) {\n padding-left : 0;\n \n }\n\n @media(max-width: 767px) {\n margin-bottom: 30px;\n text-align: left;\n\n }\n }\n\n .f-post {\n h5 {\n color : ${colors.border1};\n text-transform: uppercase;\n margin-top : 8px;\n margin-bottom : 42px;\n\n @media(max-width: 991px) {\n font-size: 18px;\n margin-bottom: 39px;\n }\n\n @media(max-width: 767px) {\n margin-bottom: 10px;\n }\n }\n\n .post-box {\n margin-bottom: 22px;\n\n .po-icon {\n i {\n font-size : 26px;\n color : ${colors.green};\n line-height : 30px;\n margin-right: 10px;\n }\n }\n\n .po-content {\n a {\n font-size : 14px;\n color : ${colors.text3};\n display : inline-block;\n margin-bottom: 3px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n\n span {\n display: block;\n color : ${colors.text2};\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n\n @media(max-width: 991px) {\n margin-bottom: 10px;\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 30px;\n }\n }\n\n .f-newsletter {\n h5 {\n color : ${colors.border1};\n text-transform: uppercase;\n margin-top : 8px;\n margin-bottom : 38px;\n\n @media(max-width: 991px) {\n font-size: 18px;\n margin-bottom: 37px;\n }\n\n @media(max-width: 767px) {\n margin-bottom: 10px;\n }\n }\n\n p {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom: 22px;\n }\n\n form.form {\n p.form-control {\n padding : 0;\n width : auto;\n height : auto;\n background : transparent;\n border : none;\n margin-bottom: 25px;\n position : relative;\n\n input {\n width : 100%;\n height : 40px;\n border : 1px solid ${colors.text2};\n background : transparent;\n color : ${colors.border1};\n padding-left: 15px;\n border-radius : 5px;\n\n &::placeholder {\n font-style: italic;\n color : ${colors.text3};\n }\n }\n\n span {\n font-size: 13px;\n color : ${colors.green};\n font-weight: 300;\n position : absolute;\n bottom : -22px;\n left : 0;\n visibility : hidden;\n }\n }\n\n p.form-control.success {\n input {\n border: 2px solid ${colors.green};\n }\n\n &::before {\n position : absolute;\n content : \"\\f058\";\n font-family: \"Line Awesome Free\";\n font-size : 24px;\n color : ${colors.green};\n font-weight: 900;\n top : 8px;\n right : 10px;\n }\n }\n\n p.form-control.error {\n input {\n border: 2px solid ${colors.red};\n }\n\n &::before {\n position : absolute;\n content : \"\\f06a\";\n font-family: \"Line Awesome Free\";\n font-size : 24px;\n color : ${colors.red};\n font-weight: 900;\n top : 8px;\n right : 10px;\n }\n }\n\n p.form-control.error {\n span {\n visibility: visible;\n }\n }\n\n button {\n font-size : 15px;\n color : ${colors.border1};\n background : ${colors.gr_bg};\n width : 100%;\n height : 40px;\n font-weight: 500;\n border : none;\n border-radius : 5px;\n\n &:hover {\n background: ${colors.gr_bg2};\n }\n }\n }\n }\n\n .copytext-area {\n border-top : 1px solid ${colors.black2};\n padding-top: 45px;\n margin-top : 40px;\n\n p {\n font-size : 14px;\n color : ${colors.text3};\n margin-bottom: 25px;\n\n i {\n color : ${colors.green};\n margin: 0 2px;\n }\n\n a {\n color: ${colors.green};\n\n &:hover {\n text-decoration: underline;\n }\n }\n }\n\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 50px 0;\n }\n }\n`;","import React, {useEffect, useState} from 'react';\nimport Datas from '../data/footer/footer2.json';\nimport { Link } from 'react-router-dom';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport BackToTop from './common/BackToTop';\nimport { Styles } from \"./styles/footerTwo.js\";\nimport axios from 'axios';\n\nfunction FooterTwo() {\n\n const [footers, setFooters] = useState([]);\n useEffect(() => {\n const getFooters = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/footers/find-all`).then((response) => setFooters(response.data))\n .catch((error) => console.error(error));\n }\n getFooters();\n },[])\n// console.log(footers);\n return (\n \n {/* Footer Two */}\n \n \n );\n}\n\nexport default FooterTwo\n","import React, { Component } from 'react';\nimport HeaderTwo from './components/HeaderTwo';\nimport HeroSlider from './components/HeroSlider';\nimport AboutUs from './components/AboutUs';\nimport PortfolioFilter from './components/PortfolioFilter';\nimport TestimonialSlider from './components/TestimonialSlider';\nimport FooterTwo from './components/FooterTwo';\n\nexport default class HomeOne extends Component {\n componentDidMount(){\n document.title = \"REAL FM | People Technology Reporting\";\n }\n render() {\n return (\n
\n\n {/* Header */}\n \n\n {/* Hero Slider */}\n \n\n {/* About Area */}\n \n\n {/* Testimonial Slider */}\n \n\n {/* Portfolio Filter */}\n \n \n {/* Footer */}\n \n\n
\n )\n }\n}\n","import styled from \"styled-components\";\nimport { colors } from \"../element/elements.js\";\n\nexport const Styles = styled.div`\n .breadcrumb-area {\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n padding : 60px 0;\n position : relative;\n\n &:before {\n position : absolute;\n content : '';\n background: ${colors.bg1};\n opacity : 0.5;\n width : 100%;\n height : 100%;\n top : 0;\n left : 0;\n }\n\n .breadcrumb-box {\n background: ${colors.bg1};\n display : inline-block;\n padding : 20px 45px;\n border-radius : 10px;\n\n h2.breadcrumb-title {\n color : #ffffff;\n font-weight : 600;\n text-transform: uppercase;\n margin-bottom : 5px;\n\n @media(max-width: 767px) {\n font-size : 20px;\n }\n }\n\n nav {\n ol.breadcrumb {\n display : inline-flex;\n padding : 0;\n margin-bottom : 0;\n background-color: transparent;\n border-radius : 0;\n\n li.breadcrumb-item {\n a {\n color: ${colors.green};\n\n &:hover {\n color: #ffffff;\n }\n }\n }\n\n li.breadcrumb-item.active {\n color: ${colors.border3};\n\n &::before {\n color: ${colors.border3};\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 30px 0;\n }\n }\n`;","import React, { Component } from 'react';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport { Styles } from \"./styles/breadcrumb.js\";\n\nexport class BreadcrumbBox extends Component {\n state = {\n backgroundImage: 'breadcrumb-bg.jpg',\n }\n\n render() {\n return (\n \n
\n \n \n \n
\n

{this.props.title}

\n
\n \n \n \n
\n \n )\n }\n}","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n\n /* Course Grid */\n .course-grid-area {\n padding: 70px 0;\n .course-items {\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 240px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n\n @media(max-width: 767px) {\n height: 185px;\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course List */\n .course-list-area {\n padding: 70px 0;\n .course-items2 {\n .course-item {\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n box-shadow: 0 8px 20px 5px rgba(0,0,0,0.07);\n margin-bottom: 30px;\n\n .course-image-box {\n .course-image {\n width : 290px;\n height : 230px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n top : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n top : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n }\n\n @media(max-width: 991px) {\n width: 100%;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n padding-bottom: 12px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n .rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom : 15px;\n }\n\n a.details-btn {\n font-size : 13px;\n color : ${colors.green};\n border : 1px solid ${colors.border3};\n padding: 7px 15px;\n border-radius: 5px;\n font-weight: 500;\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\n }\n\n @media(max-width: 991px) {\n display : block !important;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course Details */\n .course-details-area {\n padding : 40px 0 30px;\n .course-details-top {\n .heading {\n h4 {\n color : ${colors.black1};\n font-weight: 600;\n line-height: 35px;\n margin-bottom: 25px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n }\n .course-top-overview {\n margin-bottom : 25px;\n .overviews {\n .author {\n margin-right : 20px;\n padding-right : 20px;\n margin-top: -3px;\n border-right : 1px solid ${colors.border3};\n img {\n float : left;\n max-width: 50px;\n border-radius: 50%;\n margin-right: 10px;\n }\n .author-name {\n float : left;\n margin-top: 3px;\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n .category {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n\n .rating {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n margin-left: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n .price {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n @media(max-width: 480px) {\n display : none;\n }\n }\n .course-details-banner {\n margin-bottom: 40px;\n img {\n border-radius : 5px;\n }\n }\n .course-tab-list {\n .nav {\n display: inline-block;\n border-radius: 5px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n margin-bottom: 35px;\n .nav-item {\n display: inline-block;\n a.nav-link {\n font-size: 14px;\n color: ${colors.black2};\n font-weight: 500;\n text-transform : uppercase;\n padding: 12px 30px 10px;\n border-radius: 5px;\n\n @media(max-width: 991px) {\n padding: 12px 16px 9px;\n }\n }\n a.nav-link.active {\n background : ${colors.gr_bg};\n color : #ffffff;\n }\n }\n }\n .tab-content {\n .overview-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n font-size: 15px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n .course-desc {\n margin-bottom: 40px;\n }\n\n .course-feature {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size : 14px;\n color: #000;\n line-height : 25px;\n margin-bottom : 10px;\n i {\n font-size : 20px;\n color: ${colors.green};\n float: left;\n height: 40px;\n line-height: 27px;\n margin-right: 10px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n p {\n text-align: justify;\n color: #000;\n font-size: 15px;\n }\n }\n\n .avail {\n h4 {\n font-size : 20px;\n color: #00B4F5;\n ${'' /* font-weight: 600; */}\n margin-bottom: 15px;\n background: #182B48;\n padding: 15px;\n border-radius: 5px;\n }\n @media(max-width: 575px) {\n font-size : 12px;\n }\n }\n .course-learn {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size: 14px;\n color: #000;\n line-height: 25px;\n margin-bottom: 15px;\n i {\n ${'' /* float: left; */}\n color: ${colors.green};\n ${'' /* border: 1px solid ${colors.border3}; */}\n width: 35px;\n height: 35px;\n border-radius: 50%;\n text-align: center;\n padding-top: 9px;\n margin-top: 8px;\n margin-right: 15px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n h5 {\n color: ${colors.light_blue};\n font-size: 15px;\n margin: 0px;\n }\n }\n .course-share {\n ul.social {\n margin-top: 30px;\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n }\n .curriculum-tab {\n .course-curriculum {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .course-element {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .course-item {\n margin-bottom: 10px;\n button.course-button {\n border: none;\n background: transparent;\n margin-bottom: 15px;\n display: block;\n width: 100%;\n text-align : left;\n padding: 0;\n font-size : 18px;\n color: ${colors.black2};\n font-weight: 500;\n span {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n font-weight: 400;\n }\n }\n\n .course-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n ul {\n li {\n border-bottom : 1px solid ${colors.border3};\n margin-left: 25px;\n padding: 12px 0;\n span.play-icon {\n font-size : 14px;\n color: ${colors.text3};\n margin-right: 20px;\n i {\n color: ${colors.green};\n border: 1px solid ${colors.green};\n font-size: 22px;\n width: 30px;\n height: 30px;\n border-radius: 50%;\n padding-left: 3px;\n text-align: center;\n line-height: 29px;\n vertical-align: middle;\n margin-right: 10px;\n }\n }\n span.lecture-title {\n font-size : 15px;\n color: ${colors.black2};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span.lecture-duration {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n line-height: 28px;\n font-weight: 400;\n }\n }\n }\n }\n\n .course-content.show {\n max-height: 100%;\n margin-bottom: 40px;\n }\n\n &:last-child {\n margin-bottom: 40px;\n }\n }\n }\n }\n\n .instructor-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n .instructor-item {\n margin-bottom: 30px;\n\n .instructor-img {\n img {\n border-radius : 5px;\n }\n }\n\n .instructor-content {\n position: relative;\n\n .instructor-box {\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\n padding : 25px;\n background: #ffffff;\n border-radius : 5px;\n position: absolute;\n top : 32px;\n left : -11%;\n z-index : 1;\n\n .top-content {\n margin-bottom: 20px;\n\n .instructor-name {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 12px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n .instructor-social {\n margin-top: 25px;\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 13px;\n color : #ffffff;\n width : 28px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n }\n }\n }\n }\n\n .instructor-desk {\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .review-tab {\n .review-comments {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .comment-box {\n border-bottom: 1px solid ${colors.border1};\n padding-bottom: 20px;\n margin-bottom: 25px;\n .comment-image {\n img {\n max-width : 100px;\n border-radius : 5px;\n margin-right : 20px;\n }\n }\n .comment-content {\n .content-title {\n .comment-writer {\n h6 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom : 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 12px;\n color: ${colors.text3};\n margin-bottom: 5px;\n }\n ul {\n margin-bottom: 8px;\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size: 13px;\n color: ${colors.text2};\n margin-left: 5px;\n }\n }\n }\n }\n .reply-btn {\n button {\n font-size : 14px;\n color: ${colors.green};\n background : transparent;\n border : 1px solid ${colors.border3};\n font-weight: 500;\n border-radius: 25px;\n padding: 4px 12px 3px;\n margin-top : 10px;\n i {\n font-size: 17px;\n vertical-align: text-top;\n }\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n }\n .comment-desc {\n p {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n }\n }\n }\n &:last-child {\n border-bottom : none;\n padding-bottom : 0;\n margin-bottom : 0;\n }\n }\n }\n\n .review-form {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 25px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n\n .single-details-sidbar {\n .course-details-feature {\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n border-radius: 5px;\n padding: 15px 20px 20px;\n h5.title {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n ul.feature-list {\n margin-bottom: 20px;\n li {\n border-top: 1px dashed ${colors.border3};\n padding: 12px 0;\n font-size : 14px;\n color : ${colors.black2};\n font-weight: 500;\n i {\n font-size : 20px;\n color: ${colors.green};\n vertical-align: top;\n margin-right : 2px;\n }\n span {\n float : right;\n font-size: 13px;\n color: ${colors.text3};\n font-weight: 400;\n line-height: 20px;\n }\n &:first-child {\n border-top : none;\n padding-top : 0;\n }\n &:last-child {\n padding-bottom : 0;\n }\n }\n }\n\n button.enroll-btn {\n font-size: 16px;\n color: #fff;\n background: ${colors.gr_bg};\n display: inline-block;\n width: 100%;\n height: 40px;\n font-weight : 500;\n border : none;\n padding: 9px;\n border-radius: 5px;\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n @media(max-width: 1199px) {\n padding: 12px 15px 15px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 20px 0 5px;\n }\n }\n`;","import React, { useEffect, useState } from 'react';\nimport { Container, Row, Col, Tab } from 'react-bootstrap';\nimport HeaderTwo from '../../components/HeaderTwo';\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\nimport FooterTwo from '../../components/FooterTwo';\nimport { Styles } from './styles/buildFacility.js';\nimport axios from 'axios';\n\n\nfunction BuildingFacilityDetails() {\n\n const [allServices, setAllServices] = useState([]);\n\n useEffect(() => {\n document.title = 'Building and Facility Management | REAL FM';\n const courseButton = document.querySelectorAll(\".course-button\");\n courseButton.forEach(button => {\n button.addEventListener(\"click\", () => {\n button.classList.toggle(\"active\");\n const content = button.nextElementSibling;\n\n if (button.classList.contains(\"active\")) {\n content.className = \"course-content show\";\n content.style.maxHeight = content.scrollHeight + \"px\";\n } else {\n content.className = \"course-content\";\n content.style.maxHeight = \"0\";\n }\n });\n });\n });\n\n useEffect(() => {\n const fetchAllServices = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/services/find-all`).then((res) => {\n setAllServices(res.data);\n }).catch(error => {\n console.error(error);\n });\n };\n fetchAllServices();\n },[]);\n\n // console.log(allServices);\n return (\n
\n\n {/* Header 2 */}\n \n\n {/* Breadcroumb */}\n \n\n \n {/* Course Details */}\n
\n \n \n \n
\n \n \n
\n \n \n \n \n
\n\n
\n {\n allServices !== null && allServices.length > 0 ? allServices.map((service, i) => (\n service.serviceType.toUpperCase() === \"BUILDING & FACILITY MANAGEMENT\" ? \n
\n \n \n {/* \"\" */}\n {service.serviceName}\n \n \n

\n \n \n \n
\n
\n
Our Building Management Services include:
\n {\n service.servicesIncl !== null && service.servicesIncl.length > 0 ? service.servicesIncl.map((serviceIncl, i) => (\n \n \n \n
    \n
  • {serviceIncl}
    • \n
\n\n \n \n \n )) : \"No included service found\"\n }\n \n
\n\n
\n

{service.serviceTagLine}

\n
\n {/*
\n \"\"\n
*/}\n : \"\"\n )) : \"No services found\"\n }\n \n \n \n \n \n
\n
\n \n \n \n \n
\n \n\n {/* Footer 2 */}\n \n\n
\n )\n}\n\nexport default BuildingFacilityDetails","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n\n /* Course Grid */\n .course-grid-area {\n padding: 70px 0;\n .course-items {\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 240px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n\n @media(max-width: 767px) {\n height: 185px;\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course List */\n .course-list-area {\n padding: 70px 0;\n .course-items2 {\n .course-item {\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n box-shadow: 0 8px 20px 5px rgba(0,0,0,0.07);\n margin-bottom: 30px;\n\n .course-image-box {\n .course-image {\n width : 290px;\n height : 230px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n top : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n top : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n }\n\n @media(max-width: 991px) {\n width: 100%;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n padding-bottom: 12px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n .rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom : 15px;\n }\n\n a.details-btn {\n font-size : 13px;\n color : ${colors.green};\n border : 1px solid ${colors.border3};\n padding: 7px 15px;\n border-radius: 5px;\n font-weight: 500;\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\n }\n\n @media(max-width: 991px) {\n display : block !important;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course Details */\n .course-details-area {\n padding : 70px 0 20px;\n .course-details-top {\n .heading {\n h4 {\n color : ${colors.black1};\n font-weight: 600;\n line-height: 35px;\n margin-bottom: 25px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n }\n .course-top-overview {\n margin-bottom : 25px;\n .overviews {\n .author {\n margin-right : 20px;\n padding-right : 20px;\n margin-top: -3px;\n border-right : 1px solid ${colors.border3};\n img {\n float : left;\n max-width: 50px;\n border-radius: 50%;\n margin-right: 10px;\n }\n .author-name {\n float : left;\n margin-top: 3px;\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n .category {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n\n .rating {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n margin-left: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n .price {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n @media(max-width: 480px) {\n display : none;\n }\n }\n .course-details-banner {\n margin-bottom: 40px;\n img {\n border-radius : 5px;\n }\n }\n .course-tab-list {\n .nav {\n display: inline-block;\n border-radius: 5px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n margin-bottom: 35px;\n .nav-item {\n display: inline-block;\n a.nav-link {\n font-size: 14px;\n color: ${colors.black2};\n font-weight: 500;\n text-transform : uppercase;\n padding: 12px 30px 10px;\n border-radius: 5px;\n\n @media(max-width: 991px) {\n padding: 12px 16px 9px;\n }\n }\n a.nav-link.active {\n background : ${colors.gr_bg};\n color : #ffffff;\n }\n }\n }\n .tab-content {\n .overview-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n font-size: 15px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n .course-desc {\n margin-bottom: 40px;\n p {\n color: #000;\n }\n }\n\n .course-feature {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size : 14px;\n color: ${colors.text3};\n line-height : 25px;\n margin-bottom : 10px;\n i {\n font-size : 20px;\n color: ${colors.green};\n float: left;\n height: 40px;\n line-height: 27px;\n margin-right: 10px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n p {\n text-align: justify;\n color: #000;\n font-size: 15px;\n }\n\n img {\n @media(max-width: 575px) {\n margin-top: 10px;\n }\n @media(max-width: 767px) {\n margin-bottom: 10px;\n }\n }\n \n }\n\n .avail {\n h4 {\n font-size : 20px;\n color: #00B4F5;\n font-weight: 600;\n margin-bottom: 15px;\n }\n @media(max-width: 575px) {\n font-size : 12px;\n }\n }\n .course-learn {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size: 14px;\n color: #000;\n line-height: 25px;\n margin-bottom: 15px;\n i {\n ${'' /* float: left; */}\n color: ${colors.green};\n ${'' /* border: 1px solid ${colors.border3}; */}\n width: 35px;\n height: 35px;\n border-radius: 50%;\n text-align: center;\n padding-top: 9px;\n margin-top: 8px;\n margin-right: 15px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n h5 {\n color: ${colors.light_blue};\n font-size: 15px;\n margin: 0px;\n }\n }\n .course-share {\n ul.social {\n margin-top: 30px;\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n }\n .curriculum-tab {\n .course-curriculum {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .course-element {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .course-item {\n margin-bottom: 10px;\n button.course-button {\n border: none;\n background: transparent;\n margin-bottom: 15px;\n display: block;\n width: 100%;\n text-align : left;\n padding: 0;\n font-size : 18px;\n color: ${colors.black2};\n font-weight: 500;\n span {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n font-weight: 400;\n }\n }\n\n .course-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n ul {\n li {\n border-bottom : 1px solid ${colors.border3};\n margin-left: 25px;\n padding: 12px 0;\n span.play-icon {\n font-size : 14px;\n color: ${colors.text3};\n margin-right: 20px;\n i {\n color: ${colors.green};\n border: 1px solid ${colors.green};\n font-size: 22px;\n width: 30px;\n height: 30px;\n border-radius: 50%;\n padding-left: 3px;\n text-align: center;\n line-height: 29px;\n vertical-align: middle;\n margin-right: 10px;\n }\n }\n span.lecture-title {\n font-size : 15px;\n color: ${colors.black2};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span.lecture-duration {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n line-height: 28px;\n font-weight: 400;\n }\n }\n }\n }\n\n .course-content.show {\n max-height: 100%;\n margin-bottom: 40px;\n }\n\n &:last-child {\n margin-bottom: 40px;\n }\n }\n }\n }\n\n .instructor-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n .instructor-item {\n margin-bottom: 30px;\n\n .instructor-img {\n img {\n border-radius : 5px;\n }\n }\n\n .instructor-content {\n position: relative;\n\n .instructor-box {\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\n padding : 25px;\n background: #ffffff;\n border-radius : 5px;\n position: absolute;\n top : 32px;\n left : -11%;\n z-index : 1;\n\n .top-content {\n margin-bottom: 20px;\n\n .instructor-name {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 12px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n .instructor-social {\n margin-top: 25px;\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 13px;\n color : #ffffff;\n width : 28px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n }\n }\n }\n }\n\n .instructor-desk {\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .review-tab {\n .review-comments {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .comment-box {\n border-bottom: 1px solid ${colors.border1};\n padding-bottom: 20px;\n margin-bottom: 25px;\n .comment-image {\n img {\n max-width : 100px;\n border-radius : 5px;\n margin-right : 20px;\n }\n }\n .comment-content {\n .content-title {\n .comment-writer {\n h6 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom : 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 12px;\n color: ${colors.text3};\n margin-bottom: 5px;\n }\n ul {\n margin-bottom: 8px;\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size: 13px;\n color: ${colors.text2};\n margin-left: 5px;\n }\n }\n }\n }\n .reply-btn {\n button {\n font-size : 14px;\n color: ${colors.green};\n background : transparent;\n border : 1px solid ${colors.border3};\n font-weight: 500;\n border-radius: 25px;\n padding: 4px 12px 3px;\n margin-top : 10px;\n i {\n font-size: 17px;\n vertical-align: text-top;\n }\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n }\n .comment-desc {\n p {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n }\n }\n }\n &:last-child {\n border-bottom : none;\n padding-bottom : 0;\n margin-bottom : 0;\n }\n }\n }\n\n .review-form {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 25px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n\n .single-details-sidbar {\n .course-details-feature {\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n border-radius: 5px;\n padding: 15px 20px 20px;\n h5.title {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n ul.feature-list {\n margin-bottom: 20px;\n li {\n border-top: 1px dashed ${colors.border3};\n padding: 12px 0;\n font-size : 14px;\n color : ${colors.black2};\n font-weight: 500;\n i {\n font-size : 20px;\n color: ${colors.green};\n vertical-align: top;\n margin-right : 2px;\n }\n span {\n float : right;\n font-size: 13px;\n color: ${colors.text3};\n font-weight: 400;\n line-height: 20px;\n }\n &:first-child {\n border-top : none;\n padding-top : 0;\n }\n &:last-child {\n padding-bottom : 0;\n }\n }\n }\n\n button.enroll-btn {\n font-size: 16px;\n color: #fff;\n background: ${colors.gr_bg};\n display: inline-block;\n width: 100%;\n height: 40px;\n font-weight : 500;\n border : none;\n padding: 9px;\n border-radius: 5px;\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n @media(max-width: 1199px) {\n padding: 12px 15px 15px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 20px 0 5px;\n }\n }\n`;","import React, { useEffect, useState } from 'react';\r\nimport { Container, Row, Col, Tab } from 'react-bootstrap';\r\nimport HeaderTwo from '../../components/HeaderTwo';\r\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\r\nimport FooterTwo from '../../components/FooterTwo';\r\nimport { Styles } from './styles/concierge.js';\r\nimport axios from 'axios';\r\n\r\n\r\nfunction ConciergeService() {\r\n const [allServices, setAllServices] = useState([]);\r\n\r\n useEffect(() => {\r\n document.title = 'Concierge Service | REAL FM';\r\n const courseButton = document.querySelectorAll(\".course-button\");\r\n courseButton.forEach(button => {\r\n button.addEventListener(\"click\", () => {\r\n button.classList.toggle(\"active\");\r\n const content = button.nextElementSibling;\r\n\r\n if (button.classList.contains(\"active\")) {\r\n content.className = \"course-content show\";\r\n content.style.maxHeight = content.scrollHeight + \"px\";\r\n } else {\r\n content.className = \"course-content\";\r\n content.style.maxHeight = \"0\";\r\n }\r\n });\r\n });\r\n });\r\n\r\n useEffect(() => {\r\n const fetchAllServices = async () => {\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/services/find-all`).then((res) => {\r\n setAllServices(res.data);\r\n }).catch(error => {\r\n console.error(error);\r\n });\r\n };\r\n fetchAllServices();\r\n },[]);\r\n\r\n return (\r\n
\r\n\r\n {/* Header 2 */}\r\n \r\n\r\n {/* Breadcroumb */}\r\n \r\n\r\n \r\n {/* Course Details */}\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n \r\n \r\n {\r\n allServices !== null && allServices.length > 0 ? allServices.map((service, i) => (\r\n service.serviceType.toUpperCase() === \"CONCIERGE\" ? \r\n \r\n
\r\n

\r\n
\r\n
\r\n \r\n \r\n {/* \r\n \"\"\r\n */}\r\n \r\n {service.serviceName}\r\n \r\n \r\n \r\n
\r\n
\r\n
Our Concierge Services include:
\r\n {\r\n service.servicesIncl !== null && service.servicesIncl.length > 0 ? service.servicesIncl.map((serviceIncl, i) => (\r\n \r\n \r\n \r\n
    \r\n
  • {serviceIncl}
    • \r\n
\r\n\r\n \r\n \r\n \r\n )) : \"No included service found\"\r\n }\r\n \r\n
\r\n \r\n : \"\")) : \"No services found\"\r\n }\r\n \r\n \r\n \r\n \r\n \r\n \r\n
\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n \r\n\r\n {/* Footer 2 */}\r\n \r\n\r\n
\r\n )\r\n}\r\n\r\nexport default ConciergeService","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n\n /* Course Grid */\n .course-grid-area {\n padding: 70px 0;\n .course-items {\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 240px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n\n @media(max-width: 767px) {\n height: 185px;\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course List */\n .course-list-area {\n padding: 70px 0;\n .course-items2 {\n .course-item {\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n box-shadow: 0 8px 20px 5px rgba(0,0,0,0.07);\n margin-bottom: 30px;\n\n .course-image-box {\n .course-image {\n width : 290px;\n height : 230px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n top : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n top : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n }\n\n @media(max-width: 991px) {\n width: 100%;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n padding-bottom: 12px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n .rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom : 15px;\n }\n\n a.details-btn {\n font-size : 13px;\n color : ${colors.green};\n border : 1px solid ${colors.border3};\n padding: 7px 15px;\n border-radius: 5px;\n font-weight: 500;\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\n }\n\n @media(max-width: 991px) {\n display : block !important;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course Details */\n .course-details-area {\n padding : 70px 0 20px;\n .course-details-top {\n .heading {\n h4 {\n color : ${colors.black1};\n font-weight: 600;\n line-height: 35px;\n margin-bottom: 25px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n }\n .course-top-overview {\n margin-bottom : 25px;\n .overviews {\n .author {\n margin-right : 20px;\n padding-right : 20px;\n margin-top: -3px;\n border-right : 1px solid ${colors.border3};\n img {\n float : left;\n max-width: 50px;\n border-radius: 50%;\n margin-right: 10px;\n }\n .author-name {\n float : left;\n margin-top: 3px;\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n .category {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n\n .rating {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n margin-left: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n .price {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n @media(max-width: 480px) {\n display : none;\n }\n }\n .course-details-banner {\n margin-bottom: 40px;\n img {\n border-radius : 5px;\n }\n }\n .course-tab-list {\n .nav {\n display: inline-block;\n border-radius: 5px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n margin-bottom: 35px;\n .nav-item {\n display: inline-block;\n a.nav-link {\n font-size: 14px;\n color: ${colors.black2};\n font-weight: 500;\n text-transform : uppercase;\n padding: 12px 30px 10px;\n border-radius: 5px;\n\n @media(max-width: 991px) {\n padding: 12px 16px 9px;\n }\n }\n a.nav-link.active {\n background : ${colors.gr_bg};\n color : #ffffff;\n }\n }\n }\n .tab-content {\n .overview-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n font-size: 15px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n .course-desc {\n margin-bottom: 40px;\n }\n\n .course-feature {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size : 14px;\n color: #000;\n line-height : 25px;\n margin-bottom : 10px;\n i {\n font-size : 20px;\n color: ${colors.green};\n float: left;\n height: 40px;\n line-height: 27px;\n margin-right: 10px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n p {\n text-align: justify;\n color: #000;\n font-size: 15px;\n }\n }\n\n .avail {\n h4 {\n font-size : 20px;\n color: #00B4F5;\n font-weight: 600;\n margin-bottom: 15px;\n }\n @media(max-width: 575px) {\n font-size : 12px;\n }\n }\n .course-learn {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size: 14px;\n color: #000;\n line-height: 25px;\n margin-bottom: 15px;\n i {\n ${'' /* float: left; */}\n color: ${colors.green};\n ${'' /* border: 1px solid ${colors.border3}; */}\n width: 35px;\n height: 35px;\n border-radius: 50%;\n text-align: center;\n padding-top: 9px;\n margin-top: 8px;\n margin-right: 15px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n h5 {\n color: ${colors.light_blue};\n font-size: 15px;\n margin: 0px;\n }\n }\n .course-share {\n ul.social {\n margin-top: 30px;\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n }\n .curriculum-tab {\n .course-curriculum {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .course-element {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .course-item {\n margin-bottom: 10px;\n button.course-button {\n border: none;\n background: transparent;\n margin-bottom: 15px;\n display: block;\n width: 100%;\n text-align : left;\n padding: 0;\n font-size : 18px;\n color: ${colors.black2};\n font-weight: 500;\n span {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n font-weight: 400;\n }\n }\n\n .course-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n ul {\n li {\n border-bottom : 1px solid ${colors.border3};\n margin-left: 25px;\n padding: 12px 0;\n span.play-icon {\n font-size : 14px;\n color: ${colors.text3};\n margin-right: 20px;\n i {\n color: ${colors.green};\n border: 1px solid ${colors.green};\n font-size: 22px;\n width: 30px;\n height: 30px;\n border-radius: 50%;\n padding-left: 3px;\n text-align: center;\n line-height: 29px;\n vertical-align: middle;\n margin-right: 10px;\n }\n }\n span.lecture-title {\n font-size : 15px;\n color: ${colors.black2};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span.lecture-duration {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n line-height: 28px;\n font-weight: 400;\n }\n }\n }\n }\n\n .course-content.show {\n max-height: 100%;\n margin-bottom: 40px;\n }\n\n &:last-child {\n margin-bottom: 40px;\n }\n }\n }\n }\n\n .instructor-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n .instructor-item {\n margin-bottom: 30px;\n\n .instructor-img {\n img {\n border-radius : 5px;\n }\n }\n\n .instructor-content {\n position: relative;\n\n .instructor-box {\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\n padding : 25px;\n background: #ffffff;\n border-radius : 5px;\n position: absolute;\n top : 32px;\n left : -11%;\n z-index : 1;\n\n .top-content {\n margin-bottom: 20px;\n\n .instructor-name {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 12px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n .instructor-social {\n margin-top: 25px;\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 13px;\n color : #ffffff;\n width : 28px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n }\n }\n }\n }\n\n .instructor-desk {\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .review-tab {\n .review-comments {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .comment-box {\n border-bottom: 1px solid ${colors.border1};\n padding-bottom: 20px;\n margin-bottom: 25px;\n .comment-image {\n img {\n max-width : 100px;\n border-radius : 5px;\n margin-right : 20px;\n }\n }\n .comment-content {\n .content-title {\n .comment-writer {\n h6 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom : 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 12px;\n color: ${colors.text3};\n margin-bottom: 5px;\n }\n ul {\n margin-bottom: 8px;\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size: 13px;\n color: ${colors.text2};\n margin-left: 5px;\n }\n }\n }\n }\n .reply-btn {\n button {\n font-size : 14px;\n color: ${colors.green};\n background : transparent;\n border : 1px solid ${colors.border3};\n font-weight: 500;\n border-radius: 25px;\n padding: 4px 12px 3px;\n margin-top : 10px;\n i {\n font-size: 17px;\n vertical-align: text-top;\n }\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n }\n .comment-desc {\n p {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n }\n }\n }\n &:last-child {\n border-bottom : none;\n padding-bottom : 0;\n margin-bottom : 0;\n }\n }\n }\n\n .review-form {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 25px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n\n .single-details-sidbar {\n .course-details-feature {\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n border-radius: 5px;\n padding: 15px 20px 20px;\n h5.title {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n ul.feature-list {\n margin-bottom: 20px;\n li {\n border-top: 1px dashed ${colors.border3};\n padding: 12px 0;\n font-size : 14px;\n color : ${colors.black2};\n font-weight: 500;\n i {\n font-size : 20px;\n color: ${colors.green};\n vertical-align: top;\n margin-right : 2px;\n }\n span {\n float : right;\n font-size: 13px;\n color: ${colors.text3};\n font-weight: 400;\n line-height: 20px;\n }\n &:first-child {\n border-top : none;\n padding-top : 0;\n }\n &:last-child {\n padding-bottom : 0;\n }\n }\n }\n\n button.enroll-btn {\n font-size: 16px;\n color: #fff;\n background: ${colors.gr_bg};\n display: inline-block;\n width: 100%;\n height: 40px;\n font-weight : 500;\n border : none;\n padding: 9px;\n border-radius: 5px;\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n @media(max-width: 1199px) {\n padding: 12px 15px 15px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 20px 0 5px;\n }\n }\n`;","import React, { useEffect, useState } from 'react';\nimport { Container, Row, Col, Tab } from 'react-bootstrap';\nimport HeaderTwo from '../../components/HeaderTwo';\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\nimport FooterTwo from '../../components/FooterTwo';\nimport { Styles } from './styles/cleaning.js';\nimport axios from 'axios';\n\n\nfunction CleaningService() {\n\n const [allServices, setAllServices] = useState([]);\n useEffect(() => {\n const fetchAllServices = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/services/find-all`).then((res) => {\n setAllServices(res.data);\n }).catch(error => {\n console.error(error);\n });\n };\n fetchAllServices();\n },[]);\n\n useEffect(() => {\n document.title = 'Cleaning Service | REAL FM'\n const courseButton = document.querySelectorAll(\".course-button\");\n courseButton.forEach(button => {\n button.addEventListener(\"click\", () => {\n button.classList.toggle(\"active\");\n const content = button.nextElementSibling;\n\n if (button.classList.contains(\"active\")) {\n content.className = \"course-content show\";\n content.style.maxHeight = content.scrollHeight + \"px\";\n } else {\n content.className = \"course-content\";\n content.style.maxHeight = \"0\";\n }\n });\n });\n });\n\n return (\n
\n\n {/* Header 2 */}\n \n\n {/* Breadcroumb */}\n \n\n \n {/* Course Details */}\n
\n \n \n \n
\n \n \n
\n \n \n \n \n {\n allServices !== null && allServices.length > 0 ? allServices.map((service, i) => (\n service.serviceType.toUpperCase() === \"CLEANING\" ? \n \n
\n \n \n \n\n

\n\n \n \n {service.serviceName}\n\n \n \n \n
\n
\n
Our cleaners offer the following services
\n {\n service.servicesIncl !== null && service.servicesIncl.length > 0 ? service.servicesIncl.map((serviceIncl, i) => (\n \n \n \n
    \n
  • {serviceIncl}
    • \n
\n\n \n \n \n )) : \"No included service found\"\n }\n \n
\n : \"\")) : \"No services found\"\n }\n \n \n \n \n \n \n
\n
\n \n \n \n \n
\n \n\n {/* Footer 2 */}\n \n\n
\n )\n}\n\nexport default CleaningService","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n .instructor-page {\n .instructor-area {\n padding: 70px 0;\n .instructor-item {\n position : relative;\n margin-bottom: 62px;\n\n a {\n img {\n border-radius : 5px;\n }\n }\n\n .img-content {\n background: #ffffff;\n box-shadow: 0 10px 18px rgba(0, 0, 0, 0.07);\n position : absolute;\n bottom : -30px;\n left : 10%;\n width : 80%;\n z-index : 1;\n border-radius : 5px;\n padding: 15px 0;\n\n h5 {\n margin-bottom: 5px;\n a {\n color : ${colors.black2};\n font-weight : 600;\n &:hover {\n color : ${colors.green};\n }\n }\n }\n\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight : 500;\n margin-bottom: 5px;\n }\n\n ul {\n li {\n a {\n i {\n font-size: 14px;\n color : #ffffff;\n width : 33px;\n height : 33px;\n border-radius : 50%;\n padding-top: 10px;\n transition : all 0.2s ease;\n\n &:hover {\n background-color: ${colors.green} !important;\n }\n }\n\n i.fa-facebook-f {\n background-color: #4267B2;\n }\n\n i.fa-twitter {\n background-color: #1DA1F2;\n }\n\n i.fa-youtube {\n background-color: #DD1343;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n padding : 40px 0 30px;\n }\n }\n }\n\n .instructor-details-page {\n .instructor-details-area {\n padding : 70px 0 63px;\n .instructor-img {\n margin-bottom : 55px;\n img {\n border-radius : 5px;\n margin-bottom : 20px;\n }\n ul.getintouch {\n margin-bottom: 30px;\n li {\n font-size: 20px;\n color: ${colors.black2};\n font-weight : 500;\n margin-bottom: 5px;\n i {\n font-size: 26px;\n color: ${colors.green};\n vertical-align: text-bottom;\n margin-right: 5px;\n\n @media(max-width: 991px) {\n font-size: 20px;\n }\n }\n\n @media(max-width: 991px) {\n font-size: 16px;\n }\n }\n }\n\n ul.social {\n li {\n margin-right: 10px;\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n\n &:last-child {\n margin-right : 0;\n }\n }\n }\n\n @media(max-width: 575px) {\n margin-bottom: 30px;\n }\n }\n\n .instructor-content {\n h2 {\n color : ${colors.light_blue};\n font-weight: 600;\n margin-bottom: 10px;\n font-size: 24px;\n text-align: center;\n background-color: #182B48;\n padding: 20px;\n border-radius: 6px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n h3 {\n color : #00B4F5;\n font-weight: 500;\n margin-bottom: 10px;\n font-size: 16px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span {\n font-size : 16px;\n color : ${colors.green};\n font-weight: 500;\n display : inline-block;\n margin-bottom: 15px;\n\n @media(max-width: 575px) {\n font-size : 15px;\n }\n }\n p.first-p {\n font-size: 15px;\n color: #000;\n line-height: 25px;\n margin-bottom: 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p.second-p {\n font-size: 15px;\n color: #000;\n line-height: 25px;\n margin-bottom: 40px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .qual-expe {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n\n }\n .qual-expe-box {\n margin-bottom: 20px;\n h6 {\n color: ${colors.black2};\n margin-bottom: 8px;\n font-weight: 600;\n\n @media(max-width: 575px) {\n font-size : 15px;\n }\n }\n p {\n font-size : 15px; \n color: ${colors.text3};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .qualification {\n margin-right : 100px;\n\n @media(max-width: 575px) {\n margin-right : 20px;\n }\n }\n\n @media(max-width: 360px) {\n display: block !important;\n }\n }\n\n .instructor-course-title {\n h4 {\n color: ${colors.light_blue};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n font-size: 18px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n }\n }\n .instructor-course-slider {\n position: relative;\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 220px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n border-radius : 0 0 5px 5px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n\n .slider-dot {\n margin-top: 17px !important;\n\n .swiper-pagination-bullet {\n width : 22px;\n height : 9px;\n background: ${colors.text4};\n display : inline-block;\n margin : 3px;\n opacity : 1 !important;\n border-radius : 5px;\n }\n\n .swiper-pagination-bullet.swiper-pagination-bullet-active {\n background: ${colors.green};\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n }\n`;","import React, { Component } from 'react';\r\nimport Datas from '../../data/service/details.json';\r\nimport { Link } from 'react-router-dom';\r\nimport { Container, Row, Col } from 'react-bootstrap';\r\nimport HeaderTwo from '../../components/HeaderTwo';\r\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\r\nimport FooterTwo from '../../components/FooterTwo';\r\nimport { Styles } from './styles/service.js';\r\nimport axios from 'axios';\r\n\r\nclass Services extends Component {\r\n constructor(props) {\r\n super(props);\r\n this.state = {homePageService: []}\r\n }\r\n componentDidMount(){\r\n document.title = \"Our Services | REAL FM\";\r\n const getHomePageService = async () => {\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/homepage-services/find-all`).then((res) => {\r\n // console.log(\"Slider\" + res.data);\r\n this.setState({homePageService: res.data});\r\n }).catch(error => {\r\n console.error(error);\r\n });\r\n };\r\n getHomePageService();\r\n }\r\n render() {\r\n return (\r\n \r\n {/* Main Wrapper */}\r\n
\r\n\r\n {/* Header 2 */}\r\n \r\n\r\n {/* Breadcroumb */}\r\n \r\n\r\n {/* Instructor Details Area */}\r\n
\r\n \r\n \r\n \r\n \r\n
\r\n

You’re in great hands…



\r\n

RealFM Building Management is an essential investment in your financial security and harmonious community living.

\r\n

Our specialised professionals provide Building Management and Facility Management services to Residential and Commercial buildings throughout the Sydney Metropolitan area.

\r\n

Management and knowledge of complex buildings, BMC structures, By-laws, levy cost centres, and strata plans by our team ensures we can deliver an outstanding building management service.

\r\n
\r\n \r\n \r\n \r\n
\r\n

Our Services Includes

\r\n
\r\n
\r\n \r\n \r\n {\r\n this.state.homePageService && this.state.homePageService.length > 0 ? this.state.homePageService.map((data, i) => (\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n
{data.serviceName}
\r\n \r\n
\r\n
\r\n \r\n\r\n )) : \"No services found\"\r\n }\r\n \r\n \r\n
\r\n \r\n \r\n \r\n
\r\n\r\n {/* Footer 2 */}\r\n \r\n\r\n
\r\n \r\n )\r\n }\r\n}\r\n\r\nexport default Services","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n .contact-page {\n .contact-area {\n padding : 68px 0 0;\n margin-bottom: 58px;\n\n .contact-box-title {\n h4 {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 30px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size: 20px;\n }\n }\n\n \n }\n\n .contact-card:hover {\n box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;\n }\n .contact-border {\n border-top: 1px solid ${colors.border1};\n }\n\n .contact-icon-box {\n margin-bottom: 30px;\n i {\n font-size : 32px;\n color: ${colors.green};\n width: 35px;\n height: 35px;\n text-align: center;\n border-radius : 50%;\n padding-top: 15px;\n margin-top: 5px;\n margin-right : 20px;\n\n @media(max-width: 991px) {\n font-size: 26px;\n width: 50px;\n height: 50px;\n padding-top: 10px;\n margin-right: 12px;\n }\n }\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom: 8px;\n\n @media(max-width: 991px) {\n font-size: 16px;\n }\n }\n .box-content {\n margin-top: 23px;\n .mail-add {\n text-decoration: underline;\n &:hover {\n cursor: pointer;\n color: #00B4F5;\n }\n }\n \n }\n p {\n font-size : 14px;\n color: ${colors.text3};\n\n @media(max-width: 991px) {\n font-size: 13px;\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 20px;\n }\n }\n\n .contact-social {\n margin-top: 45px;\n ul.social {\n li {\n margin-right: 10px;\n a {\n text-align: center;\n position : relative;\n height : 20px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 10px 18px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -20px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 10px 18px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -20px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 15px;\n color : #ffffff;\n width : 36px;\n padding-top: 3px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n\n &:last-child {\n margin-right : 0;\n }\n\n @media(max-width: 991px) {\n margin-right: 6px;\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-top: 30px;\n margin-bottom: 40px;\n }\n }\n\n .contact-form {\n margin-bottom: 70px;\n .form-title {\n h4 {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 30px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size: 20px;\n }\n }\n }\n .form-box {\n form.form {\n p.form-control {\n padding : 0;\n width : auto;\n height : auto;\n background : transparent;\n border : none;\n margin-bottom: 28px;\n position : relative;\n\n input {\n width : 100%;\n height : 46px;\n background-color: #ffffff;\n font-size : 14px;\n padding : 15px 20px;\n color : ${colors.black1};\n border : 1px solid ${colors.border3};\n border-radius : 5px;\n\n &::placeholder {\n font-size : 14px;\n color : ${colors.text2};\n }\n\n &:focus {\n border-color : ${colors.green};\n }\n\n @media(max-width: 480px) {\n height: 38px;\n }\n }\n\n textarea {\n width : 100%;\n height : 135px;\n background-color: #ffffff;\n font-size : 14px;\n padding : 15px 20px;\n color : ${colors.black1};\n border : 1px solid ${colors.border3};\n border-radius : 5px;\n\n &::placeholder {\n font-size : 14px;\n color : ${colors.text2};\n }\n\n &:focus {\n border-color : ${colors.green};\n }\n\n @media(max-width: 480px) {\n height: 120px;\n }\n }\n\n span {\n color : ${colors.red};\n font-weight: 300;\n position : absolute;\n bottom : -20px;\n left : 0;\n visibility : hidden;\n }\n }\n\n p.form-control.success {\n input,\n textarea {\n border: 2px solid ${colors.green};\n }\n\n &::before {\n position : absolute;\n content : \"\\f058\";\n font-family: \"Line Awesome Free\";\n font-size : 24px;\n color : ${colors.green};\n font-weight: 900;\n top : 5px;\n right : 10px;\n }\n }\n\n p.form-control.error {\n input,\n textarea {\n border: 2px solid ${colors.red};\n }\n\n &::before {\n position : absolute;\n content : \"\\f06a\";\n font-family: \"Line Awesome Free\";\n font-size : 24px;\n color : ${colors.red};\n font-weight: 900;\n top : 5px;\n right : 10px;\n }\n }\n\n p.form-control.error {\n span {\n visibility: visible;\n }\n }\n\n button {\n font-size : 16px;\n color : #fff;\n background : ${colors.gr_bg};\n width : 100%;\n height : 48px;\n font-weight: 500;\n border : none;\n border-radius : 5px;\n text-transform: uppercase;\n\n &:hover {\n background: ${colors.gr_bg2};\n\n i {\n color: #ffffff;\n }\n }\n\n @media(max-width: 575px) {\n font-size: 14px;\n }\n\n @media(max-width: 480px) {\n height: 38px;\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n .google-map-area {\n width: 100%;\n height: 450px;\n\n @media(max-width: 767px) {\n height: 370px;\n }\n\n @media(max-width: 480px) {\n height: 320px;\n }\n }\n\n @media(max-width: 767px) {\n padding : 30px 0 0;\n }\n }\n\n .contact-logo-info {\n img {\n max-width : 100%;\n margin-bottom: 30px;\n\n @media(max-width: 767px) {\n margin-bottom: 18px;\n }\n }\n }\n }\n`;","import { GET_CONTACTS } from '../constants/contact';\r\nimport { SHOW_LOADING, HIDE_LOADING } from '../constants/commons';\r\n\r\n\r\nexport const getContacts = (contacts) => {\r\n return {\r\n type: GET_CONTACTS,\r\n payload: contacts\r\n }\r\n}\r\n\r\n\r\n\r\nexport const showLoading = () => {\r\n return {\r\n type: SHOW_LOADING\r\n }\r\n}\r\n\r\nexport const hideLoading = () => {\r\n return {\r\n type: HIDE_LOADING\r\n }\r\n}","export const GET_CONTACTS = 'GET_CONTACTS';\r\n\r\n\r\n","import React, {useEffect} from 'react';\r\nimport { Container, Row, Col } from 'react-bootstrap';\r\nimport HeaderTwo from '../../components/HeaderTwo';\r\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\r\nimport FooterTwo from '../../components/FooterTwo';\r\nimport { Styles } from './styles/contact.js';\r\nimport { useDispatch, useSelector, connect } from 'react-redux';\r\nimport { getContacts, showLoading, hideLoading } from '../../redux/actions/contact';\r\nimport axios from 'axios';\r\n\r\nfunction Contact() {\r\n \r\n const contacts = useSelector(state => state.allContacts.contacts);\r\n\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n document.title = 'Contact | REAL FM';\r\n });\r\n useEffect(() => {\r\n const fetchAllContacts = async () => {\r\n dispatch(showLoading());\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/contacts/find-all`).then((res) => {\r\n dispatch(getContacts(res.data));\r\n dispatch(hideLoading());\r\n\r\n }).catch(error => {\r\n console.error(error);\r\n });\r\n };\r\n fetchAllContacts();\r\n }, [dispatch]);\r\n\r\n return (\r\n \r\n {/* Main Wrapper */}\r\n
\r\n\r\n {/* Header 2 */}\r\n \r\n\r\n {/* Breadcroumb */}\r\n \r\n\r\n {/* Contact Area */}\r\n
\r\n \r\n
\r\n

Contact Info

\r\n
\r\n \r\n {\r\n contacts !== null && contacts.length > 0 ? contacts.map((contact, i) => (\r\n \r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
{contact.contactName}
\r\n

{contact.designation}

\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
{contact.phoneOne}
\r\n
{contact.phoneTwo}
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
window.location = `mailto:${contact.emailOne}?subject=Email From Website&body=Dear Concerned, %0A `}>\r\n {contact.emailOne}
\r\n
\r\n
\r\n
\r\n \r\n \"\"\r\n
\r\n \r\n )): \"No contact found\"\r\n }\r\n {/* \r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
Murray Cameron
\r\n

Director

\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
9930 0730
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
window.location = 'mailto:mcameron@realfm.net.au?subject=Email From Website&body=Dear Concerned, %0A '}>mcameron@realfm.net.au
\r\n
\r\n
\r\n
\r\n \"\"\r\n
\r\n */}\r\n \r\n {/* \r\n \r\n
\r\n
\r\n \r\n
\r\n
\r\n
Wendy Kenny
\r\n

Business Development Manager

\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
0411 406 481
\r\n
\r\n
\r\n
\r\n
\r\n \r\n
\r\n
\r\n
window.location = 'mailto:bdm@realfm.net.au?subject=Email From Website&body=Dear Concerned, %0A '}>bdm@realfm.net.au
\r\n
\r\n
\r\n
\r\n \"\"\r\n
\r\n \r\n */}\r\n \r\n \r\n \r\n\r\n \r\n
\r\n\r\n {/* Footer 2 */}\r\n \r\n\r\n
\r\n \r\n )\r\n}\r\n\r\nexport default Contact","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n .error-page {\n .error-area {\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n padding: 80px 0 120px;\n position: relative;\n &:before {\n position: absolute;\n content: '';\n background: rgba(255, 255, 255, 0.92);\n opacity: 0.9;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n }\n .error-box {\n h1 {\n font-size : 192px;\n color : ${colors.black1};\n font-weight: 600;\n span {\n color : ${colors.green};\n }\n\n @media(max-width: 575px) {\n font-size : 120px;\n }\n }\n h3 {\n color : ${colors.black2};\n font-weight : 600;\n margin-bottom: 20px;\n\n @media(max-width: 575px) {\n font-size : 22px;\n }\n }\n p {\n font-size : 17px;\n color : ${colors.text1};\n font-weight: 500;\n margin-bottom: 40px;\n }\n a {\n font-size: 18px;\n background : ${colors.gr_bg};\n color : #ffffff;\n padding: 12px 30px;\n font-weight: 500;\n border-radius: 5px;\n display : inline-block;\n i {\n margin-right: 6px;\n }\n &:hover {\n background : ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size: 15px;\n padding: 10px 20px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 30px 0 75px;\n }\n\n @media(max-width: 575px) {\n padding: 30px 0 55px;\n }\n }\n }\n`;","import React, { Component } from 'react';\nimport Datas from '../../data/404/error.json';\nimport { Link } from 'react-router-dom';\nimport { Container, Row, Col } from 'react-bootstrap';\nimport HeaderTwo from '../../components/HeaderTwo';\nimport FooterTwo from '../../components/FooterTwo';\nimport { Styles } from './styles/pageNotFound.js';\n\nclass PageNotFound extends Component {\n render() {\n return (\n \n {/* Main Wrapper */}\n
\n\n {/* Header 2 */}\n \n\n {/* 404 Area */}\n
\n \n \n \n
\n

404

\n

Page Not Found

\n

Ooops! The page you are looking for, couldn't be found.

\n Go To Homepage\n
\n \n \n \n
\n\n {/* Footer 2 */}\n \n
\n \n )\n }\n}\n\nexport default PageNotFound","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n .product-page {\n .product-area {\n padding : 70px 0;\n .product-box {\n border: 1px solid ${colors.border1};\n border-radius: 5px;\n transition: all 0.2s ease;\n margin-bottom: 30px;\n .product-img {\n position: relative;\n overflow : hidden;\n img {\n transform: scale(1);\n transition: 0.3s ease;\n }\n span {\n position: absolute;\n content : '';\n background : ${colors.gr_bg};\n width: auto;\n height: 55px;\n text-align: center;\n left: 15px;\n top: 15px;\n font-size: 18px;\n color: #fff;\n font-weight: 600;\n padding: 15px;\n border-radius: 10%;\n }\n .layer-box {\n position: absolute;\n background: rgba(255, 255, 255, 0.8);\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n visibility: hidden;\n opacity: 0;\n z-index: -1;\n transition: 0.3s ease;\n }\n a.add_cart {\n position: absolute;\n font-size : 15px;\n top : 33%;\n left : 100%;\n z-index : 1;\n background: transparent;\n border : 2px solid ${colors.green};\n font-size: 13px;\n color: ${colors.green};\n font-weight: 600;\n text-transform: uppercase;\n width: 120px;\n height: 38px;\n border-radius: 5px;\n padding-top: 8px;\n text-align: center;\n transition: 0.2s ease;\n &:hover {\n background: ${colors.gr_bg};\n color : #ffffff;\n }\n\n @media(max-width: 1199px) {\n top: 30%;\n }\n\n @media(max-width: 767px) {\n top: 35%;\n }\n }\n a.item_view {\n position: absolute;\n font-size : 15px;\n bottom : 33%;\n right : 100%;\n z-index : 1;\n background: transparent;\n border : 2px solid ${colors.black1};\n font-size: 13px;\n color: ${colors.black1};\n font-weight: 600;\n text-transform: uppercase;\n width: 120px;\n height: 38px;\n border-radius: 5px;\n padding-top: 8px;\n text-align: center;\n transition: 0.2s ease;\n &:hover {\n background: ${colors.black1};\n color : #ffffff;\n }\n\n @media(max-width: 1199px) {\n bottom: 30%;\n }\n\n @media(max-width: 767px) {\n bottom: 35%;\n }\n }\n &:hover {\n img {\n transform: scale(1.1);\n }\n .layer-box {\n visibility: visible;\n z-index: 1;\n ${'' /* opacity: 1; */}\n }\n a.add_cart {\n left: 35%;\n margin-left: -22px;\n\n @media(max-width: 1199px) {\n left: 32%;\n margin-left: -22px;\n }\n\n @media(max-width: 767px) {\n left: 50%;\n margin-left: -60px;\n }\n }\n a.item_view {\n right : 35%;\n margin-right: -22px;\n\n @media(max-width: 1199px) {\n right: 32%;\n margin-right: -24px;\n }\n\n @media(max-width: 767px) {\n right: 50%;\n margin-right: -60px;\n }\n }\n }\n }\n\n .product-content {\n padding : 15px 0;\n .pro-title {\n margin-bottom: 6px;\n h5 {\n a {\n color : ${colors.black1};\n font-weight: 600;\n &:hover {\n color : ${colors.green};\n }\n }\n }\n }\n .pro-rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 15px;\n color: ${colors.yellow};\n }\n &:last-child {\n margin-right: 0;\n }\n }\n }\n }\n\n .pro-price {\n p {\n font-size : 16px;\n color: ${colors.green};\n font-weight: 500;\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0,0,0,0.07);\n }\n }\n\n @media(max-width: 767px) {\n padding : 35px 0 30px;\n }\n\n @media(max-width: 575px) {\n padding-bottom : 0;\n }\n }\n }\n`;","import { GET_PRODUCTS } from '../constants/product';\r\nimport { SHOW_LOADING, HIDE_LOADING } from '../constants/commons';\r\n\r\n\r\nexport const getProducts = (products) => {\r\n return {\r\n type: GET_PRODUCTS,\r\n payload: products\r\n }\r\n}\r\n\r\n\r\n\r\nexport const showLoading = () => {\r\n return {\r\n type: SHOW_LOADING\r\n }\r\n}\r\n\r\nexport const hideLoading = () => {\r\n return {\r\n type: HIDE_LOADING\r\n }\r\n}","export const GET_PRODUCTS = 'GET_PRODUCTS';\r\nexport const SET_PRODUCT = 'SET_PRODUCT';\r\n\r\n\r\n","import React, { useEffect } from 'react';\r\nimport { Container, Row, Col } from 'react-bootstrap';\r\nimport HeaderTwo from '../../components/HeaderTwo';\r\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\r\nimport FooterTwo from '../../components/FooterTwo';\r\nimport { Styles } from './styles/product.js';\r\nimport { useDispatch, useSelector } from 'react-redux';\r\nimport axios from 'axios';\r\nimport { connect } from \"react-redux\";\r\nimport { getProducts, showLoading, hideLoading } from '../../redux/actions/product';\r\n\r\nconst Product = () => {\r\n const products = useSelector(state => state.allProducts.products);\r\n\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n document.title = \"Our Experience | REAL FM\";\r\n },[]);\r\n\r\n useEffect(() => {\r\n const fetchAllProducts = async () => {\r\n dispatch(showLoading());\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/products/find-all`).then((res) => {\r\n dispatch(getProducts(res.data));\r\n dispatch(hideLoading());\r\n\r\n }).catch(error => {\r\n console.error(error);\r\n });\r\n //dispatch(getProducts(response.data));\r\n };\r\n fetchAllProducts();\r\n }, [dispatch]);\r\n\r\n return (\r\n \r\n {/* Main Wrapper */}\r\n
\r\n\r\n {/* Header 2 */}\r\n \r\n\r\n\r\n {/* Breadcroumb */}\r\n \r\n\r\n {/* Products */}\r\n
\r\n \r\n \r\n \r\n \r\n {\r\n products !==null && products.length > 0 ? products.map((data, i) => (\r\n \r\n
\r\n
\r\n {data.productTitle}\r\n {/* \"\" */}\r\n
\r\n \r\n
\r\n
\r\n
\r\n
{data.productTitle}
\r\n
\r\n \r\n
\r\n
\r\n \r\n )): \"No products found\"\r\n }\r\n\r\n \r\n \r\n\r\n \r\n \r\n
\r\n\r\n {/* Footer 2 */}\r\n \r\n\r\n
\r\n \r\n )\r\n}\r\n\r\nconst mapStateToProps = state => ({});\r\n\r\nexport default connect(mapStateToProps)(Product);","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n\n /* Course Grid */\n .course-grid-area {\n padding: 70px 0;\n .course-items {\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 240px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n\n @media(max-width: 767px) {\n height: 185px;\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course List */\n .course-list-area {\n padding: 70px 0;\n .course-items2 {\n .course-item {\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n box-shadow: 0 8px 20px 5px rgba(0,0,0,0.07);\n margin-bottom: 30px;\n\n .course-image-box {\n .course-image {\n width : 290px;\n height : 230px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n top : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n top : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n }\n\n @media(max-width: 991px) {\n width: 100%;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n padding-bottom: 12px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n .rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom : 15px;\n }\n\n a.details-btn {\n font-size : 13px;\n color : ${colors.green};\n border : 1px solid ${colors.border3};\n padding: 7px 15px;\n border-radius: 5px;\n font-weight: 500;\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\n }\n\n @media(max-width: 991px) {\n display : block !important;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course Details */\n .course-details-area {\n padding : 70px 0 20px;\n .course-details-top {\n .heading {\n h4 {\n color : ${colors.black1};\n font-weight: 600;\n line-height: 35px;\n margin-bottom: 25px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n }\n .course-top-overview {\n margin-bottom : 25px;\n .overviews {\n .author {\n margin-right : 20px;\n padding-right : 20px;\n margin-top: -3px;\n border-right : 1px solid ${colors.border3};\n img {\n float : left;\n max-width: 50px;\n border-radius: 50%;\n margin-right: 10px;\n }\n .author-name {\n float : left;\n margin-top: 3px;\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n .category {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n\n .rating {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n margin-left: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n .price {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n @media(max-width: 480px) {\n display : none;\n }\n }\n .course-details-banner {\n margin-bottom: 40px;\n img {\n border-radius : 5px;\n }\n }\n .course-tab-list {\n .nav {\n display: inline-block;\n border-radius: 5px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n margin-bottom: 35px;\n .nav-item {\n display: inline-block;\n a.nav-link {\n font-size: 14px;\n color: ${colors.black2};\n font-weight: 500;\n text-transform : uppercase;\n padding: 12px 30px 10px;\n border-radius: 5px;\n\n @media(max-width: 991px) {\n padding: 12px 16px 9px;\n }\n }\n a.nav-link.active {\n background : ${colors.gr_bg};\n color : #ffffff;\n }\n }\n }\n .tab-content {\n .overview-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n font-size: 15px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n .course-desc {\n margin-bottom: 40px;\n }\n\n .course-feature {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size : 14px;\n color: ${colors.text3};\n line-height : 25px;\n margin-bottom : 10px;\n i {\n font-size : 20px;\n color: ${colors.green};\n float: left;\n height: 40px;\n line-height: 27px;\n margin-right: 10px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n p {\n text-align: justify;\n color: #000;\n font-size: 15px;\n }\n }\n\n .avail {\n h4 {\n font-size : 20px;\n color: #00B4F5;\n font-weight: 600;\n margin-bottom: 15px;\n }\n @media(max-width: 575px) {\n font-size : 12px;\n }\n }\n .course-learn {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size: 14px;\n color: #000;\n line-height: 25px;\n margin-bottom: 15px;\n i {\n ${'' /* float: left; */}\n color: ${colors.green};\n width: 35px;\n height: 35px;\n border-radius: 50%;\n text-align: center;\n padding-top: 9px;\n margin-top: 8px;\n margin-right: 15px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n h5 {\n color: ${colors.light_blue};\n font-size: 15px;\n margin: 0px;\n }\n }\n .course-share {\n ul.social {\n margin-top: 30px;\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n }\n .curriculum-tab {\n .course-curriculum {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .course-element {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .course-item {\n margin-bottom: 10px;\n button.course-button {\n border: none;\n background: transparent;\n margin-bottom: 15px;\n display: block;\n width: 100%;\n text-align : left;\n padding: 0;\n font-size : 18px;\n color: ${colors.black2};\n font-weight: 500;\n span {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n font-weight: 400;\n }\n }\n\n .course-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n ul {\n li {\n border-bottom : 1px solid ${colors.border3};\n margin-left: 25px;\n padding: 12px 0;\n span.play-icon {\n font-size : 14px;\n color: ${colors.text3};\n margin-right: 20px;\n i {\n color: ${colors.green};\n border: 1px solid ${colors.green};\n font-size: 22px;\n width: 30px;\n height: 30px;\n border-radius: 50%;\n padding-left: 3px;\n text-align: center;\n line-height: 29px;\n vertical-align: middle;\n margin-right: 10px;\n }\n }\n span.lecture-title {\n font-size : 15px;\n color: ${colors.black2};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span.lecture-duration {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n line-height: 28px;\n font-weight: 400;\n }\n }\n }\n }\n\n .course-content.show {\n max-height: 100%;\n margin-bottom: 40px;\n }\n\n &:last-child {\n margin-bottom: 40px;\n }\n }\n }\n }\n\n .instructor-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n .instructor-item {\n margin-bottom: 30px;\n\n .instructor-img {\n img {\n border-radius : 5px;\n }\n }\n\n .instructor-content {\n position: relative;\n\n .instructor-box {\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\n padding : 25px;\n background: #ffffff;\n border-radius : 5px;\n position: absolute;\n top : 32px;\n left : -11%;\n z-index : 1;\n\n .top-content {\n margin-bottom: 20px;\n\n .instructor-name {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 12px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n .instructor-social {\n margin-top: 25px;\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 13px;\n color : #ffffff;\n width : 28px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n }\n }\n }\n }\n\n .instructor-desk {\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .review-tab {\n .review-comments {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .comment-box {\n border-bottom: 1px solid ${colors.border1};\n padding-bottom: 20px;\n margin-bottom: 25px;\n .comment-image {\n img {\n max-width : 100px;\n border-radius : 5px;\n margin-right : 20px;\n }\n }\n .comment-content {\n .content-title {\n .comment-writer {\n h6 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom : 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 12px;\n color: ${colors.text3};\n margin-bottom: 5px;\n }\n ul {\n margin-bottom: 8px;\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size: 13px;\n color: ${colors.text2};\n margin-left: 5px;\n }\n }\n }\n }\n .reply-btn {\n button {\n font-size : 14px;\n color: ${colors.green};\n background : transparent;\n border : 1px solid ${colors.border3};\n font-weight: 500;\n border-radius: 25px;\n padding: 4px 12px 3px;\n margin-top : 10px;\n i {\n font-size: 17px;\n vertical-align: text-top;\n }\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n }\n .comment-desc {\n p {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n }\n }\n }\n &:last-child {\n border-bottom : none;\n padding-bottom : 0;\n margin-bottom : 0;\n }\n }\n }\n\n .review-form {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 25px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n\n .single-details-sidbar {\n .course-details-feature {\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n border-radius: 5px;\n padding: 15px 20px 20px;\n h5.title {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n ul.feature-list {\n margin-bottom: 20px;\n li {\n border-top: 1px dashed ${colors.border3};\n padding: 12px 0;\n font-size : 14px;\n color : ${colors.black2};\n font-weight: 500;\n i {\n font-size : 20px;\n color: ${colors.green};\n vertical-align: top;\n margin-right : 2px;\n }\n span {\n float : right;\n font-size: 13px;\n color: ${colors.text3};\n font-weight: 400;\n line-height: 20px;\n }\n &:first-child {\n border-top : none;\n padding-top : 0;\n }\n &:last-child {\n padding-bottom : 0;\n }\n }\n }\n\n button.enroll-btn {\n font-size: 16px;\n color: #fff;\n background: ${colors.gr_bg};\n display: inline-block;\n width: 100%;\n height: 40px;\n font-weight : 500;\n border : none;\n padding: 9px;\n border-radius: 5px;\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n @media(max-width: 1199px) {\n padding: 12px 15px 15px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 20px 0 5px;\n }\n }\n`;","import React, { useEffect, useState } from 'react';\nimport { Container, Row, Col, Tab } from 'react-bootstrap';\nimport HeaderTwo from '../../components/HeaderTwo';\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\nimport FooterTwo from '../../components/FooterTwo';\nimport { Styles } from './styles/gardeningLandscaping.js';\nimport axios from 'axios';\n\nfunction GardeningLandscaping() {\n\n const [allServices, setAllServices] = useState([]);\n\n useEffect(() => {\n const fetchAllServices = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/services/find-all`).then((res) => {\n setAllServices(res.data);\n }).catch(error => {\n console.error(error);\n });\n };\n fetchAllServices();\n },[]);\n \n useEffect(() => {\n document.title = 'Gardening And Landscaping Service | REAL FM';\n const courseButton = document.querySelectorAll(\".course-button\");\n courseButton.forEach(button => {\n button.addEventListener(\"click\", () => {\n button.classList.toggle(\"active\");\n const content = button.nextElementSibling;\n\n if (button.classList.contains(\"active\")) {\n content.className = \"course-content show\";\n content.style.maxHeight = content.scrollHeight + \"px\";\n } else {\n content.className = \"course-content\";\n content.style.maxHeight = \"0\";\n }\n });\n });\n });\n\n return (\n
\n\n {/* Header 2 */}\n \n\n {/* Breadcroumb */}\n \n\n \n {/* Course Details */}\n
\n \n \n \n
\n \n
\n \n \n \n \n {\n allServices !== null && allServices.length > 0 ? allServices.map((service, i) => (\n service.serviceType.toUpperCase() === \"GARDENING & LANDSCAPING\" ? \n \n
\n \n \n {service.serviceName}\n \n \n

\n \n \n \n
\n
\n
Our gardening and landscaping services include:
\n\n {\n service.servicesIncl !== null && service.servicesIncl.length > 0 ? service.servicesIncl.map((serviceIncl, i) => (\n \n \n \n
    \n
  • {serviceIncl}
    • \n
\n\n \n \n \n )) : \"No included service found\"\n } \n
\n : \"\")) : \"No services found\"\n }\n \n \n\n \n \n \n \n \n
\n
\n \n \n \n \n
\n \n\n {/* Footer 2 */}\n \n\n
\n )\n}\n\nexport default GardeningLandscaping","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n\n /* Course Grid */\n .course-grid-area {\n padding: 70px 0;\n .course-items {\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 240px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n\n @media(max-width: 767px) {\n height: 185px;\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course List */\n .course-list-area {\n padding: 70px 0;\n .course-items2 {\n .course-item {\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n box-shadow: 0 8px 20px 5px rgba(0,0,0,0.07);\n margin-bottom: 30px;\n\n .course-image-box {\n .course-image {\n width : 290px;\n height : 230px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n top : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n top : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n }\n\n @media(max-width: 991px) {\n width: 100%;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n padding-bottom: 12px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n .rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom : 15px;\n }\n\n a.details-btn {\n font-size : 13px;\n color : ${colors.green};\n border : 1px solid ${colors.border3};\n padding: 7px 15px;\n border-radius: 5px;\n font-weight: 500;\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\n }\n\n @media(max-width: 991px) {\n display : block !important;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course Details */\n .course-details-area {\n padding : 70px 0 20px;\n .course-details-top {\n .heading {\n h4 {\n color : ${colors.black1};\n font-weight: 600;\n line-height: 35px;\n margin-bottom: 25px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n }\n .course-top-overview {\n margin-bottom : 25px;\n .overviews {\n .author {\n margin-right : 20px;\n padding-right : 20px;\n margin-top: -3px;\n border-right : 1px solid ${colors.border3};\n img {\n float : left;\n max-width: 50px;\n border-radius: 50%;\n margin-right: 10px;\n }\n .author-name {\n float : left;\n margin-top: 3px;\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n .category {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n\n .rating {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n margin-left: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n .price {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n @media(max-width: 480px) {\n display : none;\n }\n }\n .course-details-banner {\n margin-bottom: 40px;\n img {\n border-radius : 5px;\n }\n }\n .course-tab-list {\n .nav {\n display: inline-block;\n border-radius: 5px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n margin-bottom: 35px;\n .nav-item {\n display: inline-block;\n a.nav-link {\n font-size: 14px;\n color: ${colors.black2};\n font-weight: 500;\n text-transform : uppercase;\n padding: 12px 30px 10px;\n border-radius: 5px;\n\n @media(max-width: 991px) {\n padding: 12px 16px 9px;\n }\n }\n a.nav-link.active {\n background : ${colors.gr_bg};\n color : #ffffff;\n }\n }\n }\n .tab-content {\n .overview-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n font-size: 15px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n .course-desc {\n margin-bottom: 40px;\n }\n\n .course-feature {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size : 14px;\n color: #000;\n line-height : 25px;\n margin-bottom : 10px;\n i {\n font-size : 20px;\n color: ${colors.green};\n float: left;\n height: 40px;\n line-height: 27px;\n margin-right: 10px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n p {\n text-align: justify;\n color: #000;\n font-size: 15px;\n }\n \n }\n\n \n\n .avail {\n h4 {\n font-size : 20px;\n color: #00B4F5;\n font-weight: 600;\n margin-bottom: 15px;\n }\n @media(max-width: 575px) {\n font-size : 12px;\n }\n }\n .course-learn {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size: 14px;\n color: #000;\n line-height: 25px;\n margin-bottom: 15px;\n i {\n color: ${colors.green};\n width: 35px;\n height: 35px;\n border-radius: 50%;\n text-align: center;\n padding-top: 9px;\n margin-top: 8px;\n margin-right: 15px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n h5 {\n color: ${colors.light_blue};\n font-size: 15px;\n margin: 0px;\n }\n }\n .course-share {\n ul.social {\n margin-top: 30px;\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n }\n .curriculum-tab {\n .course-curriculum {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .course-element {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .course-item {\n margin-bottom: 10px;\n button.course-button {\n border: none;\n background: transparent;\n margin-bottom: 15px;\n display: block;\n width: 100%;\n text-align : left;\n padding: 0;\n font-size : 18px;\n color: ${colors.black2};\n font-weight: 500;\n span {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n font-weight: 400;\n }\n }\n\n .course-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n ul {\n li {\n border-bottom : 1px solid ${colors.border3};\n margin-left: 25px;\n padding: 12px 0;\n span.play-icon {\n font-size : 14px;\n color: ${colors.text3};\n margin-right: 20px;\n i {\n color: ${colors.green};\n border: 1px solid ${colors.green};\n font-size: 22px;\n width: 30px;\n height: 30px;\n border-radius: 50%;\n padding-left: 3px;\n text-align: center;\n line-height: 29px;\n vertical-align: middle;\n margin-right: 10px;\n }\n }\n span.lecture-title {\n font-size : 15px;\n color: ${colors.black2};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span.lecture-duration {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n line-height: 28px;\n font-weight: 400;\n }\n }\n }\n }\n\n .course-content.show {\n max-height: 100%;\n margin-bottom: 40px;\n }\n\n &:last-child {\n margin-bottom: 40px;\n }\n }\n }\n }\n\n .instructor-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n .instructor-item {\n margin-bottom: 30px;\n\n .instructor-img {\n img {\n border-radius : 5px;\n }\n }\n\n .instructor-content {\n position: relative;\n\n .instructor-box {\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\n padding : 25px;\n background: #ffffff;\n border-radius : 5px;\n position: absolute;\n top : 32px;\n left : -11%;\n z-index : 1;\n\n .top-content {\n margin-bottom: 20px;\n\n .instructor-name {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 12px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n .instructor-social {\n margin-top: 25px;\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 13px;\n color : #ffffff;\n width : 28px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n }\n }\n }\n }\n\n .instructor-desk {\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .review-tab {\n .review-comments {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .comment-box {\n border-bottom: 1px solid ${colors.border1};\n padding-bottom: 20px;\n margin-bottom: 25px;\n .comment-image {\n img {\n max-width : 100px;\n border-radius : 5px;\n margin-right : 20px;\n }\n }\n .comment-content {\n .content-title {\n .comment-writer {\n h6 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom : 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 12px;\n color: ${colors.text3};\n margin-bottom: 5px;\n }\n ul {\n margin-bottom: 8px;\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size: 13px;\n color: ${colors.text2};\n margin-left: 5px;\n }\n }\n }\n }\n .reply-btn {\n button {\n font-size : 14px;\n color: ${colors.green};\n background : transparent;\n border : 1px solid ${colors.border3};\n font-weight: 500;\n border-radius: 25px;\n padding: 4px 12px 3px;\n margin-top : 10px;\n i {\n font-size: 17px;\n vertical-align: text-top;\n }\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n }\n .comment-desc {\n p {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n }\n }\n }\n &:last-child {\n border-bottom : none;\n padding-bottom : 0;\n margin-bottom : 0;\n }\n }\n }\n\n .review-form {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 25px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n\n .single-details-sidbar {\n .course-details-feature {\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n border-radius: 5px;\n padding: 15px 20px 20px;\n h5.title {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n ul.feature-list {\n margin-bottom: 20px;\n li {\n border-top: 1px dashed ${colors.border3};\n padding: 12px 0;\n font-size : 14px;\n color : ${colors.black2};\n font-weight: 500;\n i {\n font-size : 20px;\n color: ${colors.green};\n vertical-align: top;\n margin-right : 2px;\n }\n span {\n float : right;\n font-size: 13px;\n color: ${colors.text3};\n font-weight: 400;\n line-height: 20px;\n }\n &:first-child {\n border-top : none;\n padding-top : 0;\n }\n &:last-child {\n padding-bottom : 0;\n }\n }\n }\n\n button.enroll-btn {\n font-size: 16px;\n color: #fff;\n background: ${colors.gr_bg};\n display: inline-block;\n width: 100%;\n height: 40px;\n font-weight : 500;\n border : none;\n padding: 9px;\n border-radius: 5px;\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n @media(max-width: 1199px) {\n padding: 12px 15px 15px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 20px 0 5px;\n }\n }\n`;","import React, { useEffect, useState } from 'react';\nimport { Container, Row, Col, Tab } from 'react-bootstrap';\nimport HeaderTwo from '../../components/HeaderTwo';\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\nimport FooterTwo from '../../components/FooterTwo';\nimport { Styles } from './styles/projectDeveloper.js';\nimport axios from 'axios';\n\n\nfunction ProjectAndDeveloperService() {\n const [allServices, setAllServices] = useState([]);\n\n useEffect(() => {\n const fetchAllServices = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/services/find-all`).then((res) => {\n setAllServices(res.data);\n }).catch(error => {\n console.error(error);\n });\n };\n fetchAllServices();\n },[]);\n \n\n useEffect(() => {\n document.title = 'Project and Developer Service | REAL FM';\n const courseButton = document.querySelectorAll(\".course-button\");\n courseButton.forEach(button => {\n button.addEventListener(\"click\", () => {\n button.classList.toggle(\"active\");\n const content = button.nextElementSibling;\n\n if (button.classList.contains(\"active\")) {\n content.className = \"course-content show\";\n content.style.maxHeight = content.scrollHeight + \"px\";\n } else {\n content.className = \"course-content\";\n content.style.maxHeight = \"0\";\n }\n });\n });\n });\n\n return (\n
\n\n {/* Header 2 */}\n \n\n {/* Breadcroumb */}\n \n\n \n {/* Course Details */}\n
\n \n \n \n
\n \n {/*
\n \"\"\n
*/}\n
\n \n \n \n \n {\n allServices !== null && allServices.length > 0 ? allServices.map((service, i) => (\n service.serviceType.toUpperCase() === \"PROJECT & DEVELOPING\" ? \n \n
\n \n \n {service.serviceName}\n \n \n

\n \n \n \n
\n
\n
Our New Project and Developer Services include:
\n\n {\n service.servicesIncl !== null && service.servicesIncl.length > 0 ? service.servicesIncl.map((serviceIncl, i) => (\n \n \n \n
    \n
  • {serviceIncl}
    • \n
\n\n \n \n \n )) : \"No included service found\"\n } \n
\n : \"\")) : \"No services found\"\n }\n \n \n \n \n \n \n
\n
\n \n \n \n \n
\n \n\n {/* Footer 2 */}\n \n\n
\n )\n}\n\nexport default ProjectAndDeveloperService","import styled from \"styled-components\";\nimport { colors } from \"../../../components/common/element/elements.js\";\n\nexport const Styles = styled.div`\n\n /* Course Grid */\n .course-grid-area {\n padding: 70px 0;\n .course-items {\n .course-item {\n border: 1px solid ${colors.border1};\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n margin-bottom: 30px;\n\n .course-image {\n width : 100%;\n height : 240px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n bottom : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n bottom : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n }\n }\n\n @media(max-width: 767px) {\n height: 185px;\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n margin-bottom: 12px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n border-bottom : 1px solid ${colors.border1};\n padding-bottom: 10px;\n margin-bottom : 12px;\n }\n\n .course-face {\n\n .duration,\n .student {\n p {\n font-size: 13px;\n color : ${colors.text3};\n\n i {\n font-size : 16px;\n color : ${colors.green};\n vertical-align: text-bottom;\n margin-right : 3px;\n }\n }\n }\n\n .rating {\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course List */\n .course-list-area {\n padding: 70px 0;\n .course-items2 {\n .course-item {\n border-radius : 5px;\n transition : all 0.2s ease;\n overflow : hidden;\n box-shadow: 0 8px 20px 5px rgba(0,0,0,0.07);\n margin-bottom: 30px;\n\n .course-image-box {\n .course-image {\n width : 290px;\n height : 230px;\n background-size : cover;\n background-position: center;\n background-repeat : no-repeat;\n border-radius : 5px 5px 0 0;\n position: relative;\n\n .author-img {\n position: absolute;\n left : 20px;\n top : 20px;\n\n img {\n max-width: 40px;\n border-radius : 50%;\n margin-right: 5px;\n }\n\n .title {\n background: #ffffff;\n padding : 3px 8px;\n border-radius : 5px;\n\n p {\n font-size : 12px;\n color : ${colors.black1};\n font-weight : 500;\n margin-bottom: -4px;\n }\n\n span {\n font-size : 11px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n\n .course-price {\n p {\n font-size : 16px;\n color : #ffffff;\n background : ${colors.bg1};\n position : absolute;\n right : 20px;\n top : 20px;\n padding : 8px 10px;\n font-weight: 500;\n border-radius : 5px;\n\n @media(max-width: 991px) {\n top : unset;\n bottom : 20px;\n }\n }\n }\n\n @media(max-width: 991px) {\n width: 100%;\n }\n }\n }\n\n .course-content {\n background: #fff;\n padding : 20px 25px;\n\n h6.heading {\n padding-bottom: 12px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n a {\n color : ${colors.black1};\n font-weight : 600;\n display : inline-block;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n .rating {\n margin-bottom: 6px;\n ul {\n li {\n margin-right: 0;\n\n i {\n font-size: 14px;\n color : ${colors.yellow};\n }\n\n &:last-child {\n font-size: 13px;\n color : ${colors.text3};\n }\n }\n }\n }\n\n p.desc {\n font-size : 14px;\n color : ${colors.text3};\n line-height : 25px;\n margin-bottom : 15px;\n }\n\n a.details-btn {\n font-size : 13px;\n color : ${colors.green};\n border : 1px solid ${colors.border3};\n padding: 7px 15px;\n border-radius: 5px;\n font-weight: 500;\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n\n &:hover {\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\n }\n\n @media(max-width: 991px) {\n display : block !important;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 40px 0 30px;\n }\n }\n\n /* Course Details */\n .course-details-area {\n padding : 70px 0 20px;\n .course-details-top {\n .heading {\n h4 {\n color : ${colors.black1};\n font-weight: 600;\n line-height: 35px;\n margin-bottom: 25px;\n\n @media(max-width: 575px) {\n font-size : 20px;\n }\n }\n }\n .course-top-overview {\n margin-bottom : 25px;\n .overviews {\n .author {\n margin-right : 20px;\n padding-right : 20px;\n margin-top: -3px;\n border-right : 1px solid ${colors.border3};\n img {\n float : left;\n max-width: 50px;\n border-radius: 50%;\n margin-right: 10px;\n }\n .author-name {\n float : left;\n margin-top: 3px;\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n .category {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n\n .rating {\n margin-right : 20px;\n padding-right : 20px;\n border-right : 1px solid ${colors.border3};\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n ul {\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n margin-left: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n .price {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 5px;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 15px;\n color : ${colors.text3};\n font-weight: 500;\n\n @media(max-width: 767px) {\n font-size : 14px;\n }\n }\n }\n }\n\n @media(max-width: 480px) {\n display : none;\n }\n }\n .course-details-banner {\n margin-bottom: 40px;\n img {\n border-radius : 5px;\n }\n }\n .course-tab-list {\n .nav {\n display: inline-block;\n border-radius: 5px;\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n margin-bottom: 35px;\n .nav-item {\n display: inline-block;\n a.nav-link {\n font-size: 14px;\n color: ${colors.black2};\n font-weight: 500;\n text-transform : uppercase;\n padding: 12px 30px 10px;\n border-radius: 5px;\n\n @media(max-width: 991px) {\n padding: 12px 16px 9px;\n }\n }\n a.nav-link.active {\n background : ${colors.gr_bg};\n color : #ffffff;\n }\n }\n }\n .tab-content {\n .overview-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n font-size: 15px;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: #000000;\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n .course-desc {\n margin-bottom: 40px;\n h4 {\n color: #00B4F5;\n background: #172A47;\n padding: 15px;\n border-radius: 5px;\n text-align: center;\n font-weight: 400;\n }\n }\n\n .course-feature {\n margin-bottom: 10px;\n ul {\n margin-top: 20px;\n li {\n font-size : 14px;\n color: ${colors.text3};\n line-height : 25px;\n margin-bottom : 10px;\n i {\n font-size : 20px;\n color: ${colors.green};\n float: left;\n height: 40px;\n line-height: 27px;\n margin-right: 10px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n p {\n text-align: justify;\n }\n }\n\n .avail {\n h4 {\n font-size : 20px;\n color: #00B4F5;\n font-weight: 600;\n margin-bottom: 15px;\n }\n @media(max-width: 575px) {\n font-size : 12px;\n }\n }\n .course-learn {\n margin-bottom: 40px;\n ul {\n margin-top: 20px;\n li {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n margin-bottom: 15px;\n i {\n ${'' /* float: left; */}\n color: ${colors.green};\n ${'' /* border: 1px solid ${colors.border3}; */}\n width: 35px;\n height: 35px;\n border-radius: 50%;\n text-align: center;\n padding-top: 9px;\n margin-top: 8px;\n margin-right: 15px;\n }\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n }\n .course-share {\n ul.social {\n margin-top: 30px;\n li {\n a {\n text-align: center;\n position : relative;\n height : 18px;\n display : inline-block;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 9px 17px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -18px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 14px;\n color : #ffffff;\n width : 34px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n\n &:nth-child(5) {\n a {\n background-color: #ea4c89;\n\n &:before {\n border-bottom-color: #ea4c89;\n }\n\n &:after {\n border-top-color: #ea4c89;\n }\n }\n }\n }\n }\n }\n }\n .curriculum-tab {\n .course-curriculum {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n } \n }\n p {\n font-size: 15px;\n color: ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n .course-element {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .course-item {\n margin-bottom: 10px;\n button.course-button {\n border: none;\n background: transparent;\n margin-bottom: 15px;\n display: block;\n width: 100%;\n text-align : left;\n padding: 0;\n font-size : 18px;\n color: ${colors.black2};\n font-weight: 500;\n span {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n font-weight: 400;\n }\n }\n\n .course-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n ul {\n li {\n border-bottom : 1px solid ${colors.border3};\n margin-left: 25px;\n padding: 12px 0;\n span.play-icon {\n font-size : 14px;\n color: ${colors.text3};\n margin-right: 20px;\n i {\n color: ${colors.green};\n border: 1px solid ${colors.green};\n font-size: 22px;\n width: 30px;\n height: 30px;\n border-radius: 50%;\n padding-left: 3px;\n text-align: center;\n line-height: 29px;\n vertical-align: middle;\n margin-right: 10px;\n }\n }\n span.lecture-title {\n font-size : 15px;\n color: ${colors.black2};\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n span.lecture-duration {\n float: right;\n font-size: 14px;\n color: ${colors.text3};\n line-height: 28px;\n font-weight: 400;\n }\n }\n }\n }\n\n .course-content.show {\n max-height: 100%;\n margin-bottom: 40px;\n }\n\n &:last-child {\n margin-bottom: 40px;\n }\n }\n }\n }\n\n .instructor-tab {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n .instructor-item {\n margin-bottom: 30px;\n\n .instructor-img {\n img {\n border-radius : 5px;\n }\n }\n\n .instructor-content {\n position: relative;\n\n .instructor-box {\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\n padding : 25px;\n background: #ffffff;\n border-radius : 5px;\n position: absolute;\n top : 32px;\n left : -11%;\n z-index : 1;\n\n .top-content {\n margin-bottom: 20px;\n\n .instructor-name {\n h6 {\n color : ${colors.black2};\n font-weight: 600;\n text-transform: uppercase;\n margin-bottom: 12px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n }\n }\n .instructor-social {\n margin-top: 25px;\n ul.social {\n li {\n a {\n text-align: center;\n position : relative;\n\n &:before {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color: transparent;\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n &:after {\n content : \"\";\n position : absolute;\n border-width : 8px 14px;\n border-style : solid;\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n transition : all 0.2s ease;\n }\n\n i {\n font-size: 13px;\n color : #ffffff;\n width : 28px;\n }\n\n &:hover {\n background-color: ${colors.green} !important;\n\n &:before {\n border-bottom-color: ${colors.green} !important;\n }\n\n &:after {\n border-top-color: ${colors.green} !important;\n }\n }\n }\n\n &:nth-child(1) {\n a {\n background-color: #4267B2;\n\n &:before {\n border-bottom-color: #4267B2;\n }\n\n &:after {\n border-top-color: #4267B2;\n }\n }\n }\n\n &:nth-child(2) {\n a {\n background-color: #1DA1F2;\n\n &:before {\n border-bottom-color: #1DA1F2;\n }\n\n &:after {\n border-top-color: #1DA1F2;\n }\n }\n }\n\n &:nth-child(3) {\n a {\n background-color: #2867B2;\n\n &:before {\n border-bottom-color: #2867B2;\n }\n\n &:after {\n border-top-color: #2867B2;\n }\n }\n }\n\n &:nth-child(4) {\n a {\n background-color: #DD1343;\n\n &:before {\n border-bottom-color: #DD1343;\n }\n\n &:after {\n border-top-color: #DD1343;\n }\n }\n }\n }\n }\n }\n }\n\n .instructor-desk {\n p {\n font-size : 15px;\n color : ${colors.text2};\n line-height: 25px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n }\n }\n }\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .review-tab {\n .review-comments {\n margin-bottom: 40px;\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 35px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n .comment-box {\n border-bottom: 1px solid ${colors.border1};\n padding-bottom: 20px;\n margin-bottom: 25px;\n .comment-image {\n img {\n max-width : 100px;\n border-radius : 5px;\n margin-right : 20px;\n }\n }\n .comment-content {\n .content-title {\n .comment-writer {\n h6 {\n color: ${colors.black2};\n font-weight: 600;\n margin-bottom : 10px;\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n p {\n font-size : 12px;\n color: ${colors.text3};\n margin-bottom: 5px;\n }\n ul {\n margin-bottom: 8px;\n li {\n margin-right: 1px;\n i {\n font-size: 16px;\n color: ${colors.yellow};\n }\n &:last-child {\n font-size: 13px;\n color: ${colors.text2};\n margin-left: 5px;\n }\n }\n }\n }\n .reply-btn {\n button {\n font-size : 14px;\n color: ${colors.green};\n background : transparent;\n border : 1px solid ${colors.border3};\n font-weight: 500;\n border-radius: 25px;\n padding: 4px 12px 3px;\n margin-top : 10px;\n i {\n font-size: 17px;\n vertical-align: text-top;\n }\n &:hover {\n color : #ffffff;\n background : ${colors.gr_bg};\n border-color : ${colors.green};\n }\n }\n }\n }\n .comment-desc {\n p {\n font-size: 14px;\n color: ${colors.text3};\n line-height: 25px;\n }\n }\n }\n &:last-child {\n border-bottom : none;\n padding-bottom : 0;\n margin-bottom : 0;\n }\n }\n }\n\n .review-form {\n h5 {\n color: ${colors.black2};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 25px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 40px;\n }\n }\n\n .single-details-sidbar {\n .course-details-feature {\n box-shadow: 0 8px 25px rgba(0,0,0,0.1);\n border-radius: 5px;\n padding: 15px 20px 20px;\n h5.title {\n color: ${colors.black1};\n font-weight: 600;\n padding-bottom: 10px;\n margin-bottom: 20px;\n position: relative;\n &:before {\n position: absolute;\n content: \"\";\n background: ${colors.green};\n width: 50px;\n height: 2px;\n bottom: 0;\n left: 0;\n }\n\n @media(max-width: 575px) {\n font-size : 17px;\n }\n }\n\n ul.feature-list {\n margin-bottom: 20px;\n li {\n border-top: 1px dashed ${colors.border3};\n padding: 12px 0;\n font-size : 14px;\n color : ${colors.black2};\n font-weight: 500;\n i {\n font-size : 20px;\n color: ${colors.green};\n vertical-align: top;\n margin-right : 2px;\n }\n span {\n float : right;\n font-size: 13px;\n color: ${colors.text3};\n font-weight: 400;\n line-height: 20px;\n }\n &:first-child {\n border-top : none;\n padding-top : 0;\n }\n &:last-child {\n padding-bottom : 0;\n }\n }\n }\n\n button.enroll-btn {\n font-size: 16px;\n color: #fff;\n background: ${colors.gr_bg};\n display: inline-block;\n width: 100%;\n height: 40px;\n font-weight : 500;\n border : none;\n padding: 9px;\n border-radius: 5px;\n &:hover {\n background: ${colors.gr_bg2};\n }\n\n @media(max-width: 575px) {\n font-size : 14px;\n }\n }\n\n @media(max-width: 1199px) {\n padding: 12px 15px 15px;\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 20px 0 5px;\n }\n }\n`;","import styled from \"styled-components\";\nimport { colors } from \"../common/element/elements.js\";\n\nexport const Styles = styled.div`\n .event-faq-area {\n padding: 15px 0;\n\n\n .expand-btn {\n background: #172A47;\n border: none;\n &:hover {\n box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;\n }\n\n }\n\n .event-area {\n .sec-title {\n h4 {\n color : ${colors.black1};\n font-weight : 600;\n text-transform: uppercase;\n margin-bottom : 37px;\n\n span {\n color: ${colors.green};\n }\n\n @media(max-width: 575px) {\n margin-bottom: 15px;\n font-size: 20px;\n }\n }\n }\n\n .event-box {\n margin-bottom: 35px;\n\n .event-date {\n width : 70px;\n height: 70px;\n border-radius : 50%;\n color : #fff;\n margin-top : 8px;\n margin-right: 30px;\n position : relative;\n\n &::before {\n content : \"\";\n position : absolute;\n width : 70px;\n height : 70px;\n background: ${colors.green};\n top : 0;\n left : 0;\n border-radius : 50% 3px 50% 50%;\n transform: rotate(45deg);\n z-index : -1;\n }\n\n p {\n font-size : 17px;\n max-width : 50px;\n margin : auto;\n line-height: 20px;\n padding-top: 13px;\n\n @media(max-width: 991px) {\n font-size: 15px;\n max-width: 56px;\n padding-left: 14px;\n }\n }\n }\n\n .event-details {\n margin-top: 5px;\n\n h6 {\n a {\n color : ${colors.black1};\n display : inline-block;\n font-weight : 600;\n margin-bottom: 10px;\n\n &:hover {\n color: ${colors.green};\n }\n }\n }\n\n ul {\n margin-bottom: 5px;\n\n li {\n font-size : 14px;\n color : ${colors.text3};\n font-weight: 500;\n\n i {\n font-size : 15px;\n margin-right: 3px;\n color : ${colors.green};\n }\n }\n }\n\n p {\n color : ${colors.text3};\n line-height: 22px;\n }\n }\n\n &:last-child {\n margin-bottom : 0;\n }\n\n @media(max-width: 991px) {\n margin-bottom: 17px;\n }\n }\n\n @media(max-width: 767px) {\n margin-bottom: 30px;\n }\n\n @media(max-width: 575px) {\n margin-bottom: 10px;\n }\n }\n\n .faq-area {\n .sec-title {\n h4 {\n color : ${colors.black1};\n font-weight : 600;\n text-transform: uppercase;\n margin-bottom : 45px;\n\n span {\n color: ${colors.green};\n }\n\n @media(max-width: 575px) {\n margin-bottom: 15px;\n font-size: 20px;\n }\n }\n }\n\n .faq-box {\n .faq-item {\n margin-bottom: 22px;\n\n button.accordion-button {\n border : none;\n background : transparent;\n margin-bottom: 15px;\n display : block;\n width : 100%;\n padding : 0;\n text-align : left;\n position : relative;\n\n div.accordion-icon {\n background : ${colors.green};\n height : 18px;\n text-align : center;\n float : left;\n margin-right: 12px;\n position : relative;\n\n i {\n font-size : 20px;\n color : #ffffff;\n width : 32px;\n line-height : 18px;\n padding-left: 2px\n }\n\n &::before {\n content : \"\";\n position : absolute;\n border-width : 8px 16px;\n border-style : solid;\n border-top-color : transparent;\n border-right-color : transparent;\n border-bottom-color: ${colors.green};\n border-left-color : transparent;\n top : -16px;\n left : 0;\n z-index : 1;\n }\n\n &::after {\n content : \"\";\n position : absolute;\n border-width : 8px 16px;\n border-style : solid;\n border-top-color : ${colors.green};\n border-right-color : transparent;\n border-bottom-color: transparent;\n border-left-color : transparent;\n bottom : -16px;\n left : 0;\n z-index : 1;\n }\n }\n\n p {\n font-size : 16px;\n color : ${colors.light_blue};\n font-weight: 500;\n line-height: 18px;\n }\n }\n\n\n .accordion-content {\n max-height: 0;\n overflow : hidden;\n transition: max-height 0.2s ease-in-out;\n\n p {\n font-size : 14px;\n color : #000;\n line-height : 28px;\n padding-left: 45px;\n }\n }\n\n .accordion-content.show {\n max-height: 100%;\n }\n\n &:last-child {\n margin-bottom : 0;\n }\n }\n }\n }\n\n @media(max-width: 767px) {\n padding: 5px 0;\n }\n }\n`;","import React, { useEffect, useState } from 'react';\r\nimport Datas from '../data/faq-event/faq-event.json';\r\nimport { Container, Row, Col, Button, Collapse } from 'react-bootstrap';\r\nimport { Styles } from \"./styles/faqEvent.js\";\r\nimport axios from 'axios';\r\n\r\nfunction FaqEvent() {\r\n const [open, setOpen] = useState(false);\r\n\r\n const [featuresList, setFeaturesList] = useState([]);\r\n\r\n useEffect(() => {\r\n const getFeatures = async () => {\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/community-features/find-all`).then(res => {\r\n setFeaturesList(res.data)\r\n }).catch(err => console.error(err))\r\n }\r\n getFeatures();\r\n },[])\r\n\r\n useEffect(() => {\r\n const accordionButton = document.querySelectorAll(\".accordion-button\");\r\n accordionButton.forEach(button => {\r\n button.addEventListener(\"click\", () => {\r\n button.classList.toggle(\"active\");\r\n const content = button.nextElementSibling;\r\n\r\n if (!button.classList.contains(\"active\")) {\r\n content.className = \"accordion-content show\";\r\n content.style.maxHeight = content.scrollHeight + \"px\";\r\n } else {\r\n content.className = \"accordion-content\";\r\n content.style.maxHeight = \"0\";\r\n }\r\n });\r\n });\r\n },[featuresList]);\r\n\r\n return (\r\n \r\n {/* Faq & Event */}\r\n
\r\n \r\n \r\n \r\n \r\n \r\n setOpen(!open)}\r\n aria-controls=\"example-collapse-text\"\r\n aria-expanded={open}\r\n className=\"expand-btn\"\r\n >\r\n {open ? \"Collapse All\" : \"Expand All\"}\r\n \r\n \r\n \r\n \r\n {\r\n featuresList && featuresList.length > 0 ? featuresList.map((faqData, i) => ( \r\n \r\n
\r\n \r\n
\r\n \r\n
\r\n \r\n \r\n
\r\n

{faqData.featureDesc}

\r\n
\r\n \r\n
\r\n \r\n
\r\n
\r\n \r\n )) : \"No feature available\"\r\n }\r\n \r\n \r\n
\r\n \r\n )\r\n}\r\n\r\nexport default FaqEvent\r\n","import React, { useEffect, useState } from 'react';\nimport { Container, Row, Col, Tab } from 'react-bootstrap';\nimport HeaderTwo from '../../components/HeaderTwo';\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\nimport FooterTwo from '../../components/FooterTwo';\nimport { Styles } from './styles/community.js';\nimport FaqEvent from '../../components/FaqEvent';\nimport axios from 'axios';\n\nfunction CommunityPortal() {\n\n const [communityWebPortalInfo, setCommunityWebPortalInfo] = useState([]);\n\n useEffect(() => {\n const getPortalInfo = async () => {\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/community-portal/find-all`).then(res => {\n setCommunityWebPortalInfo(res.data)\n }).catch(err => console.error(err))\n }\n getPortalInfo();\n },[])\n\n // useEffect(() => {\n // const accordionButton = document.querySelectorAll(\".accordion-button\");\n // console.log(accordionButton)\n // accordionButton.forEach(button => {\n // button.addEventListener(\"click\", () => {\n \n // button.classList.toggle(\"active\");\n // const content = button.nextElementSibling;\n\n // if (!button.classList.contains(\"active\")) {\n // content.className = \"accordion-content show\";\n // content.style.maxHeight = content.scrollHeight + \"px\";\n // } else {\n // content.className = \"accordion-content\";\n // content.style.maxHeight = \"0\";\n // }\n // });\n // });\n // },[]);\n\n useEffect(() => {\n document.title = 'Community Portal | REAL FM';\n const courseButton = document.querySelectorAll(\".course-button\");\n courseButton.forEach(button => {\n button.addEventListener(\"click\", () => {\n button.classList.toggle(\"active\");\n const content = button.nextElementSibling;\n\n if (button.classList.contains(\"active\")) {\n content.className = \"course-content show\";\n content.style.maxHeight = content.scrollHeight + \"px\";\n } else {\n content.className = \"course-content\";\n content.style.maxHeight = \"0\";\n }\n });\n });\n });\n\n return (\n
\n\n {/* Header 2 */}\n \n\n {/* Breadcroumb */}\n \n\n \n {/* Course Details */}\n
\n \n \n \n \n
\n \n
\n \n {\n communityWebPortalInfo && communityWebPortalInfo.length > 0 ? communityWebPortalInfo.map((info, i) => (\n \n \n \n <>\n
\n

{info.communityTagLine}

\n
\n
\n \n \n \n \n

\n\n

\n\n \n \n \n
\n \n \n \n \n \n \n )): \"No content available\"\n }\n \n \n
\n
\n \n \n \n \n \n
\n \n\n {/* Footer 2 */}\n \n\n
\n )\n}\n\nexport default CommunityPortal","import styled from \"styled-components\";\r\nimport { colors } from \"../../../components/common/element/elements.js\";\r\n\r\nexport const Styles = styled.div`\r\n /* Course Grid */\r\n .course-grid-area {\r\n padding: 70px 0;\r\n\r\n .course-items {\r\n .course-item {\r\n border: 1px solid ${colors.border1};\r\n border-radius: 5px;\r\n transition: all 0.2s ease;\r\n overflow: hidden;\r\n margin-bottom: 30px;\r\n\r\n .course-image {\r\n width: 100%;\r\n height: 240px;\r\n background-size: cover;\r\n background-position: center;\r\n background-repeat: no-repeat;\r\n border-radius: 5px 5px 0 0;\r\n position: relative;\r\n\r\n .author-img {\r\n position: absolute;\r\n left: 20px;\r\n bottom: 20px;\r\n\r\n img {\r\n max-width: 40px;\r\n border-radius: 50%;\r\n margin-right: 5px;\r\n }\r\n\r\n .title {\r\n background: #ffffff;\r\n padding: 3px 8px;\r\n border-radius: 5px;\r\n\r\n p {\r\n font-size: 12px;\r\n color: ${colors.black1};\r\n font-weight: 500;\r\n margin-bottom: -4px;\r\n }\r\n\r\n span {\r\n font-size: 11px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n }\r\n }\r\n }\r\n\r\n .course-price {\r\n p {\r\n font-size: 16px;\r\n color: #ffffff;\r\n background: ${colors.bg1};\r\n position: absolute;\r\n right: 20px;\r\n bottom: 20px;\r\n padding: 8px 10px;\r\n font-weight: 500;\r\n border-radius: 5px;\r\n }\r\n }\r\n\r\n @media (max-width: 767px) {\r\n height: 185px;\r\n }\r\n }\r\n\r\n .course-content {\r\n background: #fff;\r\n padding: 20px 25px;\r\n\r\n h6.heading {\r\n a {\r\n color: ${colors.black1};\r\n font-weight: 600;\r\n display: inline-block;\r\n margin-bottom: 12px;\r\n\r\n &:hover {\r\n color: ${colors.green};\r\n }\r\n }\r\n }\r\n\r\n p.desc {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n line-height: 25px;\r\n border-bottom: 1px solid ${colors.border1};\r\n padding-bottom: 10px;\r\n margin-bottom: 12px;\r\n }\r\n\r\n .course-face {\r\n .duration,\r\n .student {\r\n p {\r\n font-size: 13px;\r\n color: ${colors.text3};\r\n\r\n i {\r\n font-size: 16px;\r\n color: ${colors.green};\r\n vertical-align: text-bottom;\r\n margin-right: 3px;\r\n }\r\n }\r\n }\r\n\r\n .rating {\r\n ul {\r\n li {\r\n margin-right: 0;\r\n\r\n i {\r\n font-size: 14px;\r\n color: ${colors.yellow};\r\n }\r\n\r\n &:last-child {\r\n font-size: 13px;\r\n color: ${colors.text3};\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.07);\r\n }\r\n }\r\n }\r\n\r\n @media (max-width: 767px) {\r\n padding: 40px 0 30px;\r\n }\r\n }\r\n\r\n /* Course List */\r\n .course-list-area {\r\n padding: 70px 0;\r\n .course-items2 {\r\n .course-item {\r\n border-radius: 5px;\r\n transition: all 0.2s ease;\r\n overflow: hidden;\r\n box-shadow: 0 8px 20px 5px rgba(0, 0, 0, 0.07);\r\n margin-bottom: 30px;\r\n\r\n .course-image-box {\r\n .course-image {\r\n width: 290px;\r\n height: 230px;\r\n background-size: cover;\r\n background-position: center;\r\n background-repeat: no-repeat;\r\n border-radius: 5px 5px 0 0;\r\n position: relative;\r\n\r\n .author-img {\r\n position: absolute;\r\n left: 20px;\r\n top: 20px;\r\n\r\n img {\r\n max-width: 40px;\r\n border-radius: 50%;\r\n margin-right: 5px;\r\n }\r\n\r\n .title {\r\n background: #ffffff;\r\n padding: 3px 8px;\r\n border-radius: 5px;\r\n\r\n p {\r\n font-size: 12px;\r\n color: ${colors.black1};\r\n font-weight: 500;\r\n margin-bottom: -4px;\r\n }\r\n\r\n span {\r\n font-size: 11px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n }\r\n }\r\n\r\n @media (max-width: 991px) {\r\n top: unset;\r\n bottom: 20px;\r\n }\r\n }\r\n\r\n .course-price {\r\n p {\r\n font-size: 16px;\r\n color: #ffffff;\r\n background: ${colors.bg1};\r\n position: absolute;\r\n right: 20px;\r\n top: 20px;\r\n padding: 8px 10px;\r\n font-weight: 500;\r\n border-radius: 5px;\r\n\r\n @media (max-width: 991px) {\r\n top: unset;\r\n bottom: 20px;\r\n }\r\n }\r\n }\r\n\r\n @media (max-width: 991px) {\r\n width: 100%;\r\n }\r\n }\r\n }\r\n\r\n .course-content {\r\n background: #fff;\r\n padding: 20px 25px;\r\n\r\n h6.heading {\r\n padding-bottom: 12px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n a {\r\n color: ${colors.black1};\r\n font-weight: 600;\r\n display: inline-block;\r\n\r\n &:hover {\r\n color: ${colors.green};\r\n }\r\n }\r\n }\r\n\r\n .rating {\r\n margin-bottom: 6px;\r\n ul {\r\n li {\r\n margin-right: 0;\r\n\r\n i {\r\n font-size: 14px;\r\n color: ${colors.yellow};\r\n }\r\n\r\n &:last-child {\r\n font-size: 13px;\r\n color: ${colors.text3};\r\n }\r\n }\r\n }\r\n }\r\n\r\n p.desc {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n line-height: 25px;\r\n margin-bottom: 15px;\r\n }\r\n\r\n a.details-btn {\r\n font-size: 13px;\r\n color: ${colors.green};\r\n border: 1px solid ${colors.border3};\r\n padding: 7px 15px;\r\n border-radius: 5px;\r\n font-weight: 500;\r\n &:hover {\r\n color: #ffffff;\r\n background: ${colors.gr_bg};\r\n border-color: ${colors.green};\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n box-shadow: 0 12px 25px rgba(0, 0, 0, 0.1);\r\n }\r\n\r\n @media (max-width: 991px) {\r\n display: block !important;\r\n }\r\n }\r\n }\r\n\r\n @media (max-width: 767px) {\r\n padding: 40px 0 30px;\r\n }\r\n }\r\n\r\n /* Course Details */\r\n .course-details-area {\r\n padding: 60px 0 30px;\r\n .custom-card {\r\n padding: 30px;\r\n box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;\r\n border-radius: 10px;\r\n }\r\n .investment-table {\r\n thead {\r\n background: #182b49;\r\n color: #ffffff;\r\n }\r\n ul {\r\n margin-top: 20px;\r\n li {\r\n font-size: 12px;\r\n color: #000;\r\n line-height: 25px;\r\n margin-bottom: 8px;\r\n i {\r\n ${\"\" /* float: left; */}\r\n color: ${colors.green};\r\n width: 35px;\r\n height: 35px;\r\n border-radius: 50%;\r\n text-align: center;\r\n padding-top: 9px;\r\n margin-top: 8px;\r\n margin-right: 15px;\r\n }\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n }\r\n }\r\n td {\r\n font-size: 16px;\r\n &:first-child {\r\n width:60% !important;\r\n }\r\n &:last-child {\r\n text-align: center;\r\n vertical-align: middle;\r\n line-height: 90px; \r\n }\r\n }\r\n }\r\n\r\n .additional-disburse {\r\n h5 {\r\n color: ${colors.light_blue};\r\n font-size: 15px;\r\n margin: 20px 0px;\r\n position: relative;\r\n padding-bottom: 10px;\r\n margin-bottom: 20px;\r\n font-weight: 600;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n }\r\n thead {\r\n background: #182b49;\r\n color: #ffffff;\r\n th {\r\n &:nth-child(2) {\r\n width:20% !important;\r\n }\r\n }\r\n }\r\n ul {\r\n margin-top: 20px;\r\n text-align: center;\r\n li {\r\n font-size: 12px;\r\n color: #000;\r\n line-height: 25px;\r\n margin-bottom: 8px;\r\n i {\r\n color: ${colors.green};\r\n width: 35px;\r\n height: 35px;\r\n border-radius: 50%;\r\n text-align: center;\r\n padding-top: 9px;\r\n margin-top: 8px;\r\n margin-right: 15px;\r\n }\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n }\r\n }\r\n td {\r\n font-size: 16px;\r\n &:first-child { \r\n width: 60% !important;\r\n }\r\n }\r\n\r\n }\r\n .course-details-top {\r\n .heading {\r\n h4 {\r\n color: ${colors.black1};\r\n font-weight: 600;\r\n line-height: 35px;\r\n margin-bottom: 25px;\r\n\r\n @media (max-width: 575px) {\r\n font-size: 20px;\r\n }\r\n }\r\n }\r\n .course-top-overview {\r\n margin-bottom: 25px;\r\n .overviews {\r\n .author {\r\n margin-right: 20px;\r\n padding-right: 20px;\r\n margin-top: -3px;\r\n border-right: 1px solid ${colors.border3};\r\n img {\r\n float: left;\r\n max-width: 50px;\r\n border-radius: 50%;\r\n margin-right: 10px;\r\n }\r\n .author-name {\r\n float: left;\r\n margin-top: 3px;\r\n h6 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n margin-bottom: 5px;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n p {\r\n font-size: 15px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .category {\r\n margin-right: 20px;\r\n padding-right: 20px;\r\n border-right: 1px solid ${colors.border3};\r\n h6 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n margin-bottom: 5px;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n p {\r\n font-size: 15px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n\r\n .rating {\r\n margin-right: 20px;\r\n padding-right: 20px;\r\n border-right: 1px solid ${colors.border3};\r\n h6 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n margin-bottom: 5px;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n ul {\r\n li {\r\n margin-right: 1px;\r\n i {\r\n font-size: 16px;\r\n color: ${colors.yellow};\r\n }\r\n &:last-child {\r\n font-size: 15px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n margin-left: 5px;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .price {\r\n h6 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n margin-bottom: 5px;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n p {\r\n font-size: 15px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n\r\n @media (max-width: 767px) {\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n display: none;\r\n }\r\n }\r\n .course-details-banner {\r\n margin-bottom: 40px;\r\n img {\r\n border-radius: 5px;\r\n }\r\n }\r\n .course-tab-list {\r\n .nav {\r\n display: inline-block;\r\n border-radius: 5px;\r\n box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);\r\n margin-bottom: 35px;\r\n .nav-item {\r\n display: inline-block;\r\n a.nav-link {\r\n font-size: 14px;\r\n color: ${colors.black2};\r\n font-weight: 500;\r\n text-transform: uppercase;\r\n padding: 12px 30px 10px;\r\n border-radius: 5px;\r\n\r\n @media (max-width: 991px) {\r\n padding: 12px 16px 9px;\r\n }\r\n }\r\n a.nav-link.active {\r\n background: ${colors.gr_bg};\r\n color: #ffffff;\r\n }\r\n }\r\n }\r\n .tab-content {\r\n .overview-tab {\r\n h5 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n font-size: 15px;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n p {\r\n font-size: 15px;\r\n color: #000000;\r\n line-height: 25px;\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n\r\n .course-desc {\r\n margin-bottom: 40px;\r\n h4 {\r\n color: #00b4f5;\r\n background: #172a47;\r\n padding: 15px;\r\n border-radius: 5px;\r\n text-align: center;\r\n }\r\n }\r\n\r\n .course-feature {\r\n margin-bottom: 40px;\r\n ul {\r\n margin-top: 20px;\r\n li {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n line-height: 25px;\r\n margin-bottom: 10px;\r\n i {\r\n font-size: 20px;\r\n color: ${colors.green};\r\n float: left;\r\n height: 40px;\r\n line-height: 27px;\r\n margin-right: 10px;\r\n }\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n }\r\n }\r\n\r\n p {\r\n text-align: justify;\r\n }\r\n .invest-mail {\r\n color: #000;\r\n font-size: 15px;\r\n text-decoration: underline;\r\n &:hover {\r\n color: #00b4f5;\r\n }\r\n }\r\n }\r\n\r\n .avail {\r\n h4 {\r\n font-size: 20px;\r\n color: #00b4f5;\r\n font-weight: 600;\r\n margin-bottom: 15px;\r\n }\r\n @media (max-width: 575px) {\r\n font-size: 12px;\r\n }\r\n }\r\n .course-learn {\r\n margin-bottom: 40px;\r\n ul {\r\n margin-top: 20px;\r\n li {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n line-height: 25px;\r\n margin-bottom: 15px;\r\n i {\r\n ${\"\" /* float: left; */}\r\n color: ${colors.green};\r\n border: 1px solid ${colors.border3};\r\n width: 35px;\r\n height: 35px;\r\n border-radius: 50%;\r\n text-align: center;\r\n padding-top: 9px;\r\n margin-top: 8px;\r\n margin-right: 15px;\r\n }\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n }\r\n }\r\n }\r\n .course-share {\r\n ul.social {\r\n margin-top: 30px;\r\n li {\r\n a {\r\n text-align: center;\r\n position: relative;\r\n height: 18px;\r\n display: inline-block;\r\n\r\n &:before {\r\n content: \"\";\r\n position: absolute;\r\n border-width: 9px 17px;\r\n border-style: solid;\r\n border-top-color: transparent;\r\n border-right-color: transparent;\r\n border-left-color: transparent;\r\n top: -18px;\r\n left: 0;\r\n z-index: 1;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n &:after {\r\n content: \"\";\r\n position: absolute;\r\n border-width: 9px 17px;\r\n border-style: solid;\r\n border-right-color: transparent;\r\n border-bottom-color: transparent;\r\n border-left-color: transparent;\r\n bottom: -18px;\r\n left: 0;\r\n z-index: 1;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n i {\r\n font-size: 14px;\r\n color: #ffffff;\r\n width: 34px;\r\n }\r\n\r\n &:hover {\r\n background-color: ${colors.green} !important;\r\n\r\n &:before {\r\n border-bottom-color: ${colors.green} !important;\r\n }\r\n\r\n &:after {\r\n border-top-color: ${colors.green} !important;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(1) {\r\n a {\r\n background-color: #4267b2;\r\n\r\n &:before {\r\n border-bottom-color: #4267b2;\r\n }\r\n\r\n &:after {\r\n border-top-color: #4267b2;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(2) {\r\n a {\r\n background-color: #1da1f2;\r\n\r\n &:before {\r\n border-bottom-color: #1da1f2;\r\n }\r\n\r\n &:after {\r\n border-top-color: #1da1f2;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(3) {\r\n a {\r\n background-color: #2867b2;\r\n\r\n &:before {\r\n border-bottom-color: #2867b2;\r\n }\r\n\r\n &:after {\r\n border-top-color: #2867b2;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(4) {\r\n a {\r\n background-color: #dd1343;\r\n\r\n &:before {\r\n border-bottom-color: #dd1343;\r\n }\r\n\r\n &:after {\r\n border-top-color: #dd1343;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(5) {\r\n a {\r\n background-color: #ea4c89;\r\n\r\n &:before {\r\n border-bottom-color: #ea4c89;\r\n }\r\n\r\n &:after {\r\n border-top-color: #ea4c89;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n .curriculum-tab {\r\n .course-curriculum {\r\n margin-bottom: 40px;\r\n h5 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n p {\r\n font-size: 15px;\r\n color: ${colors.text2};\r\n line-height: 25px;\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n .course-element {\r\n h5 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n .course-item {\r\n margin-bottom: 10px;\r\n button.course-button {\r\n border: none;\r\n background: transparent;\r\n margin-bottom: 15px;\r\n display: block;\r\n width: 100%;\r\n text-align: left;\r\n padding: 0;\r\n font-size: 18px;\r\n color: ${colors.black2};\r\n font-weight: 500;\r\n span {\r\n float: right;\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n font-weight: 400;\r\n }\r\n }\r\n\r\n .course-content {\r\n max-height: 0;\r\n overflow: hidden;\r\n transition: max-height 0.2s ease-in-out;\r\n ul {\r\n li {\r\n border-bottom: 1px solid ${colors.border3};\r\n margin-left: 25px;\r\n padding: 12px 0;\r\n span.play-icon {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n margin-right: 20px;\r\n i {\r\n color: ${colors.green};\r\n border: 1px solid ${colors.green};\r\n font-size: 22px;\r\n width: 30px;\r\n height: 30px;\r\n border-radius: 50%;\r\n padding-left: 3px;\r\n text-align: center;\r\n line-height: 29px;\r\n vertical-align: middle;\r\n margin-right: 10px;\r\n }\r\n }\r\n span.lecture-title {\r\n font-size: 15px;\r\n color: ${colors.black2};\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n span.lecture-duration {\r\n float: right;\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n line-height: 28px;\r\n font-weight: 400;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .course-content.show {\r\n max-height: 100%;\r\n margin-bottom: 40px;\r\n }\r\n\r\n &:last-child {\r\n margin-bottom: 40px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .instructor-tab {\r\n h5 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 35px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n\r\n .instructor-item {\r\n margin-bottom: 30px;\r\n\r\n .instructor-img {\r\n img {\r\n border-radius: 5px;\r\n }\r\n }\r\n\r\n .instructor-content {\r\n position: relative;\r\n\r\n .instructor-box {\r\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\r\n padding: 25px;\r\n background: #ffffff;\r\n border-radius: 5px;\r\n position: absolute;\r\n top: 32px;\r\n left: -11%;\r\n z-index: 1;\r\n\r\n .top-content {\r\n margin-bottom: 20px;\r\n\r\n .instructor-name {\r\n h6 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n text-transform: uppercase;\r\n margin-bottom: 12px;\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n p {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n font-weight: 500;\r\n }\r\n }\r\n .instructor-social {\r\n margin-top: 25px;\r\n ul.social {\r\n li {\r\n a {\r\n text-align: center;\r\n position: relative;\r\n\r\n &:before {\r\n content: \"\";\r\n position: absolute;\r\n border-width: 8px 14px;\r\n border-style: solid;\r\n border-top-color: transparent;\r\n border-right-color: transparent;\r\n border-left-color: transparent;\r\n top: -16px;\r\n left: 0;\r\n z-index: 1;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n &:after {\r\n content: \"\";\r\n position: absolute;\r\n border-width: 8px 14px;\r\n border-style: solid;\r\n border-right-color: transparent;\r\n border-bottom-color: transparent;\r\n border-left-color: transparent;\r\n bottom: -16px;\r\n left: 0;\r\n z-index: 1;\r\n transition: all 0.2s ease;\r\n }\r\n\r\n i {\r\n font-size: 13px;\r\n color: #ffffff;\r\n width: 28px;\r\n }\r\n\r\n &:hover {\r\n background-color: ${colors.green} !important;\r\n\r\n &:before {\r\n border-bottom-color: ${colors.green} !important;\r\n }\r\n\r\n &:after {\r\n border-top-color: ${colors.green} !important;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(1) {\r\n a {\r\n background-color: #4267b2;\r\n\r\n &:before {\r\n border-bottom-color: #4267b2;\r\n }\r\n\r\n &:after {\r\n border-top-color: #4267b2;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(2) {\r\n a {\r\n background-color: #1da1f2;\r\n\r\n &:before {\r\n border-bottom-color: #1da1f2;\r\n }\r\n\r\n &:after {\r\n border-top-color: #1da1f2;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(3) {\r\n a {\r\n background-color: #2867b2;\r\n\r\n &:before {\r\n border-bottom-color: #2867b2;\r\n }\r\n\r\n &:after {\r\n border-top-color: #2867b2;\r\n }\r\n }\r\n }\r\n\r\n &:nth-child(4) {\r\n a {\r\n background-color: #dd1343;\r\n\r\n &:before {\r\n border-bottom-color: #dd1343;\r\n }\r\n\r\n &:after {\r\n border-top-color: #dd1343;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n .instructor-desk {\r\n p {\r\n font-size: 15px;\r\n color: ${colors.text2};\r\n line-height: 25px;\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:last-child {\r\n margin-bottom: 0;\r\n }\r\n }\r\n }\r\n\r\n .review-tab {\r\n .review-comments {\r\n margin-bottom: 40px;\r\n h5 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 35px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n .comment-box {\r\n border-bottom: 1px solid ${colors.border1};\r\n padding-bottom: 20px;\r\n margin-bottom: 25px;\r\n .comment-image {\r\n img {\r\n max-width: 100px;\r\n border-radius: 5px;\r\n margin-right: 20px;\r\n }\r\n }\r\n .comment-content {\r\n .content-title {\r\n .comment-writer {\r\n h6 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n margin-bottom: 10px;\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n p {\r\n font-size: 12px;\r\n color: ${colors.text3};\r\n margin-bottom: 5px;\r\n }\r\n ul {\r\n margin-bottom: 8px;\r\n li {\r\n margin-right: 1px;\r\n i {\r\n font-size: 16px;\r\n color: ${colors.yellow};\r\n }\r\n &:last-child {\r\n font-size: 13px;\r\n color: ${colors.text2};\r\n margin-left: 5px;\r\n }\r\n }\r\n }\r\n }\r\n .reply-btn {\r\n button {\r\n font-size: 14px;\r\n color: ${colors.green};\r\n background: transparent;\r\n border: 1px solid ${colors.border3};\r\n font-weight: 500;\r\n border-radius: 25px;\r\n padding: 4px 12px 3px;\r\n margin-top: 10px;\r\n i {\r\n font-size: 17px;\r\n vertical-align: text-top;\r\n }\r\n &:hover {\r\n color: #ffffff;\r\n background: ${colors.gr_bg};\r\n border-color: ${colors.green};\r\n }\r\n }\r\n }\r\n }\r\n .comment-desc {\r\n p {\r\n font-size: 14px;\r\n color: ${colors.text3};\r\n line-height: 25px;\r\n }\r\n }\r\n }\r\n &:last-child {\r\n border-bottom: none;\r\n padding-bottom: 0;\r\n margin-bottom: 0;\r\n }\r\n }\r\n }\r\n\r\n .review-form {\r\n h5 {\r\n color: ${colors.black2};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 25px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n }\r\n }\r\n }\r\n }\r\n\r\n @media (max-width: 767px) {\r\n margin-bottom: 40px;\r\n }\r\n }\r\n\r\n .single-details-sidbar {\r\n .course-details-feature {\r\n box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);\r\n border-radius: 5px;\r\n padding: 15px 20px 20px;\r\n h5.title {\r\n color: ${colors.black1};\r\n font-weight: 600;\r\n padding-bottom: 10px;\r\n margin-bottom: 20px;\r\n position: relative;\r\n &:before {\r\n position: absolute;\r\n content: \"\";\r\n background: ${colors.green};\r\n width: 50px;\r\n height: 2px;\r\n bottom: 0;\r\n left: 0;\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 17px;\r\n }\r\n }\r\n\r\n ul.feature-list {\r\n margin-bottom: 20px;\r\n li {\r\n border-top: 1px dashed ${colors.border3};\r\n padding: 12px 0;\r\n font-size: 14px;\r\n color: ${colors.black2};\r\n font-weight: 500;\r\n i {\r\n font-size: 20px;\r\n color: ${colors.green};\r\n vertical-align: top;\r\n margin-right: 2px;\r\n }\r\n span {\r\n float: right;\r\n font-size: 13px;\r\n color: ${colors.text3};\r\n font-weight: 400;\r\n line-height: 20px;\r\n }\r\n &:first-child {\r\n border-top: none;\r\n padding-top: 0;\r\n }\r\n &:last-child {\r\n padding-bottom: 0;\r\n }\r\n }\r\n }\r\n\r\n button.enroll-btn {\r\n font-size: 16px;\r\n color: #fff;\r\n background: ${colors.gr_bg};\r\n display: inline-block;\r\n width: 100%;\r\n height: 40px;\r\n font-weight: 500;\r\n border: none;\r\n padding: 9px;\r\n border-radius: 5px;\r\n &:hover {\r\n background: ${colors.gr_bg2};\r\n }\r\n\r\n @media (max-width: 575px) {\r\n font-size: 14px;\r\n }\r\n }\r\n\r\n @media (max-width: 1199px) {\r\n padding: 12px 15px 15px;\r\n }\r\n }\r\n }\r\n\r\n @media (max-width: 767px) {\r\n padding: 20px 0 5px;\r\n }\r\n }\r\n`;\r\n","import React, { useEffect, useState } from 'react';\r\nimport { Container, Row, Col, Tab, Table } from 'react-bootstrap';\r\nimport HeaderTwo from '../../components/HeaderTwo';\r\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\r\nimport FooterTwo from '../../components/FooterTwo';\r\nimport { Styles } from './styles/investment.js';\r\nimport axios from 'axios';\r\n\r\nfunction CommunityPortal() {\r\n useEffect(() => {\r\n document.title = 'Investment | REAL FM';\r\n const courseButton = document.querySelectorAll(\".course-button\");\r\n courseButton.forEach(button => {\r\n button.addEventListener(\"click\", () => {\r\n button.classList.toggle(\"active\");\r\n const content = button.nextElementSibling;\r\n\r\n if (button.classList.contains(\"active\")) {\r\n content.className = \"course-content show\";\r\n content.style.maxHeight = content.scrollHeight + \"px\";\r\n } else {\r\n content.className = \"course-content\";\r\n content.style.maxHeight = \"0\";\r\n }\r\n });\r\n });\r\n });\r\n\r\n \r\n const [investmentInfo, setInvestmentInfo] = useState([]);\r\n const [investmentAdditionalDisburseInfo, setInvestmentAdditionalDisburseInfo] = useState([]);\r\n\r\n useEffect(() => {\r\n const getInvestmentInfo = async () => {\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/investment-services/find-all`).then(res => {\r\n setInvestmentInfo(res.data)\r\n }).catch(err => console.error(err))\r\n }\r\n\r\n const getDisburseInfo = async () => {\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/investment/disburse/find-all`).then(res => {\r\n setInvestmentAdditionalDisburseInfo(res.data)\r\n }).catch(err => console.error(err))\r\n }\r\n \r\n getInvestmentInfo();\r\n getDisburseInfo();\r\n },[])\r\n\r\n\r\n return (\r\n
\r\n\r\n {/* Header 2 */}\r\n \r\n\r\n {/* Breadcroumb */}\r\n \r\n\r\n \r\n {/* Course Details */}\r\n
\r\n \r\n \r\n \r\n
\r\n \r\n
\r\n \r\n \r\n {\r\n investmentInfo && investmentInfo.length > 0 ? investmentInfo.map((info, i) => (\r\n \r\n \r\n \r\n {\r\n
\r\n \r\n \r\n \r\n {/*

Every building is special; accordingly, we provide a fully customised proposal which outlines our customer centred, and cost effective service. \r\n Call Wendy Kenny, Business Development Manager on 9930 0730 or \r\n email \" target=\"_blank\" rel=\"noopener noreferrer\">bdm@realfm.net.au for a confidential discussion about your building.



\r\n \r\n

However, as an indication, a medium size building proposal (80 Lots) may include:

*/}\r\n

\r\n \r\n \r\n \r\n \r\n
\r\n }\r\n \r\n \r\n \r\n \r\n \r\n )): \"No content found\"\r\n }\r\n \r\n \r\n
\r\n
\r\n \r\n \r\n\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {\r\n investmentInfo && investmentInfo.length > 0 ? investmentInfo.map((info, i) => (\r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n )) : \"No contents\"\r\n }\r\n \r\n \r\n \r\n
SERVICE DESCRIPTIONMONTHLY FEE
\r\n {info.invServiceTitle}\r\n
    \r\n {\r\n info.invServiceSubTitle && info.invServiceSubTitle.length > 0 ? info.invServiceSubTitle.map((st, j) => (\r\n
  • \r\n {st}\r\n
    • \r\n )): \"No subtitles found\"\r\n }\r\n \r\n {/*
  • \r\n Includes attendance to strata committee and general meetings to 8pm.
    • */}\r\n
\r\n 		Fixed Fee
\r\n \r\n \r\n
\r\n\r\n
\r\n
ADDITIONAL DISBURSEMENT SCHEDULE
\r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {\r\n investmentAdditionalDisburseInfo && investmentAdditionalDisburseInfo.length > 0 ? investmentAdditionalDisburseInfo.map((val, i) => (\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n )): \"No features\" \r\n }\r\n \r\n \r\n \r\n
SERVICE DESCRIPTIONINCLUDEDCLIENT’S EXPENSE(optional)
\r\n {val.invServiceTitle}\r\n

{val.invServiceSubTitle}

\r\n 		\r\n
    \r\n
  • \r\n {val.hasDisburseFeature == true && }\r\n
    • \r\n \r\n
\r\n 		\r\n
    \r\n
  • \r\n {val.hasClientExpense == true && }\r\n
    • \r\n \r\n
\r\n
\r\n \r\n \r\n
\r\n \r\n\r\n \r\n \r\n \r\n
\r\n \r\n\r\n {/* Footer 2 */}\r\n \r\n\r\n
\r\n )\r\n}\r\n\r\nexport default CommunityPortal","import styled from \"styled-components\";\r\nimport { colors } from \"../../../components/common/element/elements.js\";\r\n\r\nexport const Styles = styled.div`\r\n .event-page {\r\n .event-page-area {\r\n padding : 50px 0 20px;\r\n .event-box {\r\n margin-bottom : 30px;\r\n border-radius: 40px;\r\n\r\n ${'' /* .event-img {\r\n a {\r\n img {\r\n border-radius : 5px;\r\n }\r\n }\r\n\r\n @media(max-width: 991px) {\r\n display : none;\r\n }\r\n } */}\r\n img {\r\n width: 100%;\r\n @media(max-width: 991px) {\r\n width: 65%;\r\n \r\n }\r\n @media(max-width: 767px) {\r\n width: 25%; \r\n }\r\n }\r\n\r\n .client-image {\r\n text-align: center;\r\n vertical-align: middle;\r\n line-height: 90px; \r\n width: 100%;\r\n\r\n }\r\n .event-content {\r\n position: relative;\r\n .content-box {\r\n box-shadow: 0 0px 20px rgba(0, 0, 0, 0.08);\r\n padding : 20px;\r\n background: #ffffff;\r\n border-radius : 5px;\r\n position: absolute;\r\n top : 22px;\r\n left : -9%;\r\n z-index : 1;\r\n .event-title{\r\n h6 {\r\n margin-bottom: 10px;\r\n a {\r\n color : ${colors.black1};\r\n font-weight: 600;\r\n\r\n &:hover {\r\n color: ${colors.green};\r\n }\r\n }\r\n }\r\n }\r\n\r\n .event-time-location {\r\n margin-bottom : 10px;\r\n ul {\r\n li {\r\n font-size : 13px;\r\n color: ${colors.text3};\r\n i {\r\n font-size : 18px;\r\n color: ${colors.green};\r\n vertical-align: top;\r\n }\r\n &:first-child {\r\n margin-right : 20px;\r\n }\r\n }\r\n }\r\n }\r\n\r\n .event-desc {\r\n p {\r\n font-size : 13px;\r\n color: ${colors.text2};\r\n line-height : 20px;\r\n }\r\n\r\n @media(max-width: 767px) {\r\n margin-bottom: 10px;\r\n }\r\n }\r\n\r\n .event-date {\r\n position: relative;\r\n margin-bottom : 20px;\r\n padding-top: 6px;\r\n &:before {\r\n position : absolute;\r\n content : '';\r\n background : ${colors.border1};\r\n width : 1px;\r\n height : 100px;\r\n top : 0;\r\n left : -30px;\r\n\r\n @media(max-width: 767px) {\r\n content : none;\r\n }\r\n }\r\n p {\r\n font-size : 20px;\r\n color: ${colors.green};\r\n font-weight: 500;\r\n text-transform : uppercase;\r\n\r\n @media(max-width: 767px) {\r\n float: left;\r\n font-size: 18px;\r\n margin-right: 20px;\r\n }\r\n }\r\n\r\n @media(max-width: 767px) {\r\n margin-bottom: 0;\r\n padding-top: 0;\r\n }\r\n }\r\n\r\n .join-btn {\r\n a {\r\n font-size : 12px;\r\n color: ${colors.black2};\r\n border: 1px solid ${colors.border3};\r\n font-weight : 500;\r\n text-transform : uppercase;\r\n padding: 9px 12px 7px;\r\n border-radius: 5px;\r\n &:hover {\r\n color: #ffffff;\r\n background: ${colors.gr_bg};\r\n border-color : ${colors.green};\r\n }\r\n\r\n @media(max-width: 767px) {\r\n float: left;\r\n padding: 5px 10px 3px;\r\n }\r\n }\r\n }\r\n\r\n @media(max-width: 991px) {\r\n position: unset;\r\n }\r\n }\r\n }\r\n\r\n &:hover {\r\n box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;\r\n }\r\n \r\n }\r\n\r\n ul.pagination-box {\r\n margin-top: 50px;\r\n }\r\n\r\n .course-sidebar {\r\n @media(max-width: 991px) {\r\n display : none;\r\n }\r\n }\r\n\r\n @media(max-width: 767px) {\r\n padding : 40px 0 25px;\r\n }\r\n }\r\n }\r\n`;","import React, { useEffect } from 'react';\r\nimport Datas from '../../data/testimonials/comments.json';\r\nimport { Container, Row, Col, Card } from 'react-bootstrap';\r\nimport HeaderTwo from '../../components/HeaderTwo';\r\nimport { BreadcrumbBox } from '../../components/common/Breadcrumb';\r\nimport FooterTwo from '../../components/FooterTwo';\r\nimport { Styles } from './styles/testimonial.js';\r\nimport axios from 'axios';\r\nimport { useDispatch, useSelector, connect } from 'react-redux';\r\nimport { getTestimonials, showLoading, hideLoading } from '../../redux/actions/testimonial';\r\n\r\n\r\nconst ClientsTestimonial = () => {\r\n // componentDidMount(){\r\n // document.title = \"Clients Testimonial | REAL FM\";\r\n // }\r\n\r\n const testimonials = useSelector(state => state.allTestimonials.testimonials);\r\n\r\n const dispatch = useDispatch();\r\n\r\n useEffect(() => {\r\n document.title = \"Our Experience | REAL FM\";\r\n },[]);\r\n\r\n\r\n useEffect(() => {\r\n const fetchAllTestimonials = async () => {\r\n dispatch(showLoading());\r\n await axios.get(`${process.env.REACT_APP_API_URL}/real-fm/api/v1/testimonials/find-all`).then((res) => {\r\n dispatch(getTestimonials(res.data));\r\n dispatch(hideLoading());\r\n\r\n }).catch(error => {\r\n console.error(error);\r\n });\r\n };\r\n fetchAllTestimonials();\r\n }, [dispatch]);\r\n\r\n\r\n return (\r\n \r\n {/* Main Wrapper */}\r\n
\r\n\r\n {/* Header 2 */}\r\n \r\n\r\n {/* Breadcroumb */}\r\n \r\n\r\n {/* ClientsTestimonial Area */}\r\n
\r\n \r\n \r\n \r\n {\r\n testimonials !== null && testimonials.length > 0 ? testimonials.map((data, i) => (\r\n
\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n {/* \"\" */}\r\n {data.testimonialTitle}\r\n \r\n \r\n {data.testimonialTitle}\r\n \r\n {data.testimonialDesc}\r\n \r\n \r\n - {data.authorName}\r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n
\r\n )): \"No testimonial found\"\r\n }\r\n\r\n \r\n \r\n \r\n
\r\n\r\n\r\n {/* Footer 2 */}\r\n \r\n\r\n
\r\n \r\n )\r\n}\r\n\r\nexport default ClientsTestimonial","import { GET_PRODUCTS } from '../constants/product';\r\nimport { SHOW_LOADING, HIDE_LOADING } from '../constants/commons';\r\n\r\nconst initialState = {\r\n loading: false,\r\n products: [],\r\n}\r\n\r\nexport const productReducer = (state = initialState, {type, payload}) => {\r\n switch (type) {\r\n case GET_PRODUCTS:\r\n return {...state, products: payload};\r\n case SHOW_LOADING:\r\n return {...state, loading: true};\r\n case HIDE_LOADING:\r\n return {...state, loading: false};\r\n default:\r\n return state;\r\n }\r\n} ","import { GET_TESTIMONIALS } from '../constants/testimonial';\r\nimport { SHOW_LOADING, HIDE_LOADING } from '../constants/commons';\r\n\r\nconst initialState = {\r\n loading: false,\r\n testimonials: [],\r\n}\r\n\r\nexport const testimonialReducer = (state = initialState, {type, payload}) => {\r\n switch (type) {\r\n case GET_TESTIMONIALS:\r\n return {...state, testimonials: payload};\r\n case SHOW_LOADING:\r\n return {...state, loading: true};\r\n case HIDE_LOADING:\r\n return {...state, loading: false};\r\n default:\r\n return state;\r\n }\r\n} ","import { GET_CONTACTS } from '../constants/contact';\r\nimport { SHOW_LOADING, HIDE_LOADING } from '../constants/commons';\r\n\r\nconst initialState = {\r\n loading: false,\r\n contacts: [],\r\n}\r\n\r\nexport const contactReducer = (state = initialState, {type, payload}) => {\r\n switch (type) {\r\n case GET_CONTACTS:\r\n return {...state, contacts: payload};\r\n case SHOW_LOADING:\r\n return {...state, loading: true};\r\n case HIDE_LOADING:\r\n return {...state, loading: false};\r\n default:\r\n return state;\r\n }\r\n} ","import {combineReducers} from 'redux'\r\nimport {productReducer} from './product';\r\nimport {testimonialReducer} from './testimonial';\r\nimport {contactReducer} from './contact';\r\n\r\n\r\nexport const reducers = combineReducers ({\r\n allProducts: productReducer,\r\n allTestimonials: testimonialReducer,\r\n allContacts: contactReducer\r\n})\r\n","import {createStore} from 'redux'\r\nimport {reducers} from '../reducers/index'\r\n\r\nconst store = createStore(reducers, {}, window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__())\r\n\r\nexport default store;","import styled from \"styled-components\";\r\n\r\nexport const Styles = styled.div`\r\n .loader-container {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 100%;\r\n background-color: rgba(0, 0, 0, .6);\r\n z-index: 9;\r\n\r\n .loader {\r\n left: 50%;\r\n top: 50%;\r\n z-index: 99999;\r\n position: absolute;\r\n transform: translate(-50%, -50%);\r\n }\r\n }\r\n`;","\r\nimport React, { Component } from 'react';\r\n// import LoaderGIF from '../../assets/images/loader.gif';\r\nimport { Styles } from \"./styles/fullPageLoader.js\";\r\nimport { connect } from \"react-redux\";\r\n\r\nclass FullPageLoader extends Component {\r\n state = {};\r\n\r\n\r\n render() {\r\n const {loading} = this.props;\r\n\r\n if (!loading) {\r\n return null;\r\n }\r\n return (\r\n \r\n
\r\n
\r\n \"Loading...\"\r\n
\r\n
\r\n \r\n )\r\n }\r\n}\r\n\r\nconst mapStateToProps = state => ({loading: state.allProducts.loading})\r\n\r\nexport default connect(mapStateToProps)(FullPageLoader);","import React, {useEffect} from 'react';\r\nimport { BrowserRouter as Router, Switch, Route } from 'react-router-dom';\r\nimport ScrollToTop from './helper/ScrollToTop';\r\nimport { GlobalStyle } from \"./components/common/styles/global.js\";\r\nimport HomeOne from './HomeOne';\r\nimport BuildingFacilityDetails from './pages/buildingfacility/BuildingFacilityDetails';\r\nimport ConciergeService from './pages/concierge/ConciergeService';\r\nimport CleaningService from './pages/cleaning/CleaningService';\r\nimport Services from './pages/service/Services';\r\nimport Contact from './pages/contact/Contact';\r\nimport PageNotFound from './pages/404/PageNotFound';\r\nimport Product from './pages/shop/Products';\r\nimport GardeningLandscaping from './pages/gardening/GardeningLandscaping';\r\nimport ProjectAndDeveloperService from './pages/developer/ProjectAndDeveloperService';\r\nimport CommunityPortal from './pages/community/CommunityPortal';\r\nimport Investment from './pages/investment/Investment';\r\nimport ClientsTestimonial from './pages/clientsTestimonial/ClientsTestimonial';\r\nimport { Provider } from 'react-redux';\r\nimport store from './redux/store';\r\nimport FullPageLoader from './helper/FullPageLoader';\r\nimport ReactGA from \"react-ga\";\r\n\r\nconst TRACKING_ID = \"G-BXMDNTQ5YY\"; // OUR_TRACKING_ID\r\n\r\nReactGA.initialize(TRACKING_ID);\r\n\r\nfunction App() { \r\n useEffect(() => {\r\n ReactGA.pageview(window.location.pathname + window.location.search);\r\n }, []);\r\n \r\n return (\r\n \r\n \r\n \r\n \r\n \r\n\r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n \r\n )\r\n}\r\n\r\nexport default App;","// This optional code is used to register a service worker.\n// register() is not called by default.\n\n// This lets the app load faster on subsequent visits in production, and gives\n// it offline capabilities. However, it also means that developers (and users)\n// will only see deployed updates on subsequent visits to a page, after all the\n// existing tabs open on the page have been closed, since previously cached\n// resources are updated in the background.\n\n// To learn more about the benefits of this model and instructions on how to\n// opt-in, read https://bit.ly/CRA-PWA\n\nconst isLocalhost = Boolean(\n window.location.hostname === 'localhost' ||\n // [::1] is the IPv6 localhost address.\n window.location.hostname === '[::1]' ||\n // 127.0.0.0/8 are considered localhost for IPv4.\n window.location.hostname.match(\n /^127(?:\\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/\n )\n);\n\nexport function register(config) {\n if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {\n // The URL constructor is available in all browsers that support SW.\n const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);\n if (publicUrl.origin !== window.location.origin) {\n // Our service worker won't work if PUBLIC_URL is on a different origin\n // from what our page is served on. This might happen if a CDN is used to\n // serve assets; see https://github.com/facebook/create-react-app/issues/2374\n return;\n }\n\n window.addEventListener('load', () => {\n const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;\n\n if (isLocalhost) {\n // This is running on localhost. Let's check if a service worker still exists or not.\n checkValidServiceWorker(swUrl, config);\n\n // Add some additional logging to localhost, pointing developers to the\n // service worker/PWA documentation.\n navigator.serviceWorker.ready.then(() => {\n console.log(\n 'This web app is being served cache-first by a service ' +\n 'worker. To learn more, visit https://bit.ly/CRA-PWA'\n );\n });\n } else {\n // Is not localhost. Just register service worker\n registerValidSW(swUrl, config);\n }\n });\n }\n}\n\nfunction registerValidSW(swUrl, config) {\n navigator.serviceWorker\n .register(swUrl)\n .then(registration => {\n registration.onupdatefound = () => {\n const installingWorker = registration.installing;\n if (installingWorker == null) {\n return;\n }\n installingWorker.onstatechange = () => {\n if (installingWorker.state === 'installed') {\n if (navigator.serviceWorker.controller) {\n // At this point, the updated precached content has been fetched,\n // but the previous service worker will still serve the older\n // content until all client tabs are closed.\n console.log(\n 'New content is available and will be used when all ' +\n 'tabs for this page are closed. See https://bit.ly/CRA-PWA.'\n );\n\n // Execute callback\n if (config && config.onUpdate) {\n config.onUpdate(registration);\n }\n } else {\n // At this point, everything has been precached.\n // It's the perfect time to display a\n // \"Content is cached for offline use.\" message.\n console.log('Content is cached for offline use.');\n\n // Execute callback\n if (config && config.onSuccess) {\n config.onSuccess(registration);\n }\n }\n }\n };\n };\n })\n .catch(error => {\n console.error('Error during service worker registration:', error);\n });\n}\n\nfunction checkValidServiceWorker(swUrl, config) {\n // Check if the service worker can be found. If it can't reload the page.\n fetch(swUrl, {\n headers: { 'Service-Worker': 'script' },\n })\n .then(response => {\n // Ensure service worker exists, and that we really are getting a JS file.\n const contentType = response.headers.get('content-type');\n if (\n response.status === 404 ||\n (contentType != null && contentType.indexOf('javascript') === -1)\n ) {\n // No service worker found. Probably a different app. Reload the page.\n navigator.serviceWorker.ready.then(registration => {\n registration.unregister().then(() => {\n window.location.reload();\n });\n });\n } else {\n // Service worker found. Proceed as normal.\n registerValidSW(swUrl, config);\n }\n })\n .catch(() => {\n console.log(\n 'No internet connection found. App is running in offline mode.'\n );\n });\n}\n\nexport function unregister() {\n if ('serviceWorker' in navigator) {\n navigator.serviceWorker.ready\n .then(registration => {\n registration.unregister();\n })\n .catch(error => {\n console.error(error.message);\n });\n }\n}\n","import React from \"react\";\nimport ReactDOM from \"react-dom\";\nimport App from \"./App\";\nimport 'bootstrap/dist/css/bootstrap.min.css';\nimport * as serviceWorker from \"./serviceWorker\";\n\nReactDOM.render(, document.getElementById(\"root\"));\n\nserviceWorker.unregister();"],"sourceRoot":""}