technology logo
technology logo

home

share link

by ehtishamali551 dot icon Updated: Jan 17, 2023

Guide Kit Guide Kit  

         View Our Services

            </button>

          </div>

        </div>

      </div>

      {/*   About Us

       Number One Technology Agency section start here*/}

      <div className=" xxs:px-4 md:px-0 xxs:h-[925px] md:h-[750px] lg:h-[630px] flex flex-cols-2 xxs:flex-col  lg:flex-row lg:justify-center text-center lg:text-left xxs:justify-start xxs:text-left  bg-gradient-to-bl  font-Poppins to-cyan from-blue via-blue text-white  z-[-1]">

        <div className=" flex  xl:pl-[8rem] lg:pl-[5rem] flex-col xl:w-[60%] lg:w-[50%]  pt-[5rem] md:mx-11 lg:mx-0">

          <p className="text-yellow  text-[16px] font-bold font-Poppins">

            ABOUT US

          </p>

          <h6 className="xl:text-[32px] lg:text-[24px] font-bold font-Poppins xl:w-[72%] lg:w-[75%] pt-4 leading-8">

          Number One Technology Agency  in Pasuruan

          </h6>

          <div className="flex-row flex justify-between w-[20rem] lg:w-[16rem] xxs:w-[14rem] lg:pt-12 xxs:pt-6 md:pt-8 xxl:pt-6 xxs:flex lg:hidden">

            <div className=" text-white">

              <div className="border-cyan  border-l-2">

                <span className="text-[20px] font-bold ml-2 font-Poppins">

                  50+

                </span>

              </div>

              <p className="text-[16px] ml-2">Total Clients</p>

            </div>

            <div className="text-white">

              <div className="border-cyan  border-l-2">

                <span className="text-[20px] font-bold ml-2 font-Poppins">

                  20+

                </span>

              </div>

              <p className="text-[15px] ml-2">Ongoing Projects</p>

            </div>

          </div>

          <p className="2xl:w-[73%] xl:w-[87%]  lg:w-[87%] text-pgcolor text-[16px] font-[400] pt-6">

            Genesis Engineering was established back in 2010 when our CEO,

            Muddaser Ahmed, realized that nearshore development solutions help

            build empires. So he went on to strike the right deals and the rest

            is history.

          </p>

          <p className="2xl:w-[72%] xl:w-[77%] lg:w-[82%] pt-8 text-pgcolor text-[16px] font-[400]  font-Poppins xxs:block lg:hidden">

            In addition to our Client-Tailored Software Development services,

            Genesis Engineering has ingrained itself as an unrivaled player in

            Product Design, DevOps Automation, Mobile Application Development,

            Cloud Consulting, and System Integration.

          </p>

          <button className="mt-8 bg-cyan text-white text-[14px] pt-2 pb-2 pr-4 pl-4 xl:ml-4 md:ml-0 lg:ml-2 xl:w-[30%] lg:w-[32%]  md:w-[40%]">

            WIEW DETAIL

          </button>

        </div>

        <div className="flex flex-col  w-[50%] pt-[5rem] md:mx-11 lg:mx-0 xxs:hidden lg:flex">

          <div className="flex-row flex justify-between w-[20rem] lg:w-[16rem] pt-12 xxl:pt-6  ">

            <div className=" text-white">

              <div className="border-cyan  border-l-2">

                <span className="text-[20px] font-bold ml-2 font-Poppins">

                  50+

                </span>

              </div>

              <p className="text-[16px] ml-2">Total Clients</p>

            </div>

            <div className="text-white">

              <div className="border-cyan  border-l-2">

                <span className="text-[20px] font-bold ml-2 font-Poppins">

                  20+

                </span>

              </div>

              <p className="text-[15px] ml-2">Ongoing Projects</p>

            </div>

          </div>

          <p className="2xl:w-[72%] xl:w-[77%] lg:w-[82%] pt-8 text-pgcolor text-[16px] font-[400]  font-Poppins">

            In addition to our Client-Tailored Software Development services,

            Genesis Engineering has ingrained itself as an unrivaled player in

            Product Design, DevOps Automation, Mobile Application Development,

            Cloud Consulting, and System Integration.

          </p>

        </div>

       

      </div>

     

     

        <div className="bg-bgColor    xxs:px-4 md:px-0 ">

        <div className=" flex justify-center   ">

          <div className=" xxs:h-[46vh] md:h-[57vh] xl:h-[42vh]  lg:h-[35vh] flex xxs:flex-col lg:flex  justify-center items-center  flex-col 2xl:w-[82%] xl:w-[84%]  shadow-lg   lg:w-[85%] md:w-[85%] xxs:w-[100%] z-1 bg-white xxs:px-4 md:px-0  xxl:mt-[-7rem] lg:mt-[-5rem] xxs:mt-[-4rem]">

           

          <p className="text-yellow text-[16px] font-bold font-Poppins md:mt-[3rem] xxs:mt-[2rem] lg:mt-0">OUR WORK</p>

          <h6 className="lg:text-[42px] md:text-[28px] font-bold font-Poppins xl:w-[50%] lg:w-[50%] md:w-[45%] text-center lg:pt-2 md:pt-6 xxs:pt-4">Our goal is to make clients happy</h6>

          <div className=" flex xxs:flex-col lg:flex-row xxs:h-[300px] lg:h-auto md:mt-[1rem] lg:mt-0 ">

            <button className="lg:mt-8 xxs:mt-4  rounded-xl bg-yellow text-white text-[14px] pt-2 pb-2 pr-4 pl-4 xl:ml-4 lg:ml-2  md:ml-0 lg:w-[142px] md:w-[304px] xxs:w-[220px] ">Web Apps (20)</button>

            <button className="lg:mt-8 xxs:mt-4 rounded-xl bg-yellow text-white text-[14px] pt-2 pb-2 pr-4 pl-4 xl:ml-4 lg:ml-2 md:ml-0 lg:w-[160px] md:w-[304px] xxs:w-[220px] ">Mobile Apps (30)</button>

            <button className="lg:mt-8 xxs:mt-4 rounded-xl bg-yellow text-white text-[14px] pt-2 pb-2 pr-4 pl-4 xl:ml-4 lg:ml-2 md:ml-0 lg:w-[142px] md:w-[304px] xxs:w-[220px]">DevOps (8)</button>

          </div>

          </div>

        </div>

      <div className="flex flex-col justify-center ">

        <div className="flex flex-cols-2 justify-center flex-wrap  md:p-4 xxl:p-6">

        <div className="lg:p-4 md:p-4 xxl:p-2 xxs:pt-4 md:pt-0">

            <Image src={PlaceHolderImg2} className="md:w-[646px] lg:w-[370px]"/>

            <div className=" flex justify-between flex-row shadow-lg bg-White">

              <div className="flex flex-col p-2">

                <h6 className="text-[16px] font-bold text-blue ">

                  Judul work 1

                </h6>

                <p className="text-[14px] font-[400] text-lightGray">

                  Web Application

                </p>

              </div>

              <div className="flex flex-row p-4">

                <p className="text-lightGreen text-[14px] font-[400]">

                  View Detail

                </p>

                <p className="text-lightGreen text-[14px] font-[400]">Icon</p>

              </div>

            </div>

          </div>

          <div className="lg:p-4 md:p-4 xxl:p-2 xxs:pt-4 md:pt-0 ">

            <Image src={PlaceHolderImg3} className="md:w-[646px] lg:w-[370px]" />

            <div className=" flex justify-between flex-row shadow-lg bg-White">

              <div className="flex flex-col p-2">

                <h6 className="text-[16px] font-bold text-blue ">

                  Judul work 1

                </h6>

                <p className="text-[14px] font-[400] text-lightGray">

                  Web Application

                </p>

              </div>

              <div className="flex flex-row p-4">

                <p className="text-lightGreen text-[14px] font-[400]">

                  View Detail

                </p>

                <p className="text-lightGreen text-[14px] font-[400]">Icon</p>

              </div>

            </div>

          </div>

          <div className="p-4 xxl:p-2 xxs:hidden lg:block">

            <Image src={PlaceHolderImg2} className="md:w-[646px] lg:w-[370px]" />

            <div className=" flex justify-between flex-row shadow-lg bg-White">

              <div className="flex flex-col p-2">

                <h6 className="text-[16px] font-bold text-blue ">

                  Judul work 1

                </h6>

                <p className="text-[14px] font-[400] text-lightGray">

                  Web Application

                </p>

              </div>

              <div className="flex flex-row p-4">

                <p className="text-lightGreen text-[14px] font-[400]">

                  View Detail

                </p>

                <p className="text-lightGreen text-[14px] font-[400]">Icon</p>

              </div>

            </div>

          </div>

          <div className="p-4 xxl:p-2 xxs:hidden lg:block">

            <Image src={PlaceHolderImg3} />

            <div className=" flex justify-between flex-row shadow-lg bg-White">

              <div className="flex flex-col p-2">

                <h6 className="text-[16px] font-bold text-blue ">

                  Judul work 1

                </h6>

                <p className="text-[14px] font-[400] text-lightGray">

                  Web Application

                </p>

              </div>

              <div className="flex flex-row p-4">

                <p className="text-lightGreen text-[14px] font-[400]">

                  View Detail

                </p>

                <p className="text-lightGreen text-[14px] font-[400]">Icon</p>

              </div>

            </div>

          </div>

          <div className="lg:p-4 md:p-4 xxl:p-2 xxs:pt-4 md:pt-0">

            <Image src={PlaceHolderImg4} className="md:w-[646px] lg:w-[370px]" />

            <div className=" flex justify-between flex-row shadow-lg bg-White">

              <div className="flex flex-col p-2">

                <h6 className="text-[16px] font-bold text-blue ">

                  Judul work 1

                </h6>

                <p className="text-[14px] font-[400] text-lightGray">

                  Web Application

                </p>

              </div>

              <div className="flex flex-row p-4">

                <p className="text-lightGreen text-[14px] font-[400]">

                  View Detail

                </p>

                <p className="text-lightGreen text-[14px] font-[400]">Icon</p>

              </div>

            </div>

          </div>

        </div>

        <div className="flex justify-center">

          <button className="mt-10 xl:mt-6 bg-cyan text-white text-[16px] pt-2 pb-2 pr-6 pl-6 2xl:w-[13%] xl:w-[14%] lg:w-[20%] md:w-[40%] xxs:w-[100%] font-Poppins">

            VIEW ALL WORK

          </button>

        </div>

      </div>


      <div className=" flex xxs:flex-col lg:flex-row h-[557px] xl:pt-[6rem] lg:pt-[4rem] md:pt-[4rem]  xxs:pt-[2.5rem]">

        <div className=" bg-blue xl:w-[48%] xxl:w-[40%]  lg:w-[46%] flex-col  md:mx-11  lg:mx-0">

          <div className="lg:ml-[8rem] md:ml-[2rem] xxs:ml-4  xxl:ml-[9rem] lg:pt-[4rem] md:pt-[3rem] xxs:pt-12  ">

          <div className=" ">

            <p className="text-[16px] text-yellow font-[400]  font-Poppins">

              TESTIMONIAL

            </p>

          </div>

          <div className=" pt-2 ">

            <h6 className="xl:text-[35px] lg:text-[32px] md:text-[28px] xxs:text-[21px] font-bold text-white xxl:w-[45%] xl:w-[50%] lg:w-[60%] md:w-[50%] xxs:w-[100%] font-Poppins xl:leading-[3.5rem] lg:leading-[2rem] ">

              What Our Customers Are Saying

            </h6>

          </div>

          <div className="text-white flex flex-row  xl:pt-4 lg:pt-6 md:pt-8 lg:pb-0 md:pb-12 xxs:pt-6 xxs:pb-12">

            <div className="border-cyan  border-l-2">

              <span className="text-[20px] font-bold ml-2 font-Poppins">

                30+

              </span>

            </div>

            <p className="text-[15px] ml-2 flex justify-center items-center text-lightGray ">

            Testimonial

            </p>

          </div>

          </div>

        </div>

        <div className="lg:w-[50%] md:w-[85%] xxs:w-[100%] flex flex-col  xxs:justify-start md:mx-11  lg:mx-0">

          <div className="  xxl:ml-[10rem] lg:ml-[2rem] xxl:pt-[2rem] xl:pt-[2.5rem] lg:pt-[4rem] xxs:pt-12 md:pt-8">

          <h6 className="md:text-[24px] xxs:text-[20px] font-bold lg:ml-6  md:ml-0 xxs:w-[100%]">Web Development</h6>

         

          <p className="md:text-[16px] xxs:text-[14px] font-[400] text-lightGray xl:w-[64%] lg:w-[81%] md:w-[100%] xxs:w-[100%] lg:ml-6  md:ml-0 xl:pt-8 lg:pt-4 md:pt-6 xxs:pt-6">

            A+ Agency is absolutely incredible. They are the most talented group

            of designers I've ever worked with or encountered. They are also

            very professional and complete everything to the highest quality

            bar. A+ will be my first call for design work for years to come.

          </p>

          <div className="flex flex-row xl:pt-6 lg:pt-4 lg:pl-6 xxs:pl-0   md:pt-6 xxs:pt-6">

            <Image src={OnkySoeryaIcon} className=""/>

            <div className="flex flex-col  pl-2  justify-center ">

              <h6 className="text-[14px] font-bold ">Onky Soerya</h6>

              <p className="text-[14px] font-[400] text-lightGray pt-1">CEO at Bukapalak</p>

            </div>

   

          </div>

          <div  className="flex flex-row  xl:pt-6 lg:pt-4 lg:pl-6 xxs:pl-0 xxs:justify-center lg:justify-start xxs:w-[100%] lg:w-auto  md:pt-6 xxs:pt-6">

            <Image src={LeftArrowBg} className="lg:m-2 xxs:m-4"/>

            <Image  src={RightArrowBg}className="lg:m-2 xxs:m-4 "  />

          </div>

          </div>

        </div>

      </div>

      <div className="flex xxs:flex-col justify-start lg:flex-row  lg:pt-[6rem] lg:pb-[6rem] md:pb-[4rem] md:pt-[15rem] xxs:pb-[3rem] xxs:pt-[12rem] md:mx-11  lg:mx-0">

        <div className="xl:w-[70%] xxs:ml-0 xl:ml-[7rem] lg:ml-[4rem] xxl:ml-[9rem] flex-col">

          <p className="text-[16px] font-bold text-yellow">WORK WITH US</p>

          <h6 className="md:text-[32px] xxs:text-[24px] font-bold xl:w-[85%] 2xl:w-[78%] xxl:w-[60%] lg:w-[85%] md:w-[66%] xxs:pt-4 md:pt-4 lg:pt-0">Have you decided to work on a project with us?</h6>

          <div className="pt-[2rem] xxl:mr-[22rem] xxs:block lg:hidden ">

            <p className="text-[16px] font-[400] text-lightGray xl:w-[85%] lg:w-[85%] xxl:w-[100%] md:w-[85%] ">Interested in joining our team and impacting the world? Reach out! We are always looking for new projects to help take design to the next level!</p>

          </div>

          <button className="md:mt-8 xxs:mt-6 bg-cyan text-white text-[14px] pt-2 pb-2 pr-4 pl-4 xl:ml-4 lg:ml-2 md:ml-0 lg:w-[30%] md:w-[40%] xxs:w-[100%]">HIRE US</button>


        </div>

        <div>

          <div className="pt-[2rem] xxl:mr-[22rem] xxs:hidden lg:block ">

            <p className="text-[16px] font-[400] text-lightGray xl:w-[85%] lg:w-[85%] xxl:w-[100%] md:w-[85%] ">Interested in joining our team and impacting the world? Reach out! We are always looking for new projects to help take design to the next level!</p>

          </div>

        </div>


      </div>

      </div>