diff --git a/public/about1.jpeg b/public/about1.jpeg
deleted file mode 100644
index d1a83b7..0000000
Binary files a/public/about1.jpeg and /dev/null differ
diff --git a/public/about2.jpeg b/public/about2.jpeg
deleted file mode 100644
index e8c6624..0000000
Binary files a/public/about2.jpeg and /dev/null differ
diff --git a/public/about3.webp b/public/about3.webp
deleted file mode 100644
index 9dcbd5c..0000000
Binary files a/public/about3.webp and /dev/null differ
diff --git a/public/about_banner.png b/public/about_banner.png
new file mode 100644
index 0000000..2927e0c
Binary files /dev/null and b/public/about_banner.png differ
diff --git a/public/about_banner_background.png b/public/about_banner_background.png
new file mode 100644
index 0000000..5d16c8c
Binary files /dev/null and b/public/about_banner_background.png differ
diff --git a/public/about_map.png b/public/about_map.png
new file mode 100644
index 0000000..500ebad
Binary files /dev/null and b/public/about_map.png differ
diff --git a/public/arrow.png b/public/arrow.png
new file mode 100644
index 0000000..e9f858b
Binary files /dev/null and b/public/arrow.png differ
diff --git a/public/binoculars.png b/public/binoculars.png
new file mode 100644
index 0000000..3e78f11
Binary files /dev/null and b/public/binoculars.png differ
diff --git a/public/letter.png b/public/letter.png
new file mode 100644
index 0000000..43ed146
Binary files /dev/null and b/public/letter.png differ
diff --git a/src/App.tsx b/src/App.tsx
index 3d6f424..1abeb9f 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -23,7 +23,7 @@ function App() {
     ? subscriptionsCount > 0
       ? slugs.myEvents
       : slugs.newSubscription
-    : slugs.events;
+    : slugs.about;
 
   return (
     <DefaultLayout
diff --git a/src/components/Icons.tsx b/src/components/Icons.tsx
index 459ec81..761d07e 100644
--- a/src/components/Icons.tsx
+++ b/src/components/Icons.tsx
@@ -1,7 +1,7 @@
 import { CgClose } from 'react-icons/cg';
 import { FaAnchor, FaCheck, FaRegTrashAlt } from 'react-icons/fa';
 import { FaChevronRight } from 'react-icons/fa6';
-import { FiArrowLeft, FiClock, FiDownload, FiMail, FiMenu } from 'react-icons/fi';
+import { FiArrowLeft, FiClock, FiDownload, FiMail, FiMenu, FiArrowUpRight } from 'react-icons/fi';
 import { HiOutlineUsers } from 'react-icons/hi';
 import { IoMdCalendar } from 'react-icons/io';
 import { IoLocationOutline, IoPersonOutline, IoSearch, IoFilter } from 'react-icons/io5';
@@ -318,6 +318,8 @@ const Icon = ({ name, className, ...rest }: IconProps) => {
       return <MdOutlineVisibility className={className} />;
     case IconName.visibleOff:
       return <MdOutlineVisibilityOff className={className} />;
+    case IconName.arrowUpRight:
+      return <FiArrowUpRight className={className} />;
     case IconName.eGate:
       return (
         <svg
diff --git a/src/pages/About.tsx b/src/pages/About.tsx
index dd05440..ec02721 100644
--- a/src/pages/About.tsx
+++ b/src/pages/About.tsx
@@ -1,123 +1,393 @@
-import { ContentLayout } from '@aplinkosministerija/design-system';
+import { Button } from '@aplinkosministerija/design-system';
 import { useContext } from 'react';
 import { useNavigate } from 'react-router-dom';
 import styled from 'styled-components';
 import { UserContext, UserContextType } from '../components/UserProvider';
 import { device } from '../styles';
-import { buttonsTitles, slugs, subtitle, titles, useGetCurrentRoute } from '../utils';
-const imageUrls = ['/about1.jpeg', '/about2.jpeg', '/about3.webp'];
+import { buttonsTitles, slugs, subtitle, IconName } from '../utils';
+import Icon from '../components/Icons';
+
+const bannerUrl = '/about_banner.png';
+const mapUrl = '/about_map.png';
 
 const About = () => {
-  const currentRoute = useGetCurrentRoute();
   const navigate = useNavigate();
   const { loggedIn } = useContext<UserContextType>(UserContext);
 
+  const openLinkInNewTab = (url) => {
+    window.open(url, '_blank', 'noreferrer');
+  };
+
+  const sendEmail = () => {
+    window.open('mailto:esu@smalsuolis.lt');
+  };
+
   return (
-    <ContentLayout customTitle={<Title>{titles.about}</Title>} currentRoute={currentRoute}>
-      <SubTitle>{subtitle.about}</SubTitle>
-      <DescriptionContainer>
-        <Description>
-          {
-            'Mūsų valstybėje vyksta daug įvykių, tačiau apie juos nežinome arba sužinome per vėlai. Nusprendėme tą pakeisti - suteikti galimybę visiems piliečiams sekti kas vyksta šalyje realiu laiku.'
-          }
-        </Description>
-        <Description>
-          {
-            'Užsiregistruok, pažymėk tave dominančias įvykių kategorijas ir gauk elektroniniu paštu naujausią informaciją apie tai, kas įvyko. Šiuo metu galima sekti statybos leidimų išdavimą bei įžuvinimą, neužilgo pridėsime ir miško kirtimo leidimus, taip pat planuojame turėti želdynų ir želdinių šalinimo leidimus, poveikio aplinkai vertinimą, žemės paskirties keitimą ir daugelį kitų.'
-          }
-        </Description>
-        <Description>
-          <Description>{'Darome tą, nes esame smalsūs. Kaip ir tu.'}</Description>
+    <MainContainer>
+      <BannerImageContainer>
+        <Image src={bannerUrl} />
+      </BannerImageContainer>
+      <ContentContainer>
+        <DescriptionContainer>
+          <SubTitle>{subtitle.about}</SubTitle>
           <Description>
-            {'Smalsuolis.lt komanda - '}
-            <Link href="https://startupgov.lt">https://startupgov.lt</Link>
+            {
+              'Mūsų valstybėje vyksta daug įvykių, tačiau apie juos nežinome arba sužinome per vėlai. Nusprendėme tą pakeisti - suteikti galimybę visiems piliečiams sekti kas vyksta šalyje realiu laiku.'
+            }
           </Description>
-        </Description>
-        <Description>
-          {'Jei turi komentarų ar pastabų - '}
-          <Link href="mailto:esu@smalsuolis.lt">esu@smalsuolis.lt</Link>
-        </Description>
-      </DescriptionContainer>
-
-      <ImagesContainer>
-        {imageUrls.map((url, index) => (
-          <Image key={`image-${index}`} src={url} />
-        ))}
-        <NavigateContainer
-          onClick={() => navigate(loggedIn ? slugs.newSubscription : slugs.registration)}
-        >
-          {buttonsTitles.subscribeNews}{' '}
-        </NavigateContainer>
-      </ImagesContainer>
-    </ContentLayout>
+          <Description>
+            {
+              'Šiuo metu galima sekti statybos leidimų išdavimą bei įžuvinimą, neužilgo pridėsime ir miško kirtimo leidimus, taip pat planuojame turėti želdynų ir želdinių šalinimo leidimus, poveikio aplinkai vertinimą, žemės paskirties keitimą ir daugelį kitų.'
+            }
+          </Description>
+          <ButtonContainer>
+            <Button onClick={() => navigate(slugs.events)}>{buttonsTitles.map}</Button>
+          </ButtonContainer>
+        </DescriptionContainer>
+        <ImageContainer>
+          <Image src={mapUrl} />
+        </ImageContainer>
+      </ContentContainer>
+      <ActionsContainer>
+        <QuestionContainer>
+          <Question>{subtitle.howItWorks}</Question>
+        </QuestionContainer>
+        <SubTitle>{subtitle.fewActions}</SubTitle>
+        <ActionsRow>
+          <ActionContainer>
+            <ActionImage src={'/binoculars.png'} />
+            <ActionDescription>
+              <Action>
+                Tapk Smalsuolio {`\n`} prenumeratoriumi -{' '}
+                {<Link href={loggedIn ? slugs.subscriptions : slugs.login}>Užsiregistruok</Link>}
+              </Action>
+            </ActionDescription>
+          </ActionContainer>
+          <ActionContainer>
+            <ActionImage src={'/arrow.png'} />
+            <ActionDescription>
+              <Action>Pažymėk tave dominančias {`\n`} įvykių kategorijas</Action>
+            </ActionDescription>
+          </ActionContainer>
+          <ActionContainer>
+            <ActionImage src={'/letter.png'} />
+            <ActionDescription>
+              <Action>
+                Gauk elektroniniu paštu naujausią {`\n`} informaciją apie tai, kas įvyko
+              </Action>
+            </ActionDescription>
+          </ActionContainer>
+        </ActionsRow>
+      </ActionsContainer>
+      <SecondBannerContainer>
+        <BannerRow>
+          <SecondSubTitle>Darome tą, nes esame smalsūs.{`\n`}Kaip ir tu!</SecondSubTitle>
+          <BannerActionContainer>
+            <GreenCircle />
+            <BannerButton onClick={() => navigate(loggedIn ? slugs.subscriptions : slugs.login)}>
+              <BannerButtonText>{buttonsTitles.beCurious}</BannerButtonText>
+            </BannerButton>
+          </BannerActionContainer>
+        </BannerRow>
+      </SecondBannerContainer>
+      <FooterContainer>
+        <FooterContent>
+          <FooterContentTitle>Smalsuolio komanda</FooterContentTitle>
+          <FooterContentSubTitle>
+            Valstybės tarnautojai, kurie daro daugiau, nei kad prašoma
+          </FooterContentSubTitle>
+          <ButtonContainer>
+            <Button
+              onClick={() => openLinkInNewTab('https://startupgov.lt')}
+              rightIcon={<StyledIcon name={IconName.arrowUpRight} />}
+            >
+              {buttonsTitles.ourTeam}
+            </Button>
+          </ButtonContainer>
+        </FooterContent>
+        <FooterContent>
+          <FooterContentTitle>Jei turi komentarų ar pastabų</FooterContentTitle>
+          <FooterContentSubTitle>Visuomet jų laukiame</FooterContentSubTitle>
+          <ButtonContainer>
+            <Button onClick={sendEmail} leftIcon={<StyledIcon name={IconName.email} />}>
+              esu@smalsuolis.lt
+            </Button>
+          </ButtonContainer>
+        </FooterContent>
+      </FooterContainer>
+    </MainContainer>
   );
 };
 
-const Title = styled.div`
-  color: ${({ theme }) => theme.colors.text.primary};
-  font-size: 3.2rem;
-  font-weight: 800;
-  margin: 16px 0;
+const MainContainer = styled.div`
   width: 100%;
+  display: flex;
+  flex-direction: column;
+  min-height: 100%;
+  @media ${device.desktop} {
+    max-width: 1520px;
+  }
 `;
 
-const Link = styled.a`
-  color: rgb(0, 0, 238);
-  text-decoration: underline;
+const BannerImageContainer = styled.div`
+  width: 100%;
+  margin-bottom: -5px;
 `;
 
-const Description = styled.div`
-  color: ${({ theme }) => theme.colors.text.primary};
-  line-height: 20px;
+const Image = styled.img`
   width: 100%;
+  object-fit: cover;
+  @media ${device.desktop} {
+    border-radius: 32px;
+  }
 `;
 
-const DescriptionContainer = styled.div`
+const ContentContainer = styled.div`
+  align-items: center;
+  padding: 40px 80px;
+  flex-direction: row;
   display: flex;
+  justify-content: space-between;
+  @media ${device.tablet} {
+    flex-wrap: wrap;
+    background-color: ${({ theme }) => theme.colors.background};
+    flex-direction: column;
+    margin-top: 0px;
+    padding: 40px 24px;
+  }
+`;
+
+const DescriptionContainer = styled.div`
+  flex-grow: 0;
+  flex-basis: 50%;
+  justify-content: flex-start;
+  align-items: flex-start;
   flex-direction: column;
-  gap: 24px;
 `;
 
 const SubTitle = styled.div`
   color: ${({ theme }) => theme.colors.text.primary};
-  font-size: 2.2rem;
-  margin: 24px 0;
-  font-weight: 800;
+  font-size: 3.1rem;
+  margin-bottom: 24px;
+  font-weight: 700;
+  line-height: 50.4px;
+`;
+
+const Description = styled.div`
+  color: ${({ theme }) => theme.colors.text.primary};
+  line-height: 32px;
   width: 100%;
+  margin-bottom: 24px;
+  font-size: 1.89rem;
 `;
 
-const Image = styled.img`
-  border-radius: 16px;
-  max-width: 100%;
+const ButtonContainer = styled.div`
+  max-width: 255px;
+`;
+
+const ImageContainer = styled.div`
+  flex: 0 50%;
+  align-items: center;
+  justify-content: center;
   width: 100%;
-  height: 220px;
-  object-fit: cover;
+  max-height: 443px;
+  max-width: 520px;
+  @media ${device.tablet} {
+    margin-top: 24px;
+  }
+`;
+
+const ActionsContainer = styled.div`
+  background-color: white;
+  justify-content: center;
+  align-items: center;
+  padding: 80px 80px;
+  flex-direction: column;
+  display: flex;
+  width: 100%;
+  @media ${device.tablet} {
+    padding: 60px 24px;
+  }
 `;
 
-const NavigateContainer = styled.div`
+const QuestionContainer = styled.div`
+  display: flex;
+  background-color: #dff9e5;
   border-radius: 16px;
-  max-width: 100%;
+  padding: 8px 16px;
+  justify-content: center;
+  align-items: center;
+  margin-bottom: 16px;
+`;
+
+const Question = styled.div`
+  color: ${({ theme }) => theme.colors.text.tertiary};
+  font-size: 1.6rem;
+  line-height: 16px;
+`;
+
+const ActionsRow = styled.div`
+  flex-direction: row;
+  display: flex;
   width: 100%;
-  height: 220px;
-  object-fit: cover;
-  background: #fafafa;
-  padding: 32px;
+  margin-top: 40px;
+  justify-content: space-between;
+  gap: 20px;
+  @media ${device.tablet} {
+    flex-wrap: wrap;
+    flex-direction: column;
+    margin-top: 24px;
+  }
+`;
+
+const ActionContainer = styled.div`
+  background-color: rgb(223, 249, 229, 0.21);
+  border-radius: 32px;
+  padding: 24px;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  @media ${device.tablet} {
+    margin-bottom: 12px;
+  }
+`;
+
+const ActionImage = styled.img`
+  max-width: 112px;
+  margin-bottom: 24px;
+`;
+
+const ActionDescription = styled.div`
+  align-items: center;
+  justify-content: center;
+  align-self: center;
+  margin: 0 40px;
+  display: flex;
+  @media ${device.tablet} {
+    margin: 0 16px;
+  }
+`;
+
+const Link = styled.a`
+  color: ${({ theme }) => theme.colors.text.tertiary};
+  text-decoration: underline;
+`;
+
+const Action = styled.div`
   color: ${({ theme }) => theme.colors.text.primary};
+  line-height: 32px;
+  font-weight: 500;
+  white-space: pre-line;
+  align-self: center;
+  text-align: center;
+  font-size: 1.89rem;
+`;
+
+const SecondBannerContainer = styled.div`
+  background-image: url('/about_banner_background.png');
+  display: flex;
+  margin-top: 40px;
+  padding: 60px 80px;
+  align-items: center;
+  justify-content: center;
+  @media ${device.desktop} {
+    border-radius: 32px;
+  }
+  @media ${device.tablet} {
+    padding: 40px 24px;
+    margin-top: 0px;
+  }
+`;
+
+const BannerRow = styled.div`
+  flex-direction: row;
+  width: 100%;
+  display: flex;
+  justify-content: space-between;
+  @media ${device.tablet} {
+    flex-wrap: wrap;
+    flex-direction: column;
+  }
+`;
+
+const BannerActionContainer = styled.div`
+  flex-direction: column;
   display: flex;
-  align-items: end;
-  font-weight: 600;
+  align-items: flex-end;
+  @media ${device.tablet} {
+    margin-top: 40px;
+  }
+`;
+
+const BannerButtonText = styled.div`
+  color: ${({ theme }) => theme.colors.text.primary};
+  line-height: 32px;
+  font-weight: 500;
+  font-size: 1.8rem;
+  font-weight: medium;
+`;
+
+const SecondSubTitle = styled.div`
+  color: ${({ theme }) => theme.colors.text.primary};
+  font-size: 4.1rem;
+  font-weight: bold;
+  line-height: 72px;
+  white-space: pre-line;
+`;
+
+const GreenCircle = styled.div`
+  height: 130px;
+  width: 130px;
+  border-radius: 65px;
+  background-color: ${({ theme }) => theme.colors.tertiary};
+`;
+
+const BannerButton = styled.button`
+  margin-top: 24px;
+  padding: 20px 100px;
+  background-color: white;
+  border-radius: 60px;
   cursor: pointer;
 `;
 
-const ImagesContainer = styled.div`
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  gap: 24px;
-  margin-top: 32px;
-  @media ${device.mobileL} {
-    grid-template-columns: 1fr;
-    width: 100%;
+const FooterContainer = styled.div`
+  display: flex;
+  flex-direction: row;
+  padding: 40px 80px;
+  @media ${device.tablet} {
+    flex-wrap: wrap;
+    background-color: ${({ theme }) => theme.colors.background};
+    flex-direction: column;
+    margin-top: 0px;
+    padding: 24px 24px;
   }
 `;
 
+const FooterContent = styled.div`
+  flex-direction: column;
+  flex: 1;
+  @media ${device.tablet} {
+    margin-top: 40px;
+  }
+`;
+
+const FooterContentTitle = styled.div`
+  color: ${({ theme }) => theme.colors.text.primary};
+  font-size: 2.6rem;
+  font-weight: 800;
+  line-height: 40px;
+`;
+
+const FooterContentSubTitle = styled.div`
+  color: ${({ theme }) => theme.colors.text.primary};
+  font-size: 1.6rem;
+  line-height: 32px;
+  margin-bottom: 24px;
+`;
+
+const StyledIcon = styled(Icon)`
+  font-size: 1.8rem;
+`;
+
 export default About;
diff --git a/src/styles/index.ts b/src/styles/index.ts
index 6e6efcf..b2a20b1 100644
--- a/src/styles/index.ts
+++ b/src/styles/index.ts
@@ -140,5 +140,6 @@ export const device = {
   mobileS: `(max-width: 320px)`,
   mobileM: `(max-width: 425px)`,
   mobileL: `(max-width: 868px)`,
+  tablet: `(max-width: 1280px)`,
   desktop: `(min-width: 869px)`,
 };
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index 81e9958..8a76bed 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -61,6 +61,7 @@ export enum IconName {
   openInNew = 'openInNew',
   search = 'search',
   filter = 'filter',
+  arrowUpRight = 'arrowUpRight',
 }
 
 export enum ServerErrors {
diff --git a/src/utils/texts.ts b/src/utils/texts.ts
index 1196d26..a211151 100644
--- a/src/utils/texts.ts
+++ b/src/utils/texts.ts
@@ -94,6 +94,9 @@ export const buttonsTitles = {
   showList: 'Rodyti sąrašą',
   visitWebsite: 'Aplankykite svetainę',
   register: 'Registruotis',
+  map: 'Smalsuolio žemėlapis',
+  beCurious: 'Tapk smalsiu',
+  ourTeam: 'Mūsų komanda',
 };
 
 export const subtitle = {
@@ -105,6 +108,8 @@ export const subtitle = {
   category: 'Kategorijos',
   date: 'Data',
   hasNotRegistered: 'Neturite paskyros?',
+  fewActions: 'Tik keli paspaudimai',
+  howItWorks: 'Kaip tai veikia?',
 };
 
 export const subscriptionFrequencyTitles = {
diff --git a/vite.config.ts b/vite.config.ts
index 501b8b3..d22e752 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -11,10 +11,10 @@ export default () => {
     server: {
       proxy: {
         open: '/',
-        '/api': {
+        '/api/': {
           target: env.VITE_PROXY_URL,
           changeOrigin: true,
-          rewrite: (path) => path.replace(/^\/api/, ''),
+          rewrite: (path) => path.replace(/^\/api\//, ''),
         },
       },
     },