export function Marquee() {
  return (
    <div className="flex flex-nowrap w-full overflow-hidden desktop:max-h-[100px] tablet:max-h-[82px] mobile:max-h-20">
      <div className="flex absolute z-40 right-0 mobile:max-tablet:hidden">
        <div className="w-0 h-0 desktop:border-b-[100px] desktop:border-l-[100px] tablet:border-b-[82px] tablet:border-l-[82px] border-[transparent_transparent_#D0D6DF_transparent]" />
        <div className="desktop:w-[260px] tablet:w-[216px] bg-[#D0D6DF]" />
      </div>
      <div className="flex items-stretch overflow-clip animate-infinite-scroll">
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C] py-[30px]">
          <img
            src="src/assets/partners_logos/rosatom.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/rzhd.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/npoa.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/dubai_police.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/ugmk.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/moscowgov.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/mintransrf.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/uztm.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/uralhimmash.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/elem.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/electrohimpribor.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/uralvagonzavod.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/croc.svg"
            className="m-auto"
            alt=""
          />
        </div>
      </div>
      <div
        className="flex items-stretch overflow-clip animate-infinite-scroll"
        aria-hidden
      >
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/rosatom.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/rzhd.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/npoa.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/dubai_police.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/ugmk.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/moscowgov.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/mintransrf.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/uztm.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/uralhimmash.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/elem.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/electrohimpribor.svg"
            className="m-auto"
            alt=""
          />
        </div>

        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/uralvagonzavod.svg"
            className="m-auto"
            alt=""
          />
        </div>
        <div className="desktop:min-w-[212px] tablet:min-w-[180px] mobile:min-w-[170px] flex border border-[#3D425C]">
          <img
            src="src/assets/partners_logos/croc.svg"
            className="m-auto"
            alt=""
          />
        </div>
      </div>
    </div>
  );
}
