diff --git a/src/App.tsx b/src/App.tsx
index 147c288..4af0cf8 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -9,10 +9,6 @@ import { CustomFonts } from './CustomFonts';
 import { KartaPage } from "./KartaPage";
 import { Landing } from "./Landing";
 import { Article } from "./Article";
-import { HeaderSimple } from "./Header";
-import { FooterLinks } from "./Footer";
-import headerLinks from "./assets/header.json";
-import footerLinks from "./assets/footer.json";
 
 const router = createBrowserRouter([
   {
@@ -42,9 +38,7 @@ function App() {
     }}>
       <CustomFonts />
       <Box pos={"absolute"} w={"100%"} top={0}>
-        <HeaderSimple links={headerLinks.links} />
         <RouterProvider router={router} />
-        <FooterLinks data={footerLinks.data} />
       </Box>
     </MantineProvider>
   );
diff --git a/src/Article.tsx b/src/Article.tsx
index 0841ac5..9295fe9 100644
--- a/src/Article.tsx
+++ b/src/Article.tsx
@@ -1,11 +1,23 @@
-import { Title, Container, rem, createStyles, TypographyStylesProvider, Image } from '@mantine/core';
-import { Carousel } from '@mantine/carousel';
-import { useLoaderData } from 'react-router-dom';
-import Markdown from 'react-markdown';
+import {
+  Title,
+  Container,
+  rem,
+  createStyles,
+  TypographyStylesProvider,
+  Image,
+} from "@mantine/core";
+import { Carousel } from "@mantine/carousel";
+import { useLoaderData } from "react-router-dom";
+import Markdown from "react-markdown";
+
+import { HeaderSimple } from "./Header";
+import { FooterLinks } from "./Footer";
+import headerLinks from "./assets/header.json";
+import footerLinks from "./assets/footer.json";
 
 const useStyles = createStyles((theme) => ({
   content: {
-    padding: rem(30)
+    padding: rem(30),
   },
 
   title: {
@@ -13,41 +25,55 @@ const useStyles = createStyles((theme) => ({
     lineHeight: 1.2,
     fontWeight: 900,
     paddingBottom: rem(20),
-    [theme.fn.smallerThan('xs')]: {
+    [theme.fn.smallerThan("xs")]: {
       fontSize: rem(28),
     },
-  }
+  },
 }));
 
-
-
-
-
 export function Article() {
   const articleData = useLoaderData();
   const { classes } = useStyles();
-  const article = articleData.data[0].attributes
+  const article = articleData.data[0].attributes;
   // console.log(articleData)
 
   const generateCarousel = () => {
     if (articleData.data[0].attributes.carousel.data) {
       return (
         <Carousel slideSize="70%" mih={200} mah={500} slideGap="md" loop>
-          {articleData.data[0].attributes.carousel.data.map(image => <Carousel.Slide key={image.attributes.url}><Image fit='fill' mih={200} mah={500} mx="auto" radius="md" src={`https://strapi.litmusmap.ru${image.attributes.url}`} alt="Random image" /></Carousel.Slide>)}
+          {articleData.data[0].attributes.carousel.data.map((image) => (
+            <Carousel.Slide key={image.attributes.url}>
+              <Image
+                fit="fill"
+                mih={200}
+                mah={500}
+                mx="auto"
+                radius="md"
+                src={`https://strapi.litmusmap.ru${image.attributes.url}`}
+                alt="Random image"
+              />
+            </Carousel.Slide>
+          ))}
         </Carousel>
-      )
+      );
     }
-  }
+  };
 
   return (
-    <Container className={classes.content}>
-      <Title order={1} className={classes.title}>
-        {article.title}
-      </Title>
-      <TypographyStylesProvider sx={{ '@media (prefers-color-scheme: dark)': { color: "#C1C2C5" } }}>
-        <Markdown>{article.content}</Markdown>
-      </TypographyStylesProvider>
-      {generateCarousel()}
-    </Container>
+    <>
+      <HeaderSimple links={headerLinks.links} />
+      <Container className={classes.content}>
+        <Title order={1} className={classes.title}>
+          {article.title}
+        </Title>
+        <TypographyStylesProvider
+          sx={{ "@media (prefers-color-scheme: dark)": { color: "#C1C2C5" } }}
+        >
+          <Markdown>{article.content}</Markdown>
+        </TypographyStylesProvider>
+        {generateCarousel()}
+      </Container>
+      <FooterLinks data={footerLinks.data} />
+    </>
   );
 }
diff --git a/src/Header.tsx b/src/Header.tsx
index 95657c7..313f0fe 100644
--- a/src/Header.tsx
+++ b/src/Header.tsx
@@ -8,7 +8,7 @@ import {
   rem,
   Image,
   Menu,
-  Dialog,
+  Paper,
   Stack,
 } from "@mantine/core";
 import { IconExternalLink } from "@tabler/icons-react";
@@ -35,7 +35,7 @@ const useStyles = createStyles((theme) => ({
     },
   },
 
-  warning: {
+  mobilemenu: {
     [theme.fn.largerThan("md")]: {
       display: "none",
     },
@@ -79,8 +79,8 @@ interface HeaderSimpleProps {
   links: { link: string; label: string }[];
 }
 
-export function HeaderSimple({ links }: HeaderSimpleProps) {
-  const [openedMenu, menuactions] = useDisclosure(false);
+export function HeaderSimple({ links, openedMenuKarta, menuactionskarta }: HeaderSimpleProps) {
+  const [openedMenu, menuactions] = menuactionskarta ? [openedMenuKarta, menuactionskarta] : useDisclosure(false);
   const [active, setActive] = useState("");
   const { classes, cx } = useStyles();
 
@@ -106,81 +106,9 @@ export function HeaderSimple({ links }: HeaderSimpleProps) {
   return (
     <Header height={60}>
       <Container className={classes.header}>
-        {/* <Title order={3}><Anchor href='/' inherit={true} color='black' underline={false}>Литературные музеи России</Anchor></Title> */}
-        {/* <MantineLogo size={28} /> */}
 
         <Image maw={150} src={logo} component="a" href="/" />
 
-        {/* Menu for mobile */}
-        <Dialog
-          opened={openedMenu}
-          withCloseButton={false}
-          onClose={menuactions.close}
-          size="xs"
-          radius="md"
-          position={{ top: 70, right: 20 }}
-          className={classes.warning}
-        >
-          <Stack spacing={5} className={classes.linksmobile}>
-            <Menu shadow="md" width={200}>
-              <Menu.Target>
-                <a
-                  key="Авторы"
-                  href="#authors"
-                  className={cx(classes.link, {
-                    [classes.linkActive]: active === "#authors",
-                  })}
-                  onClick={(e) => {
-                    e.preventDefault();
-                    // setActive("#authors");
-                  }}
-                >
-                  Авторы
-                </a>
-              </Menu.Target>
-
-              <Menu.Dropdown>
-                <Menu.Item
-                  rightSection={
-                    <IconExternalLink
-                      style={{ width: rem(14), height: rem(14) }}
-                    />
-                  }
-                  component="a"
-                  href="https://bigenc.ru/c/ostrovskii-aleksandr-nikolaevich-c697e2"
-                  target="_blank"
-                >
-                  Островский
-                </Menu.Item>
-                <Menu.Item
-                  rightSection={
-                    <IconExternalLink
-                      style={{ width: rem(14), height: rem(14) }}
-                    />
-                  }
-                  component="a"
-                  href="https://bigenc.ru/c/prishvin-mikhail-mikhailovich-893107"
-                  target="_blank"
-                >
-                  Пришвин
-                </Menu.Item>
-                <Menu.Item
-                  rightSection={
-                    <IconExternalLink
-                      style={{ width: rem(14), height: rem(14) }}
-                    />
-                  }
-                  component="a"
-                  href="https://bigenc.ru/c/briusov-valerii-iakovlevich-fc6a35"
-                  target="_blank"
-                >
-                  Брюсов
-                </Menu.Item>
-              </Menu.Dropdown>
-            </Menu>
-            {items}
-          </Stack>
-        </Dialog>
 
         {/* Menu for pc */}
         <Group spacing={5} className={classes.links}>
@@ -250,6 +178,81 @@ export function HeaderSimple({ links }: HeaderSimpleProps) {
           size="sm"
         />
       </Container>
+      {/* Menu for mobile */}
+        <Paper
+          display={!openedMenu && 'none'}
+          radius={0}
+          style={{
+            position: "absolute",
+            top: 60,
+            left: 0,
+            right: 0,
+            opacity: "95%",
+            padding: "10px 0 10px 1rem",
+            zIndex: 10
+          }}
+          className={classes.mobilemenu}
+        >
+          <Group spacing={5} className={classes.linksmobile}>
+            <Menu shadow="md" width={200}>
+              <Menu.Target>
+                <a
+                  key="Авторы"
+                  href="#authors"
+                  className={cx(classes.link, {
+                    [classes.linkActive]: active === "#authors",
+                  })}
+                  onClick={(e) => {
+                    e.preventDefault();
+                    // setActive("#authors");
+                  }}
+                >
+                  Авторы
+                </a>
+              </Menu.Target>
+
+              <Menu.Dropdown>
+                <Menu.Item
+                  rightSection={
+                    <IconExternalLink
+                      style={{ width: rem(14), height: rem(14) }}
+                    />
+                  }
+                  component="a"
+                  href="https://bigenc.ru/c/ostrovskii-aleksandr-nikolaevich-c697e2"
+                  target="_blank"
+                >
+                  Островский
+                </Menu.Item>
+                <Menu.Item
+                  rightSection={
+                    <IconExternalLink
+                      style={{ width: rem(14), height: rem(14) }}
+                    />
+                  }
+                  component="a"
+                  href="https://bigenc.ru/c/prishvin-mikhail-mikhailovich-893107"
+                  target="_blank"
+                >
+                  Пришвин
+                </Menu.Item>
+                <Menu.Item
+                  rightSection={
+                    <IconExternalLink
+                      style={{ width: rem(14), height: rem(14) }}
+                    />
+                  }
+                  component="a"
+                  href="https://bigenc.ru/c/briusov-valerii-iakovlevich-fc6a35"
+                  target="_blank"
+                >
+                  Брюсов
+                </Menu.Item>
+              </Menu.Dropdown>
+            </Menu>
+            {items}
+          </Group>
+        </Paper>
     </Header>
   );
 }
diff --git a/src/KartaPage.tsx b/src/KartaPage.tsx
index ad517f2..405f56c 100644
--- a/src/KartaPage.tsx
+++ b/src/KartaPage.tsx
@@ -1,4 +1,9 @@
 import { Paper, Flex, ScrollArea, Autocomplete, Title } from "@mantine/core";
+import { useDisclosure } from "@mantine/hooks";
+import { HeaderSimple } from "./Header";
+import { FooterLinks } from "./Footer";
+import headerLinks from "./assets/header.json";
+import footerLinks from "./assets/footer.json";
 import { ArticleCardVertical } from "./ArticleCard";
 import { ArticleCardMobile } from "./ArticleCardMobile";
 import Map, {
@@ -18,7 +23,6 @@ import plus from "./assets/plus.png";
 import minus from "./assets/minus.png";
 import pin from "./assets/pin.png";
 
-
 export function KartaPage() {
   const mapRef = useRef(null);
   const [initial, setInitial] = useState(null);
@@ -27,6 +31,8 @@ export function KartaPage() {
   const [selected, setSelected] = useState(-1);
   const [cursor, setCursor] = useState("grab");
   const [popupInfo, setPopupInfo] = useState(null);
+  const [openedMenu, menuactions] = useDisclosure(false);
+
 
   const host = "https://strapi.litmusmap.ru";
 
@@ -37,11 +43,12 @@ export function KartaPage() {
     pinImage.onload = () => mapRef.current.addImage("pin-marker", pinImage);
 
     const icons = initial ? ["prishvin", "ostrovskiy", "brusov"] : [];
-    icons.map(i => {
+    icons.map((i) => {
       const iconImage = new Image();
-      iconImage.src = `./markers/${i}.png`
-      iconImage.onload = () => mapRef.current.addImage(`${i}-marker`, iconImage);
-    })
+      iconImage.src = `./markers/${i}.png`;
+      iconImage.onload = () =>
+        mapRef.current.addImage(`${i}-marker`, iconImage);
+    });
   };
 
   // Load articles
@@ -49,7 +56,7 @@ export function KartaPage() {
     fetch(`${host}/api/articles?populate=*`)
       .then((r) => r.json())
       .then((d) => {
-        console.log(d.data)
+        console.log(d.data);
         setInitial(d.data);
         setArticles(d.data);
       });
@@ -138,279 +145,292 @@ export function KartaPage() {
   };
 
   return (
-    <div style={{ position: "relative" }}>
-      <Map
-        ref={mapRef}
-        initialViewState={{
-          longitude: 35,
-          latitude: 60,
-          zoom: 4,
-        }}
-        minZoom={3.5}
-        maxZoom={16}
-        maxBounds={[
-          [-20, 35],
-          [200, 80],
-        ]}
-        style={{
-          height: "90vh",
-        }}
-        cursor={cursor}
-        mapStyle={mapstyle}
-        interactiveLayerIds={["points-layer"]}
-        onClick={(e) => {
-          // console.log(e.features);
-          if (e.features[0]) {
-            setSelected(e.features[0].properties.id);
-            if (mapRef.current.getZoom() < 14) {
-              mapRef.current.flyTo({
-                center: e.features[0].geometry.coordinates,
-                zoom: mapRef.current.getZoom() + 6,
-              });
+    <>
+      <HeaderSimple links={headerLinks.links} openedMenuKarta={openedMenu} menuactionskarta={menuactions}/>
+      <div style={{ position: "relative" }}>
+        <Map
+          ref={mapRef}
+          initialViewState={{
+            longitude: 35,
+            latitude: 60,
+            zoom: 4,
+          }}
+          minZoom={3.5}
+          maxZoom={16}
+          maxBounds={[
+            [-20, 35],
+            [200, 80],
+          ]}
+          style={{
+            height: "90vh",
+          }}
+          cursor={cursor}
+          mapStyle={mapstyle}
+          interactiveLayerIds={["points-layer"]}
+          onClick={(e) => {
+            // console.log(e.features);
+            if (e.features[0]) {
+              setSelected(e.features[0].properties.id);
+              if (mapRef.current.getZoom() < 14) {
+                mapRef.current.flyTo({
+                  center: e.features[0].geometry.coordinates,
+                  zoom: mapRef.current.getZoom() + 6,
+                });
+              } else {
+                setPopupInfo({
+                  longitude: e.features[0].geometry.coordinates[0],
+                  latitude: e.features[0].geometry.coordinates[1],
+                  id: e.features[0].properties.id,
+                });
+              }
             } else {
-              setPopupInfo({
-                longitude: e.features[0].geometry.coordinates[0],
-                latitude: e.features[0].geometry.coordinates[1],
-                id: e.features[0].properties.id,
-              });
+              setSelected(-1);
             }
-          } else {
-            setSelected(-1);
-          }
-        }}
-        onMouseEnter={() => setCursor("pointer")}
-        onMouseLeave={() => setCursor("grab")}
-        onLoad={handleMapLoad}
-      >
-        <Source
-          id="points"
-          type="vector"
-          tiles={[`${host}/tiles/{z}/{x}/{y}.pbf`]}
-          maxzoom={10}
+          }}
+          onMouseEnter={() => setCursor("pointer")}
+          onMouseLeave={() => setCursor("grab")}
+          onLoad={handleMapLoad}
         >
-          {popupInfo && (
-            <Popup
-              key={popupInfo.id}
-              longitude={popupInfo.longitude}
-              latitude={popupInfo.latitude}
-              anchor="top"
-              closeButton={false}
-              onClose={() => setPopupInfo(null)}
-            >
-              <a href={`/article/${popupInfo.id}`}>подробнее</a>
-            </Popup>
-          )}
-          <Layer
-            id="points-layer"
-            type="circle"
-            source-layer="layer"
-            filter={
-              articles === null || articles.length == 0
-                ? false
-                : ["in", "id", ...articles.map((a) => a.id)]
-            }
-            paint={{
-              "circle-color": [
-                "match",
-                ["get", "id"],
-                selected,
-                "#e66a5a",
-                "#F2994A",
-              ],
-              "circle-radius": ["step", ["zoom"], 8, 7, 20, 12, 40, 14, 60],
-              "circle-opacity": ["step", ["zoom"], 0.8, 7, 0],
-            }}
-          />
-          <Layer
-            id="icons-layer"
-            type="symbol"
-            source-layer="layer"
-            filter={
-              articles === null || articles.length == 0
-                ? false
-                : ["in", "id", ...articles.map((a) => a.id)]
-            }
-            layout={{
-              "icon-image": "pin-marker",
-              "icon-size": ["interpolate", ["linear"], ["zoom"], 7, 0.5, 12, 1],
-            }}
-            minzoom={7}
-            maxzoom={12}
-          />
-          <Layer
-            id="portret-layer"
-            type="symbol"
-            source-layer="layer"
-            filter={
-              articles === null || articles.length == 0
-                ? false
-                : ["in", "id", ...articles.map((a) => a.id)]
-            }
-            layout={{
-              "icon-image": [
-                "match",
-                ["get", "id"],
-                6,
-                "ostrovskiy-marker",
-                7,
-                "brusov-marker",
-                1,
-                "prishvin-marker",
-                "pin-marker",
-              ],
-              "icon-size": [
-                "interpolate",
-                ["linear"],
-                ["zoom"],
-                12,
-                0.05,
-                14,
-                0.1,
-              ],
+          <Source
+            id="points"
+            type="vector"
+            tiles={[`${host}/tiles/{z}/{x}/{y}.pbf`]}
+            maxzoom={10}
+          >
+            {popupInfo && (
+              <Popup
+                key={popupInfo.id}
+                longitude={popupInfo.longitude}
+                latitude={popupInfo.latitude}
+                anchor="top"
+                closeButton={false}
+                onClose={() => setPopupInfo(null)}
+              >
+                <a href={`/article/${popupInfo.id}`}>подробнее</a>
+              </Popup>
+            )}
+            <Layer
+              id="points-layer"
+              type="circle"
+              source-layer="layer"
+              filter={
+                articles === null || articles.length == 0
+                  ? false
+                  : ["in", "id", ...articles.map((a) => a.id)]
+              }
+              paint={{
+                "circle-color": [
+                  "match",
+                  ["get", "id"],
+                  selected,
+                  "#e66a5a",
+                  "#F2994A",
+                ],
+                "circle-radius": ["step", ["zoom"], 8, 7, 20, 12, 40, 14, 60],
+                "circle-opacity": ["step", ["zoom"], 0.8, 7, 0],
+              }}
+            />
+            <Layer
+              id="icons-layer"
+              type="symbol"
+              source-layer="layer"
+              filter={
+                articles === null || articles.length == 0
+                  ? false
+                  : ["in", "id", ...articles.map((a) => a.id)]
+              }
+              layout={{
+                "icon-image": "pin-marker",
+                "icon-size": [
+                  "interpolate",
+                  ["linear"],
+                  ["zoom"],
+                  7,
+                  0.5,
+                  12,
+                  1,
+                ],
+              }}
+              minzoom={7}
+              maxzoom={12}
+            />
+            <Layer
+              id="portret-layer"
+              type="symbol"
+              source-layer="layer"
+              filter={
+                articles === null || articles.length == 0
+                  ? false
+                  : ["in", "id", ...articles.map((a) => a.id)]
+              }
+              layout={{
+                "icon-image": [
+                  "match",
+                  ["get", "id"],
+                  6,
+                  "ostrovskiy-marker",
+                  7,
+                  "brusov-marker",
+                  1,
+                  "prishvin-marker",
+                  "pin-marker",
+                ],
+                "icon-size": [
+                  "interpolate",
+                  ["linear"],
+                  ["zoom"],
+                  12,
+                  0.05,
+                  14,
+                  0.1,
+                ],
+              }}
+              minzoom={12}
+            />
+          </Source>
+          <ScaleControl position="bottom-right" />
+          <ZoomControl bottom="35px" right="4px" />
+          <GeolocateControl
+            showAccuracyCircle={false}
+            position="bottom-right"
+            style={{
+              marginBottom: "55px",
+              marginRight: "14px",
+              background: "none",
+              boxShadow: "none",
             }}
-            minzoom={12}
           />
-        </Source>
-        <ScaleControl position="bottom-right" />
-        <ZoomControl bottom="35px" right="4px" />
-        <GeolocateControl
-          showAccuracyCircle={false}
-          position="bottom-right"
+        </Map>
+
+        {/* Search mobile */}
+        <Paper
+          shadow={"md"}
+          radius={0}
+          display={!openedMenu && 'none'}
           style={{
-            marginBottom: "55px",
-            marginRight: "14px",
-            background: "none",
-            boxShadow: "none",
+            position: "absolute",
+            top: 0,
+            left: 0,
+            right: 0,
+            height: "340px",
+            opacity: "95%",
+            padding: "55px 0 1rem 1rem"
           }}
-        />
-      </Map>
-
-      {/* Search mobile */}
-      <Paper
-        shadow={"md"}
-        radius={0}
-        style={{
-          position: "absolute",
-          top: 0,
-          left: 0,
-          right: 0,
-          height: "300px",
-          opacity: "95%",
-          padding: "1rem 0 1rem 1rem",
-        }}
-        sx={{
-          "@media (min-width: 60em)": {
-            display: "none",
-          },
-        }}
-      >
-        <Autocomplete
-          mr={20}
-          mb={10}
-          placeholder="Поиск"
-          limit={2}
-          value={search}
-          onChange={setSearch}
-          data={[]}
-        />
-        <ScrollArea h={"225px"} type="auto">
-          <Flex
-            // mih={50}
-            gap="xs"
-            justify="flex-start"
-            align="start"
-            direction="column"
-            wrap="wrap"
+          sx={{
+            "@media (min-width: 60em)": {
+              display: "none",
+            },
+          }}
+        >
+          <Autocomplete
             mr={20}
-          >
-            {articles !== null &&
-              articles.length > 0 &&
-              articles.map((article) => (
-                <ArticleCardMobile
-                  key={article.id}
-                  id={article.id}
-                  image={
-                    article.attributes.cover.data !== null
-                      ? host + article.attributes.cover.data.attributes.url
-                      : ""
-                  }
-                  category="музеи"
-                  title={article.attributes.title}
-                  address={article.attributes.address}
-                  longitude={article.attributes.longitude}
-                  latitude={article.attributes.latitude}
-                  selected={selected}
-                  clickAddressAction={handleAddressClick}
-                />
-              ))}
-          </Flex>
-        </ScrollArea>
-      </Paper>
+            mb={10}
+            placeholder="Поиск"
+            limit={2}
+            value={search}
+            onChange={setSearch}
+            data={[]}
+          />
+          <ScrollArea h={"225px"} type="auto">
+            <Flex
+              // mih={50}
+              gap="xs"
+              justify="flex-start"
+              align="start"
+              direction="column"
+              wrap="wrap"
+              mr={20}
+            >
+              {articles !== null &&
+                articles.length > 0 &&
+                articles.map((article) => (
+                  <ArticleCardMobile
+                    key={article.id}
+                    id={article.id}
+                    image={
+                      article.attributes.cover.data !== null
+                        ? host + article.attributes.cover.data.attributes.url
+                        : ""
+                    }
+                    category="музеи"
+                    title={article.attributes.title}
+                    address={article.attributes.address}
+                    longitude={article.attributes.longitude}
+                    latitude={article.attributes.latitude}
+                    selected={selected}
+                    clickAddressAction={handleAddressClick}
+                  />
+                ))}
+            </Flex>
+          </ScrollArea>
+        </Paper>
 
-      {/* Search pc */}
-      <Paper
-        shadow={"md"}
-        withBorder
-        style={{
-          position: "absolute",
-          top: "1rem",
-          left: "1rem",
-          width: "36rem",
-          height: "83vh",
-          opacity: "95%",
-          padding: "1rem 0 1rem 1rem",
-        }}
-        sx={{
-          "@media (max-width: 60em)": {
-            display: "none",
-          },
-        }}
-      >
-        <Title order={3} mb={10}>
-          Музеи
-        </Title>
-        <Autocomplete
-          mr={20}
-          mb={30}
-          placeholder="Поиск"
-          limit={2}
-          value={search}
-          onChange={setSearch}
-          data={[]}
-        />
-        <ScrollArea h={"67vh"} type="auto">
-          <Flex
-            mih={50}
-            gap="md"
-            justify="flex-start"
-            align="start"
-            direction="column"
-            wrap="wrap"
+        {/* Search pc */}
+        <Paper
+          shadow={"md"}
+          withBorder
+          style={{
+            position: "absolute",
+            top: "1rem",
+            left: "1rem",
+            width: "36rem",
+            height: "83vh",
+            opacity: "95%",
+            padding: "1rem 0 1rem 1rem",
+          }}
+          sx={{
+            "@media (max-width: 60em)": {
+              display: "none",
+            },
+          }}
+        >
+          <Title order={3} mb={10}>
+            Музеи
+          </Title>
+          <Autocomplete
             mr={20}
-          >
-            {articles !== null &&
-              articles.length > 0 &&
-              articles.map((article) => (
-                <ArticleCardVertical
-                  key={article.id}
-                  id={article.id}
-                  image={
-                    article.attributes.cover.data !== null
-                      ? host + article.attributes.cover.data.attributes.url
-                      : ""
-                  }
-                  category="музеи"
-                  title={article.attributes.title}
-                  address={article.attributes.address}
-                  longitude={article.attributes.longitude}
-                  latitude={article.attributes.latitude}
-                  selected={selected}
-                  clickAddressAction={handleAddressClick}
-                />
-              ))}
-          </Flex>
-        </ScrollArea>
-      </Paper>
-    </div>
+            mb={30}
+            placeholder="Поиск"
+            limit={2}
+            value={search}
+            onChange={setSearch}
+            data={[]}
+          />
+          <ScrollArea h={"67vh"} type="auto">
+            <Flex
+              mih={50}
+              gap="md"
+              justify="flex-start"
+              align="start"
+              direction="column"
+              wrap="wrap"
+              mr={20}
+            >
+              {articles !== null &&
+                articles.length > 0 &&
+                articles.map((article) => (
+                  <ArticleCardVertical
+                    key={article.id}
+                    id={article.id}
+                    image={
+                      article.attributes.cover.data !== null
+                        ? host + article.attributes.cover.data.attributes.url
+                        : ""
+                    }
+                    category="музеи"
+                    title={article.attributes.title}
+                    address={article.attributes.address}
+                    longitude={article.attributes.longitude}
+                    latitude={article.attributes.latitude}
+                    selected={selected}
+                    clickAddressAction={handleAddressClick}
+                  />
+                ))}
+            </Flex>
+          </ScrollArea>
+        </Paper>
+      </div>
+      <FooterLinks data={footerLinks.data} />
+    </>
   );
 }
diff --git a/src/Landing.tsx b/src/Landing.tsx
index 6290bfb..e17c7c2 100644
--- a/src/Landing.tsx
+++ b/src/Landing.tsx
@@ -6,6 +6,11 @@ import {
   TypographyStylesProvider,
 } from "@mantine/core";
 
+import { HeaderSimple } from "./Header";
+import { FooterLinks } from "./Footer";
+import headerLinks from "./assets/header.json";
+import footerLinks from "./assets/footer.json";
+
 const useStyles = createStyles((theme) => ({
   content: {
     padding: rem(30),
@@ -31,6 +36,8 @@ export function Landing() {
   const { classes } = useStyles();
 
   return (
+    <>
+    <HeaderSimple links={headerLinks.links} />
     <Container className={classes.content}>
       <Title order={1} className={classes.title}>
         О проекте
@@ -98,5 +105,8 @@ export function Landing() {
         </p>
       </TypographyStylesProvider>
     </Container>
+    <FooterLinks data={footerLinks.data} />
+    </>
+    
   );
 }