import svgPaths from "./svg-dxeurs6zar";

function Menu() {
  return (
    <div className="absolute contents leading-[0] left-[551px] not-italic text-nowrap top-[84px]" data-name="Menu">
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[551px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Resources</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[551px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">{`Download `}</p>
        <p className="mb-0">Help Center</p>
        <p>&nbsp;</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[756px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">Why Travellers</p>
        <p className="mb-0">Customer Stories</p>
        <p>Instagram post</p>
      </div>
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[756px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Travellers</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[984px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">Terms and Conditions</p>
        <p className="mb-0">Privacy Policy</p>
        <p className="mb-0">FAQs</p>
        <p>Information</p>
      </div>
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[984px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Company</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[1186px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">App Store</p>
        <p>Google Play Store</p>
      </div>
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[1186px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Get App</p>
      </div>
    </div>
  );
}

function ICon() {
  return (
    <div className="absolute left-[135px] size-[32px] top-[226px]" data-name="ICon">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 32 32">
        <g id="ICon">
          <circle cx="16" cy="16" id="Ellipse 2612" r="15.5" stroke="var(--stroke-0, #5B5F62)" />
          <path d={svgPaths.pe943800} fill="var(--fill-0, #5B5F62)" id="Vector" />
        </g>
      </svg>
    </div>
  );
}

function ICon1() {
  return (
    <div className="absolute left-[227px] size-[32px] top-[226px]" data-name="ICon">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 32 32">
        <g id="ICon">
          <circle cx="16" cy="16" id="Ellipse 2614" r="15.5" stroke="var(--stroke-0, #5B5F62)" />
          <path d={svgPaths.p3754fa00} fill="var(--fill-0, #5B5F62)" id="Vector" />
        </g>
      </svg>
    </div>
  );
}

function ICon2() {
  return (
    <div className="absolute left-[181px] size-[32px] top-[226px]" data-name="ICon">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 32 32">
        <g id="ICon">
          <circle cx="16" cy="16" id="Ellipse 2613" r="15.5" stroke="var(--stroke-0, #5B5F62)" />
          <path clipRule="evenodd" d={svgPaths.p2eab3c00} fill="var(--fill-0, #5B5F62)" fillRule="evenodd" id="Vector" />
        </g>
      </svg>
    </div>
  );
}

function SocailIcon() {
  return (
    <div className="absolute contents left-[135px] top-[226px]" data-name="Socail Icon">
      <ICon />
      <ICon1 />
      <ICon2 />
    </div>
  );
}

function Img() {
  return (
    <div className="absolute bg-[#434343] h-[35px] left-[135px] overflow-clip top-[79.01px] w-[98px]" data-name="img">
      <div className="absolute font-['Sen:Bold',_sans-serif] font-bold leading-[0] text-[15px] text-nowrap text-white" style={{ top: "calc(50% - 10.5px)", left: "calc(50% - 18px)" }}>
        <p className="leading-[20px] whitespace-pre">Logo</p>
      </div>
    </div>
  );
}

function Footer() {
  return (
    <div className="absolute h-[339px] left-1/2 overflow-clip top-[2306px] translate-x-[-50%] w-[1440px]" data-name="Footer">
      <Menu />
      <SocailIcon />
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[0] left-[135px] not-italic text-[#5b5f62] text-[16px] top-[134px] w-[141px]">
        <p className="leading-[26px]">Enjoy the touring with Salty</p>
      </div>
      <Img />
    </div>
  );
}

function ImageSvgrepoCom() {
  return (
    <div className="absolute left-1/2 size-[60px] top-1/2 translate-x-[-50%] translate-y-[-50%]" data-name="image_svgrepo.com">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 60 60">
        <g id="image_svgrepo.com">
          <path d={svgPaths.p1660e80} id="Vector" stroke="var(--stroke-0, white)" strokeLinejoin="round" strokeWidth="2.5" />
          <path d={svgPaths.p349a7f80} id="Vector_2" stroke="var(--stroke-0, white)" strokeLinejoin="round" strokeWidth="2.5" />
        </g>
      </svg>
    </div>
  );
}

function Img1() {
  return (
    <div className="absolute bg-[#d9d9d9] h-[252px] left-[1698px] rounded-[20px] top-[2084px] w-[362px]" data-name="img">
      <ImageSvgrepoCom />
    </div>
  );
}

function Button() {
  return (
    <div className="absolute contents left-[1948px] top-[2439px]" data-name="Button">
      <div className="absolute h-[37px] left-[1948px] rounded-[26px] top-[2439px] w-[100px]">
        <div aria-hidden="true" className="absolute border border-[#2d3134] border-solid inset-0 pointer-events-none rounded-[26px]" />
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[0] left-[1964px] not-italic text-[14px] text-nowrap top-[2451px]">
        <p className="leading-[14px] whitespace-pre">Book Now</p>
      </div>
    </div>
  );
}

function Card8() {
  return (
    <div className="absolute contents left-[1686px] top-[2072px]" data-name="Card 8">
      <div className="absolute bg-white h-[440px] left-[1686px] rounded-[16px] top-[2072px] w-[386px]">
        <div aria-hidden="true" className="absolute border-2 border-solid border-white inset-0 pointer-events-none rounded-[16px]" />
      </div>
      <Img1 />
      <Button />
      <div className="absolute font-['Inter:Semi_Bold',_sans-serif] font-semibold leading-[0] left-[1710px] not-italic text-[#2d3134] text-[0px] text-nowrap top-[2447px]">
        <p className="leading-[20px] whitespace-pre">
          <span className="text-[24px]">$99</span>
          <span className="text-[#5b5f62] text-[24px]"> </span>
          <span className="font-['Inter:Regular',_sans-serif] font-normal not-italic text-[#5b5f62] text-[16px]">/Person</span>
        </p>
      </div>
      <div className="absolute font-['Inter:Semi_Bold',_sans-serif] font-semibold leading-[0] left-[1710px] not-italic text-[#2d3134] text-[24px] text-nowrap top-[2360px]">
        <p className="leading-[24px] whitespace-pre">Rome, Italy</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[0] left-[1710px] not-italic text-[#5b5f62] text-[14px] text-nowrap top-[2398px]">
        <p className="leading-[14px] whitespace-pre">Mountain Hiking Tour</p>
      </div>
    </div>
  );
}

function Frame1261155253() {
  return (
    <div className="absolute content-stretch flex font-['Poppins:Regular',_sans-serif] gap-[37px] items-center leading-[0] left-[305px] not-italic text-[#2d3134] text-[16px] text-nowrap top-[43px] tracking-[0.16px]">
      <div className="relative shrink-0">
        <p className="leading-[16px] text-nowrap whitespace-pre">About Us</p>
      </div>
      <div className="relative shrink-0">
        <p className="leading-[16px] text-nowrap whitespace-pre">Our Products</p>
      </div>
      <div className="relative shrink-0">
        <p className="leading-[16px] text-nowrap whitespace-pre">Your Card</p>
      </div>
    </div>
  );
}

function Frame1261155252() {
  return (
    <div className="absolute bg-black box-border content-stretch flex gap-[8px] items-center justify-center left-[1131px] px-[24px] py-[16px] rounded-[24px] top-[27px]">
      <div className="font-['Poppins:Regular',_sans-serif] leading-[0] not-italic relative shrink-0 text-[16px] text-nowrap text-white tracking-[0.16px]">
        <p className="leading-[16px] whitespace-pre">Get a City Card</p>
      </div>
    </div>
  );
}

function Img2() {
  return (
    <div className="absolute bg-[#434343] h-[35px] left-[135px] overflow-clip top-[34px] w-[98px]" data-name="img">
      <div className="absolute font-['Sen:Bold',_sans-serif] font-bold leading-[0] text-[15px] text-nowrap text-white" style={{ top: "calc(50% - 10.5px)", left: "calc(50% - 18px)" }}>
        <p className="leading-[20px] whitespace-pre">Logo</p>
      </div>
    </div>
  );
}

function LanguageSvgrepoCom() {
  return (
    <div className="relative shrink-0 size-[24px]" data-name="language_svgrepo.com">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 24 24">
        <g id="language_svgrepo.com">
          <path d={svgPaths.p172e0300} fill="var(--fill-0, #2D3134)" id="Vector" />
        </g>
      </svg>
    </div>
  );
}

function CartLargeMinimalisticSvgrepoCom() {
  return (
    <div className="relative shrink-0 size-[24px]" data-name="cart-large-minimalistic_svgrepo.com">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 24 24">
        <g id="cart-large-minimalistic_svgrepo.com">
          <path d={svgPaths.p1873f780} id="Vector" stroke="var(--stroke-0, #2D3134)" strokeWidth="1.5" />
          <path d={svgPaths.p1358f400} id="Vector_2" stroke="var(--stroke-0, #2D3134)" strokeWidth="1.5" />
          <path d={svgPaths.p2ddd6280} id="Vector_3" stroke="var(--stroke-0, #2D3134)" strokeLinecap="round" strokeWidth="1.5" />
        </g>
      </svg>
    </div>
  );
}

function Frame48095472() {
  return (
    <div className="absolute content-stretch flex gap-[16px] items-center left-[1030px] top-[39px]">
      <LanguageSvgrepoCom />
      <CartLargeMinimalisticSvgrepoCom />
    </div>
  );
}

function Navigation() {
  return (
    <div className="absolute backdrop-blur-[10px] backdrop-filter bg-[rgba(255,255,255,0.3)] h-[102px] left-0 overflow-clip top-0 w-[1440px]" data-name="Navigation">
      <Frame1261155253 />
      <Frame1261155252 />
      <Img2 />
      <Frame48095472 />
    </div>
  );
}

function Frame1000005536() {
  return (
    <div className="content-stretch flex gap-[17px] items-center relative shrink-0">
      <div className="flex h-[24px] items-center justify-center relative shrink-0 w-[0px]">
        <div className="flex-none rotate-[270deg]">
          <div className="h-0 relative w-[24px]">
            <div className="absolute bottom-0 left-0 right-0 top-[-3px]">
              <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 24 3">
                <line id="Line 2" stroke="var(--stroke-0, #2D2D2D)" strokeWidth="3" x2="24" y1="1.5" y2="1.5" />
              </svg>
            </div>
          </div>
        </div>
      </div>
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#2d2d2d] text-[22px] w-[122px]">
        <p className="leading-[normal]">Search by</p>
      </div>
    </div>
  );
}

function CheckBox() {
  return (
    <div className="relative rounded-[4px] shrink-0 size-[20px]" data-name="Check Box">
      <div aria-hidden="true" className="absolute border border-[#bebebe] border-solid inset-0 pointer-events-none rounded-[4px]" />
    </div>
  );
}

function Frame1000005537() {
  return (
    <div className="content-stretch flex gap-[9px] items-center relative shrink-0 w-[226px]">
      <CheckBox />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] text-nowrap">
        <p className="leading-[1.705] whitespace-pre" dir="auto">
          Dining (3)
        </p>
      </div>
    </div>
  );
}

function CheckBox1() {
  return (
    <div className="relative rounded-[4px] shrink-0 size-[20px]" data-name="Check Box">
      <div aria-hidden="true" className="absolute border border-[#bebebe] border-solid inset-0 pointer-events-none rounded-[4px]" />
    </div>
  );
}

function Frame1000005547() {
  return (
    <div className="content-stretch flex gap-[9px] items-center relative shrink-0 w-[226px]">
      <CheckBox1 />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] text-nowrap">
        <p className="leading-[1.705] whitespace-pre" dir="auto">
          Sports (3)
        </p>
      </div>
    </div>
  );
}

function CheckBox2() {
  return (
    <div className="relative rounded-[4px] shrink-0 size-[20px]" data-name="Check Box">
      <div aria-hidden="true" className="absolute border border-[#bebebe] border-solid inset-0 pointer-events-none rounded-[4px]" />
    </div>
  );
}

function Frame1000005546() {
  return (
    <div className="content-stretch flex gap-[9px] items-center relative shrink-0 w-[226px]">
      <CheckBox2 />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] w-[126px]">
        <p className="leading-[1.705]" dir="auto">
          Stays (3)
        </p>
      </div>
    </div>
  );
}

function CheckBox3() {
  return (
    <div className="relative rounded-[4px] shrink-0 size-[20px]" data-name="Check Box">
      <div aria-hidden="true" className="absolute border border-[#bebebe] border-solid inset-0 pointer-events-none rounded-[4px]" />
    </div>
  );
}

function Frame1000005545() {
  return (
    <div className="content-stretch flex gap-[9px] items-center relative shrink-0 w-[226px]">
      <CheckBox3 />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] w-[126px]">
        <p className="leading-[1.705]" dir="auto">
          Food (3)
        </p>
      </div>
    </div>
  );
}

function CheckBox4() {
  return (
    <div className="relative rounded-[4px] shrink-0 size-[20px]" data-name="Check Box">
      <div aria-hidden="true" className="absolute border border-[#bebebe] border-solid inset-0 pointer-events-none rounded-[4px]" />
    </div>
  );
}

function Frame1000005544() {
  return (
    <div className="content-stretch flex gap-[9px] items-center relative shrink-0 w-[226px]">
      <CheckBox4 />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] w-[126px]">
        <p className="leading-[1.705]" dir="auto">
          Drinks (3)
        </p>
      </div>
    </div>
  );
}

function CheckBox5() {
  return (
    <div className="relative rounded-[4px] shrink-0 size-[20px]" data-name="Check Box">
      <div aria-hidden="true" className="absolute border border-[#bebebe] border-solid inset-0 pointer-events-none rounded-[4px]" />
    </div>
  );
}

function Frame1000005543() {
  return (
    <div className="content-stretch flex gap-[9px] items-center relative shrink-0 w-[226px]">
      <CheckBox5 />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] text-nowrap">
        <p className="leading-[1.705] whitespace-pre" dir="auto">
          Museum (3)
        </p>
      </div>
    </div>
  );
}

function Frame1000005539() {
  return (
    <div className="content-stretch flex flex-col gap-[16px] items-start relative shrink-0">
      <Frame1000005537 />
      <Frame1000005547 />
      <Frame1000005546 />
      <Frame1000005545 />
      <Frame1000005544 />
      <Frame1000005543 />
    </div>
  );
}

function Frame1000005548() {
  return (
    <div className="content-stretch flex flex-col gap-[24px] items-start relative shrink-0">
      <Frame1000005536 />
      <Frame1000005539 />
    </div>
  );
}

function Frame1000005535() {
  return (
    <div className="bg-white relative shrink-0">
      <div className="box-border content-stretch flex gap-[10px] items-start overflow-clip px-[30px] py-[40px] relative">
        <Frame1000005548 />
      </div>
      <div aria-hidden="true" className="absolute border border-[#e2e2e2] border-solid inset-0 pointer-events-none" />
    </div>
  );
}

function Frame1000005557() {
  return (
    <div className="content-stretch flex flex-col gap-[32px] items-start relative shrink-0">
      <Frame1000005535 />
    </div>
  );
}

function Group() {
  return (
    <div className="absolute inset-[8.33%_12.5%_12.5%_8.33%]" data-name="Group">
      <div className="absolute inset-[-7.018%]">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 17 17">
          <g id="Group">
            <path d={svgPaths.p12efde80} id="Vector" stroke="var(--stroke-0, white)" strokeLinecap="round" strokeWidth="2" />
          </g>
        </svg>
      </div>
    </div>
  );
}

function AkarIconsSearch() {
  return (
    <div className="overflow-clip relative shrink-0 size-[18px]" data-name="akar-icons:search">
      <Group />
    </div>
  );
}

function Frame48095395() {
  return (
    <div className="bg-[#666666] box-border content-stretch flex gap-[10px] items-start p-[11px] relative rounded-[24px] shrink-0">
      <AkarIconsSearch />
    </div>
  );
}

function Frame48095388() {
  return (
    <div className="backdrop-blur-[11px] backdrop-filter box-border content-stretch flex items-center justify-between pl-[20px] pr-[8px] py-[8px] relative rounded-[42px] shrink-0 w-[922px]">
      <div aria-hidden="true" className="absolute border border-[rgba(0,0,0,0.15)] border-solid inset-0 pointer-events-none rounded-[42px]" />
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#5f5f5f] text-[16px] text-center text-nowrap">
        <p className="leading-[normal] whitespace-pre">Search An Attraction</p>
      </div>
      <Frame48095395 />
    </div>
  );
}

function Frame1000005558() {
  return (
    <div className="content-stretch flex flex-col items-start justify-center leading-[0] not-italic relative shrink-0 text-[16px]">
      <div className="font-['Inter:Bold',_sans-serif] font-bold relative shrink-0 text-[#414141] text-nowrap">
        <p className="leading-[1.705] whitespace-pre" dir="auto">
          Showing 1–12 of 24 item(s)
        </p>
      </div>
      <div className="font-['Inter:Regular',_sans-serif] font-normal relative shrink-0 text-[#949494] w-[944px]">
        <p className="leading-[1.705]" dir="auto">
          Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
        </p>
      </div>
    </div>
  );
}

function Frame1000005519() {
  return (
    <div className="content-stretch flex gap-[4px] items-center relative shrink-0 w-[922px]">
      <Frame1000005558 />
    </div>
  );
}

function Frame1000005555() {
  return (
    <div className="content-stretch flex items-start justify-between relative shrink-0 w-[922px]">
      <Frame1000005519 />
    </div>
  );
}

function Frame1000005564() {
  return (
    <div className="content-stretch flex flex-col gap-[32px] items-start relative shrink-0">
      <div className="font-['Inter:Medium',_sans-serif] font-medium leading-[0] not-italic relative shrink-0 text-[#2d3134] text-[48px] text-nowrap tracking-[0.48px]">
        <p className="leading-[54px] whitespace-pre">Offers for you</p>
      </div>
      <Frame48095388 />
      <Frame1000005555 />
    </div>
  );
}

function Frame1000005566() {
  return (
    <div className="content-stretch flex flex-col gap-[32px] items-start relative shrink-0">
      <Frame1000005564 />
    </div>
  );
}

function Frame1000005554() {
  return (
    <div className="content-stretch flex flex-col gap-[64px] items-end relative shrink-0">
      <Frame1000005566 />
    </div>
  );
}

function Copy1SvgrepoCom() {
  return (
    <div className="absolute left-[11px] size-[16px] top-[12px]" data-name="copy-1_svgrepo.com">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 16 16">
        <g id="copy-1_svgrepo.com">
          <path d={svgPaths.pe79f480} id="Vector" stroke="var(--stroke-0, white)" strokeLinecap="round" strokeLinejoin="round" />
        </g>
      </svg>
    </div>
  );
}

function Frame1261155294() {
  return (
    <div className="absolute bg-[#2c2c2c] h-[40px] right-0 rounded-br-[5px] rounded-tr-[5px] top-[0.41px] w-[38px]">
      <Copy1SvgrepoCom />
    </div>
  );
}

function DivDFlex() {
  return (
    <div className="absolute bg-[#f4f4f4] h-[41px] left-[21px] right-[21px] top-[340.59px]" data-name="div.d-flex">
      <div aria-hidden="true" className="absolute border-[#e7e6e6] border-[0px_0px_1px] border-solid inset-0 pointer-events-none" />
      <div className="absolute font-['Poppins:SemiBold',_sans-serif] leading-[0] left-[68.5px] not-italic text-[#2d3134] text-[15px] text-center top-[8.41px] translate-x-[-50%] w-[95px]">
        <p className="leading-[normal]">AFJIJFJS500</p>
      </div>
      <Frame1261155294 />
    </div>
  );
}

function Image() {
  return <div className="absolute bg-[#c4c4c4] inset-[0.26%_0.33%_45.53%_0.33%]" data-name="image" />;
}

function Button1() {
  return (
    <div className="absolute bg-white bottom-[161.75px] right-[11px] rounded-[35px] shadow-[0px_10px_40px_0px_rgba(0,0,0,0.05)] size-[35px]" data-name="Button">
      <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[15px] justify-center leading-[0] not-italic text-[15px] text-black text-center top-[17.5px] translate-x-[-50%] translate-y-[-50%] w-[15.2px]" style={{ left: "calc(50% + 0.1px)" }}>
        <p className="leading-[15px]"></p>
      </div>
    </div>
  );
}

function Link() {
  return (
    <div className="bg-white h-[392.59px] relative rounded-[12px] shrink-0 w-[300px]" data-name="Link">
      <div className="h-[392.59px] overflow-clip relative w-[300px]">
        <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[16px] justify-center leading-[0] left-[101.92px] not-italic text-[#717171] text-[16px] top-[236.03px] translate-y-[-50%] w-[16.2px]">
          <p className="leading-[16px]"></p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Regular',_sans-serif] font-normal h-[24.38px] justify-center leading-[0] left-[21px] not-italic text-[#717171] text-[12.289px] top-[236.03px] translate-y-[-50%] w-[75.92px]">
          <p className="leading-[24.38px]">Aster Hotels</p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Medium',_sans-serif] font-medium h-[45px] justify-center leading-[0] left-[21px] not-italic text-[#05073c] text-[15.875px] top-[288.5px] translate-y-[-50%] w-[249.4px]">
          <p className="leading-[24px]">{`20% Off on dining and drinks on purchase upto $500 T&Cs* apply`}</p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[10px] justify-center leading-[0] left-[21px] not-italic text-[#e2ad64] text-[10px] top-[318.21px] translate-y-[-50%] w-[10.2px]">
          <p className="leading-[10px]"></p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[10px] justify-center leading-[0] left-[36px] not-italic text-[#e2ad64] text-[10px] top-[318.21px] translate-y-[-50%] w-[10.2px]">
          <p className="leading-[10px]"></p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[10px] justify-center leading-[0] left-[51px] not-italic text-[#e2ad64] text-[10px] top-[318.21px] translate-y-[-50%] w-[10.2px]">
          <p className="leading-[10px]"></p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[10px] justify-center leading-[0] left-[66px] not-italic text-[#e2ad64] text-[10px] top-[318.21px] translate-y-[-50%] w-[10.2px]">
          <p className="leading-[10px]"></p>
        </div>
        <div className="absolute flex flex-col font-['Inter:Regular',_'Noto_Sans:Regular',_sans-serif] font-normal h-[10px] justify-center leading-[0] left-[81px] not-italic text-[#e2ad64] text-[10px] top-[318.21px] translate-y-[-50%] w-[10.2px]">
          <p className="leading-[10px]"></p>
        </div>
        <DivDFlex />
        <Image />
        <Button1 />
      </div>
      <div aria-hidden="true" className="absolute border border-[#e7e6e6] border-solid inset-0 pointer-events-none rounded-[12px]" />
    </div>
  );
}

function Frame1261155237() {
  return (
    <div className="content-start flex flex-wrap gap-[24px] items-start relative shrink-0 w-[960px]">
      {[...Array(16).keys()].map((_, i) => (
        <Link key={i} />
      ))}
    </div>
  );
}

function Frame1000005559() {
  return (
    <div className="h-px relative shrink-0 w-[498.004px]">
      <div className="absolute bottom-0 left-0 right-0 top-[-200%]">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 498 3">
          <g id="Frame 1000005559">
            <line id="Line 3" stroke="var(--stroke-0, #DFDFDF)" strokeWidth="3" x2="498.004" y1="1.5" y2="1.5" />
            <line id="Line 4" stroke="var(--stroke-0, #282828)" x1="0.00390625" x2="286.006" y1="1.5" y2="1.5" />
          </g>
        </svg>
      </div>
    </div>
  );
}

function IconIoniconsFilledChevronDown() {
  return (
    <div className="relative size-full" data-name="icon / ionicons / filled / chevron-down">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 24 24">
        <g id="icon / ionicons / filled / chevron-down">
          <path clipRule="evenodd" d={svgPaths.p3195a1f8} fill="var(--fill-0, white)" fillRule="evenodd" id="Vector (Stroke)" />
        </g>
      </svg>
    </div>
  );
}

function AddA73Igur3Kxgy1() {
  return (
    <div className="overflow-clip relative shrink-0 size-[24px]" data-name="add_a73igur3kxgy 1">
      <div className="absolute bottom-0 flex items-center justify-center left-[-0.46%] right-[0.46%] top-0">
        <div className="flex-none rotate-[270deg] size-[24px]">
          <IconIoniconsFilledChevronDown />
        </div>
      </div>
    </div>
  );
}

function Frame15() {
  return (
    <div className="bg-[#282828] box-border content-stretch flex gap-[10px] items-center justify-center overflow-clip px-[24px] py-[16px] relative rounded-[64px] shrink-0">
      <div className="font-['Inter:Semi_Bold',_sans-serif] font-semibold leading-[0] not-italic relative shrink-0 text-[20px] text-center text-nowrap text-white">
        <p className="leading-[normal] whitespace-pre">Load More</p>
      </div>
      <AddA73Igur3Kxgy1 />
    </div>
  );
}

function Frame1000005560() {
  return (
    <div className="box-border content-stretch flex flex-col gap-[26px] items-center px-0 py-[64px] relative shrink-0 w-[960px]">
      <div className="font-['Inter:Regular',_sans-serif] font-normal leading-[0] not-italic relative shrink-0 text-[#414141] text-[16px] text-nowrap">
        <p className="leading-[1.705] whitespace-pre" dir="auto">
          Showing 1–12 of 24 item(s)
        </p>
      </div>
      <Frame1000005559 />
      <Frame15 />
    </div>
  );
}

function Frame1000005561() {
  return (
    <div className="content-stretch flex flex-col gap-[32px] items-start justify-center relative shrink-0">
      <div className="flex flex-col font-['Inter:Regular',_sans-serif] font-normal justify-center leading-[0] not-italic relative shrink-0 text-[#05073c] text-[14.297px] text-nowrap">
        <p className="leading-[28.13px] whitespace-pre">
          <span>{`My Profile>My passes>`}</span>
          <span className="font-['Inter:Bold',_sans-serif] font-bold not-italic">Offers</span>
        </p>
      </div>
      <Frame1000005554 />
      <Frame1261155237 />
      <Frame1000005560 />
    </div>
  );
}

function Frame1000005562() {
  return (
    <div className="box-border content-stretch flex gap-[32px] items-start pb-0 pt-[32px] px-[100px] relative shrink-0">
      <Frame1000005557 />
      <Frame1000005561 />
    </div>
  );
}

function SectionHeading() {
  return (
    <div className="content-stretch flex flex-col gap-[8px] items-start leading-[0] not-italic overflow-clip relative shrink-0 w-[592px]" data-name="Section heading">
      <div className="css-9el0wq font-['Inter:Semi_Bold',_sans-serif] font-semibold relative shrink-0 text-[#2d3134] text-[48px] tracking-[-1.2px] w-full">
        <p className="leading-[60px]">Access all your city cards on your phone.</p>
      </div>
      <div className="css-sdralp font-['Inter:Regular',_sans-serif] font-normal relative shrink-0 text-[18px] text-gray-900 w-full">
        <p className="leading-[28px]">Download the app to manage your projects, keep track of the progress and complete tasks without procastinating. Stay on track and complete on time!</p>
      </div>
    </div>
  );
}

function Bg() {
  return (
    <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 135 40">
      <g id="Bg">
        <path d={svgPaths.p11d0cb00} fill="var(--fill-0, black)" id="Vector" />
        <path d={svgPaths.p1ab2e500} fill="var(--fill-0, #A6A6A6)" id="Vector_2" />
      </g>
    </svg>
  );
}

function Text() {
  return (
    <div className="absolute inset-[17.16%_6.8%_14.81%_30.4%]" data-name="Text">
      <div className="absolute bottom-0 left-0 right-0 top-[-0.37%]">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 85 29">
          <g id="Text">
            <g id="Vector">
              <path d={svgPaths.p360ff200} fill="white" />
              <path d={svgPaths.p2e09de00} fill="white" />
              <path d={svgPaths.p2edcc080} fill="white" />
              <path d={svgPaths.p146a6200} fill="white" />
              <path d={svgPaths.p234bdb12} fill="white" />
              <path d={svgPaths.p190f4c00} fill="white" />
              <path d={svgPaths.p3f96e4c0} fill="white" />
              <path d={svgPaths.p360ff200} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
              <path d={svgPaths.p2e09de00} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
              <path d={svgPaths.p2edcc080} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
              <path d={svgPaths.p146a6200} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
              <path d={svgPaths.p234bdb12} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
              <path d={svgPaths.p190f4c00} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
              <path d={svgPaths.p3f96e4c0} stroke="var(--stroke-0, white)" strokeMiterlimit="10" strokeWidth="0.2" />
            </g>
            <path d={svgPaths.p949f00} fill="var(--fill-0, white)" id="Vector_2" />
          </g>
        </svg>
      </div>
    </div>
  );
}

function GooglePlayLogo() {
  return (
    <div className="absolute inset-[17.83%_75.51%_17.82%_7.38%]" data-name="Google Play logo">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 24 26">
        <g id="Google Play logo">
          <path d={svgPaths.p3aebff00} fill="url(#paint0_linear_9181_1577)" id="Vector" />
          <path d={svgPaths.p1ae2b0c0} fill="url(#paint1_linear_9181_1577)" id="Vector_2" />
          <path d={svgPaths.p2ddae880} fill="url(#paint2_linear_9181_1577)" id="Vector_3" />
          <path d={svgPaths.p1b13c280} fill="url(#paint3_linear_9181_1577)" id="Vector_4" />
          <path d={svgPaths.p1b75f800} fill="var(--fill-0, black)" id="Vector_5" opacity="0.2" />
          <path d={svgPaths.p26d43100} fill="var(--fill-0, black)" id="Vector_6" opacity="0.12" />
          <path d={svgPaths.p25f97b00} fill="var(--fill-0, black)" id="Vector_7" opacity="0.12" />
          <path d={svgPaths.p20fe0080} fill="var(--fill-0, white)" id="Vector_8" opacity="0.25" />
        </g>
        <defs>
          <linearGradient gradientUnits="userSpaceOnUse" id="paint0_linear_9181_1577" x1="11.8308" x2="-4.95164" y1="1.57842" y2="18.3608">
            <stop stopColor="#00A0FF" />
            <stop offset="0.00657" stopColor="#00A1FF" />
            <stop offset="0.2601" stopColor="#00BEFF" />
            <stop offset="0.5122" stopColor="#00D2FF" />
            <stop offset="0.7604" stopColor="#00DFFF" />
            <stop offset="1" stopColor="#00E3FF" />
          </linearGradient>
          <linearGradient gradientUnits="userSpaceOnUse" id="paint1_linear_9181_1577" x1="23.8654" x2="-0.33149" y1="12.8702" y2="12.8702">
            <stop stopColor="#FFE000" />
            <stop offset="0.4087" stopColor="#FFBD00" />
            <stop offset="0.7754" stopColor="#FFA500" />
            <stop offset="1" stopColor="#FF9C00" />
          </linearGradient>
          <linearGradient gradientUnits="userSpaceOnUse" id="paint2_linear_9181_1577" x1="14.858" x2="-7.9003" y1="15.1648" y2="37.9231">
            <stop stopColor="#FF3A44" />
            <stop offset="1" stopColor="#C31162" />
          </linearGradient>
          <linearGradient gradientUnits="userSpaceOnUse" id="paint3_linear_9181_1577" x1="-2.67164" x2="7.49088" y1="-6.95511" y2="3.20741">
            <stop stopColor="#32A071" />
            <stop offset="0.0685" stopColor="#2DA771" />
            <stop offset="0.4762" stopColor="#15CF74" />
            <stop offset="0.8009" stopColor="#06E775" />
            <stop offset="1" stopColor="#00F076" />
          </linearGradient>
        </defs>
      </svg>
    </div>
  );
}

function StoreBadge() {
  return (
    <div className="h-[40px] overflow-clip relative shrink-0 w-[135px]" data-name="Store badge">
      <Bg />
      <Text />
      <GooglePlayLogo />
    </div>
  );
}

function Bg1() {
  return (
    <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 135 40">
      <g id="Bg">
        <path clipRule="evenodd" d={svgPaths.pd6ee900} fill="var(--fill-0, #A6A6A6)" fillRule="evenodd" id="Vector" />
        <path d={svgPaths.p3394cd00} fill="var(--fill-0, black)" id="Vector_2" />
      </g>
    </svg>
  );
}

function Group1() {
  return (
    <div className="absolute inset-[21.8%_73.54%_23.76%_13.33%]" data-name="<Group>">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 18 22">
        <g id="<Group>">
          <path d={svgPaths.p1ba7a100} fill="var(--fill-0, white)" id="<Path>" />
          <path d={svgPaths.p26de8970} fill="var(--fill-0, white)" id="<Path>_2" />
        </g>
      </svg>
    </div>
  );
}

function Text1() {
  return (
    <div className="absolute inset-[21.09%_12.95%_16.27%_31.45%]" data-name="Text">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 76 26">
        <g id="Text">
          <g id="Vector">
            <path d={svgPaths.p330e6600} fill="white" />
            <path d={svgPaths.p140623c0} fill="white" />
            <path d={svgPaths.p35419200} fill="white" />
            <path d={svgPaths.p48005c0} fill="white" />
            <path d={svgPaths.p21d6a400} fill="white" />
            <path d={svgPaths.p3c536e80} fill="white" />
            <path d={svgPaths.p3709a00} fill="white" />
            <path d={svgPaths.p14978a80} fill="white" />
          </g>
          <g id="Vector_2">
            <path d={svgPaths.pa6cfb80} fill="white" />
            <path d={svgPaths.p1c846872} fill="white" />
            <path d={svgPaths.p235e2a00} fill="white" />
            <path d={svgPaths.p3c1952c0} fill="white" />
            <path d={svgPaths.p3b676a80} fill="white" />
            <path d={svgPaths.pd9336c0} fill="white" />
            <path d={svgPaths.p22016470} fill="white" />
            <path d={svgPaths.p7fb1900} fill="white" />
            <path d={svgPaths.p35e78e00} fill="white" />
            <path d={svgPaths.p28b0e180} fill="white" />
            <path d={svgPaths.p4ac700} fill="white" />
            <path d={svgPaths.p1fa9cb00} fill="white" />
            <path d={svgPaths.p1865d740} fill="white" />
          </g>
        </g>
      </svg>
    </div>
  );
}

function StoreBadge1() {
  return (
    <div className="h-[40px] overflow-clip relative shrink-0 w-[135px]" data-name="Store badge">
      <Bg1 />
      <Group1 />
      <Text1 />
    </div>
  );
}

function Badges() {
  return (
    <div className="content-stretch flex gap-[12px] items-start overflow-clip relative shrink-0" data-name="Badges">
      <StoreBadge />
      <StoreBadge1 />
    </div>
  );
}

function GetTheApp() {
  return (
    <div className="content-stretch flex flex-col gap-[8px] items-start overflow-clip relative shrink-0" data-name="Get the App">
      <div className="css-sdralp font-['Inter:Medium',_sans-serif] font-medium leading-[0] not-italic relative shrink-0 text-[18px] text-gray-900 text-nowrap">
        <p className="leading-[28px] whitespace-pre">Get the App</p>
      </div>
      <Badges />
    </div>
  );
}

function Content() {
  return (
    <div className="content-stretch flex flex-col gap-[48px] items-start overflow-clip relative shrink-0" data-name="Content">
      <SectionHeading />
      <GetTheApp />
    </div>
  );
}

function ImageSvgrepoCom1() {
  return (
    <div className="absolute left-1/2 size-[60px] top-1/2 translate-x-[-50%] translate-y-[-50%]" data-name="image_svgrepo.com">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 60 60">
        <g id="image_svgrepo.com">
          <path d={svgPaths.p1660e80} id="Vector" stroke="var(--stroke-0, white)" strokeLinejoin="round" strokeWidth="2.5" />
          <path d={svgPaths.p349a7f80} id="Vector_2" stroke="var(--stroke-0, white)" strokeLinejoin="round" strokeWidth="2.5" />
        </g>
      </svg>
    </div>
  );
}

function Img3() {
  return (
    <div className="bg-[#d9d9d9] h-[558px] relative shrink-0 w-[592px]" data-name="img">
      <ImageSvgrepoCom1 />
    </div>
  );
}

function Cta06() {
  return (
    <div className="bg-white relative shrink-0 w-full" data-name="CTA 06">
      <div className="flex flex-row items-center overflow-clip relative size-full">
        <div className="box-border content-stretch flex gap-[32px] items-center px-[112px] py-0 relative w-full">
          <Content />
          <Img3 />
        </div>
      </div>
    </div>
  );
}

function Star() {
  return (
    <div className="absolute inset-[68.85%_37.13%_28.61%_55.42%]" data-name="Star">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 108 17">
        <g id="Star">
          <path d={svgPaths.pe0e8600} fill="var(--fill-0, #BEBEBE)" id="Vector" />
          <path d={svgPaths.p1e77dec0} fill="var(--fill-0, #BEBEBE)" id="Vector_2" />
          <path d={svgPaths.p2db3f680} fill="var(--fill-0, #BEBEBE)" id="Vector_3" />
          <path d={svgPaths.p15bde300} fill="var(--fill-0, #BEBEBE)" id="Vector_4" />
          <path d={svgPaths.p34657a80} fill="var(--fill-0, #BEBEBE)" id="Vector_5" />
        </g>
      </svg>
    </div>
  );
}

function Group2() {
  return (
    <div className="absolute contents left-[798px] top-[462px]" data-name="Group">
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium leading-[0] left-[798px] not-italic text-[#2d3134] text-[20px] text-nowrap top-[496px]">
        <p className="leading-[20px] whitespace-pre">Andrew Sarma</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[0] left-[798px] not-italic text-[#5b5f62] text-[12px] text-nowrap top-[524px]">
        <p className="leading-[12px] whitespace-pre">Enterpreneur</p>
      </div>
      <Star />
    </div>
  );
}

function ArrowRight() {
  return (
    <div className="absolute left-[1235px] size-[40px] top-[496px]" data-name="Arrow right">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 40 40">
        <g id="Arrow right">
          <circle cx="20" cy="20" fill="var(--fill-0, #2D3134)" id="Ellipse 2616" r="20" />
          <path d={svgPaths.p153efec0} id="Vector 796" stroke="var(--stroke-0, white)" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" />
        </g>
      </svg>
    </div>
  );
}

function ArrowLeft() {
  return (
    <div className="relative size-[40px]" data-name="Arrow left">
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 40 40">
        <g id="Arrow left">
          <circle cx="20" cy="20" id="Ellipse 2616" r="19.5" stroke="var(--stroke-0, #2D3134)" />
          <path d={svgPaths.p153efec0} id="Vector 796" stroke="var(--stroke-0, #2D3134)" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" />
        </g>
      </svg>
    </div>
  );
}

function Card() {
  return (
    <div className="absolute contents left-[768px] top-[283px]" data-name="Card">
      <div className="absolute bg-white h-[283px] left-[768px] rounded-[14px] top-[283px] w-[537px]" data-name="BG" />
      <Group2 />
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[0] left-[798px] not-italic text-[#5b5f62] text-[18px] top-[315px] w-[473px]">
        <p className="leading-[30px]">Salty helped me a lot in finding the best place for our first outdoor adventure trip. They responded very quickly and gave me a detailed account of the place—its history, as well as its best features.</p>
      </div>
      <ArrowRight />
      <div className="absolute flex items-center justify-center left-[1179px] size-[40px] top-[496px]">
        <div className="flex-none rotate-[180deg] scale-y-[-100%]">
          <ArrowLeft />
        </div>
      </div>
    </div>
  );
}

function Text2() {
  return (
    <div className="absolute contents left-[768px] top-[105px]" data-name="Text">
      <div className="absolute capitalize font-['Inter:Semi_Bold',_sans-serif] font-semibold leading-[0] left-[768px] not-italic text-[#2d3134] text-[56px] top-[125px] w-[467px]">
        <p className="leading-[66px]">A customer said about us:</p>
      </div>
      <div className="absolute bg-[#c2c2c2] h-[8px] left-[768px] rounded-[4px] shadow-[0px_2px_6px_0px_rgba(229,137,24,0.15)] top-[105px] w-[67px]" />
      <Card />
    </div>
  );
}

function ImageSvgrepoCom2() {
  return (
    <div className="absolute size-[60px] translate-x-[-50%] translate-y-[-50%]" data-name="image_svgrepo.com" style={{ top: "calc(50% + 0.5px)", left: "calc(50% + 0.5px)" }}>
      <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 60 60">
        <g id="image_svgrepo.com">
          <path d={svgPaths.p1660e80} id="Vector" stroke="var(--stroke-0, white)" strokeLinejoin="round" strokeWidth="2.5" />
          <path d={svgPaths.p349a7f80} id="Vector_2" stroke="var(--stroke-0, white)" strokeLinejoin="round" strokeWidth="2.5" />
        </g>
      </svg>
    </div>
  );
}

function Img4() {
  return (
    <div className="absolute bg-[#d7d7d7] h-[485px] left-[135px] rounded-[20px] top-[95px] w-[517px]" data-name="img">
      <ImageSvgrepoCom2 />
    </div>
  );
}

function Testimonial() {
  return (
    <div className="h-[671px] overflow-clip relative shrink-0 w-[1440px]" data-name="Testimonial">
      <Text2 />
      <Img4 />
    </div>
  );
}

function Menu1() {
  return (
    <div className="absolute contents leading-[0] left-[551px] not-italic text-nowrap top-[84px]" data-name="Menu">
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[551px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Resources</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[551px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">{`Download `}</p>
        <p className="mb-0">Help Center</p>
        <p>&nbsp;</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[756px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">Why Travellers</p>
        <p className="mb-0">Customer Stories</p>
        <p>Instagram post</p>
      </div>
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[756px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Travellers</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[984px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">Terms and Conditions</p>
        <p className="mb-0">Privacy Policy</p>
        <p className="mb-0">FAQs</p>
        <p>Information</p>
      </div>
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[984px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Company</p>
      </div>
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[34px] left-[1186px] text-[#676a6c] text-[14px] top-[124px] whitespace-pre">
        <p className="mb-0">App Store</p>
        <p>Google Play Store</p>
      </div>
      <div className="absolute font-['Inter:Medium',_sans-serif] font-medium left-[1186px] text-[#2d3134] text-[18px] top-[84px]">
        <p className="leading-[18px] text-nowrap whitespace-pre">Get App</p>
      </div>
    </div>
  );
}

function ICon3() {
  return (
    <div className="absolute contents left-[135px] top-[226px]" data-name="ICon">
      <div className="absolute left-[135px] size-[32px] top-[226px]">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 32 32">
          <circle cx="16" cy="16" id="Ellipse 2612" r="15.5" stroke="var(--stroke-0, #5B5F62)" />
        </svg>
      </div>
      <div className="absolute inset-[69.62%_89.31%_26.84%_10.28%]" data-name="Vector">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 6 12">
          <path d={svgPaths.p35c3b610} fill="var(--fill-0, #5B5F62)" id="Vector" />
        </svg>
      </div>
    </div>
  );
}

function ICon4() {
  return (
    <div className="absolute contents left-[227px] top-[226px]" data-name="ICon">
      <div className="absolute left-[227px] size-[32px] top-[226px]">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 32 32">
          <circle cx="16" cy="16" id="Ellipse 2612" r="15.5" stroke="var(--stroke-0, #5B5F62)" />
        </svg>
      </div>
      <div className="absolute inset-[69.62%_82.57%_26.84%_16.39%]" data-name="Vector">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 15 12">
          <path d={svgPaths.p3d90cb00} fill="var(--fill-0, #5B5F62)" id="Vector" />
        </svg>
      </div>
    </div>
  );
}

function ICon5() {
  return (
    <div className="absolute contents left-[181px] top-[226px]" data-name="ICon">
      <div className="absolute left-[181px] size-[32px] top-[226px]">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 32 32">
          <circle cx="16" cy="16" id="Ellipse 2612" r="15.5" stroke="var(--stroke-0, #5B5F62)" />
        </svg>
      </div>
      <div className="absolute inset-[69.62%_85.9%_26.84%_13.26%]" data-name="Vector">
        <svg className="block size-full" fill="none" preserveAspectRatio="none" viewBox="0 0 12 12">
          <path clipRule="evenodd" d={svgPaths.p31d8c180} fill="var(--fill-0, #5B5F62)" fillRule="evenodd" id="Vector" />
        </svg>
      </div>
    </div>
  );
}

function SocailIcon1() {
  return (
    <div className="absolute contents left-[135px] top-[226px]" data-name="Socail Icon">
      <ICon3 />
      <ICon4 />
      <ICon5 />
    </div>
  );
}

function Img5() {
  return (
    <div className="absolute bg-[#434343] h-[35px] left-[135px] overflow-clip top-[79.01px] w-[98px]" data-name="img">
      <div className="absolute font-['Sen:Bold',_sans-serif] font-bold leading-[0] text-[15px] text-nowrap text-white" style={{ top: "calc(50% - 10.5px)", left: "calc(50% - 18px)" }}>
        <p className="leading-[20px] whitespace-pre">Logo</p>
      </div>
    </div>
  );
}

function Footer1() {
  return (
    <div className="h-[339px] overflow-clip relative shrink-0 w-full" data-name="Footer">
      <Menu1 />
      <SocailIcon1 />
      <div className="absolute font-['Inter:Regular',_sans-serif] font-normal leading-[0] left-[135px] not-italic text-[#5b5f62] text-[16px] top-[134px] w-[141px]">
        <p className="leading-[26px]">Enjoy the touring with Salty</p>
      </div>
      <Img5 />
    </div>
  );
}

function Frame1261155236() {
  return (
    <div className="absolute bg-[#f8f8f8] content-stretch flex flex-col gap-[170px] h-[5249px] items-start left-0 top-[102px] w-[1440px]">
      <Frame1000005562 />
      <Cta06 />
      <Testimonial />
      <Footer1 />
    </div>
  );
}

export default function TravelLandingPage() {
  return (
    <div className="bg-[#f8f8f8] relative size-full" data-name="Travel Landing Page">
      <Footer />
      <Card8 />
      <Navigation />
      <Frame1261155236 />
    </div>
  );
}