diff --git a/src/components/Navbar/index.tsx b/src/components/Navbar/index.tsx
index 1ef30e6..8fa2691 100644
--- a/src/components/Navbar/index.tsx
+++ b/src/components/Navbar/index.tsx
@@ -80,7 +80,7 @@ const Navbar: React.FC = () => {
         >
           <HStack w="full" justifyContent="space-between">
             <HamburgerIcon w={8} h={8} mx="24px" onClick={() => setOpen(!open)} cursor="pointer" maxW="180px" />
-            <Image mx="auto" src={CoachLogo} alt={'Logo do coach'} m="24px" mb="16px" />
+            <Image mx="auto" src={CoachLogo} alt={'Logo do coach'} m="24px" mb="16px" h="40px" />
             <Box w="72px" />
           </HStack>
           {menu}
diff --git a/src/pages/Dashboard/components/DoughnutGraph/index.tsx b/src/pages/Dashboard/components/DoughnutGraph/index.tsx
index 3ac572a..4d1f79b 100644
--- a/src/pages/Dashboard/components/DoughnutGraph/index.tsx
+++ b/src/pages/Dashboard/components/DoughnutGraph/index.tsx
@@ -1,4 +1,4 @@
-import { Box, Center, HStack, Text, VStack } from '@chakra-ui/react';
+import { Box, Center, Flex, HStack, Text, VStack, useBreakpointValue } from '@chakra-ui/react';
 import { Chart as ChartJS, ChartData, ArcElement, Tooltip, LabelItem } from 'chart.js';
 import { Doughnut } from 'react-chartjs-2';
 
@@ -11,23 +11,17 @@ type Props = {
   label?: string;
   values: number[];
   labels?: string[];
+  direction?: 'row' | 'column';
 };
 
 const COLORS = ['#69D6C7', '#4C9AF7', '#6A5CE2', '#A2CF57', '#D96684'];
 
-export const DoughnutGraph: React.FC<Props> = ({ showLegend, values, label, subTitle, title, labels }) => {
+export const DoughnutGraph: React.FC<Props> = ({ showLegend, values, label, subTitle, title, labels, direction }) => {
+  const isMobile = useBreakpointValue({ base: true, md: false });
+
   return (
-    <VStack flex={1} justifyContent="center" alignItems="stretch" p="16px" bg="#F2F4F7" borderRadius="16px">
-      {showLegend && (
-        <VStack>
-          {labels?.map((item, index) => (
-            <HStack key={item} w="100%">
-              <Box bg={COLORS[index]} w="20px" h="20px" /> <Text>{item}</Text>
-            </HStack>
-          ))}
-        </VStack>
-      )}
-      <Center position="relative">
+    <Flex direction={isMobile ? 'column' : direction} p="16px" bg="#F2F4F7" borderRadius="16px" w="full">
+      <Center position="relative" maxW="200px" m="auto">
         <Doughnut
           data={{
             labels,
@@ -61,11 +55,22 @@ export const DoughnutGraph: React.FC<Props> = ({ showLegend, values, label, subT
           </VStack>
         )}
       </Center>
+
+      {showLegend && (
+        <VStack my="auto">
+          {labels?.map((item, index) => (
+            <HStack key={item} w="100%">
+              <Box bg={COLORS[index]} w="20px" h="20px" /> <Text>{item}</Text>
+            </HStack>
+          ))}
+        </VStack>
+      )}
+
       {label && (
         <Text mt="16px" textAlign="center" color="#111417">
           {label}
         </Text>
       )}
-    </VStack>
+    </Flex>
   );
 };
diff --git a/src/pages/Dashboard/components/SpeedometerGraph/index.tsx b/src/pages/Dashboard/components/SpeedometerGraph/index.tsx
index 1e761b0..72231cc 100644
--- a/src/pages/Dashboard/components/SpeedometerGraph/index.tsx
+++ b/src/pages/Dashboard/components/SpeedometerGraph/index.tsx
@@ -22,8 +22,8 @@ export const SpeedometerGraph: React.FC<Props> = ({ maxValue, value, label }) =>
   };
 
   return (
-    <VStack flex={1} justifyContent="center" alignItems="stretch" p="16px" bg="#F2F4F7" borderRadius="16px">
-      <Center position="relative">
+    <VStack p="16px" bg="#F2F4F7" borderRadius="16px" w="full">
+      <Center position="relative" maxW="200px" m="auto">
         <Doughnut
           data={coachingSessionPerTeacher}
           options={{ radius: 100, cutout: '80%' }}
diff --git a/src/pages/Dashboard/index.tsx b/src/pages/Dashboard/index.tsx
index 1f3283f..11eaf8a 100644
--- a/src/pages/Dashboard/index.tsx
+++ b/src/pages/Dashboard/index.tsx
@@ -60,12 +60,18 @@ const DashboardPage: React.FC = () => {
   };
 
   return (
-    <VStack mx="auto" minH="100vh" maxW="1200px" position="relative" overflow="scroll" alignItems="flex-start" p="56px">
-      <Flex mb="20px" ml={'-12px'} flexDir={isMobile ? 'column' : 'row'} w="full">
+    <VStack mx="auto" w="full" minH="100vh" maxW="1200px" position="relative" p="56px" alignItems="flex-start">
+      <Flex mb="20px" flexDir={isMobile ? 'column' : 'row'} w="full">
         <Flex flex={1}>
           <RegionSelect direction="row" level={0} onSelect={handleRegion} />
         </Flex>
-        <Flex flex={1} maxW="220px" ml="12px">
+        <Flex
+          flex={1}
+          ml={isMobile ? 0 : '12px'}
+          mt={isMobile ? '12px' : 0}
+          maxW={isMobile ? undefined : '220px'}
+          w="full"
+        >
           <DataRangePicker onChange={handleChangeDateRange} />
         </Flex>
       </Flex>
@@ -76,74 +82,71 @@ const DashboardPage: React.FC = () => {
         </Center>
       ) : (
         <>
-          <Flex flexDir={isMobile ? 'column' : 'row'} w="full" gap="16px" mb="56px" alignItems="stretch">
-            <VStack flex={3} gap="16px" alignItems="stretch">
-              <Text color="#111417" fontSize="24px" fontWeight={600}>
-                {t('dashboard.engagement.title')}
-              </Text>
-              <Text color="#111417" fontSize="16px" lineHeight="24px">
-                {t('dashboard.engagement.description')}
-              </Text>
-              <HStack gap="16px" alignItems="stretch">
-                <CardValue
-                  label={t('dashboard.engagement.teachers-coached')}
-                  value={dashboard.engagement.teachersCoached}
-                />
-                <CardValue
-                  label={t('dashboard.engagement.active-coaches')}
-                  value={dashboard.engagement.activeCoaches}
-                />
-                <CardValue
-                  label={t('dashboard.engagement.coaching-sessions')}
-                  value={dashboard.engagement.coachingSessions}
-                />
-              </HStack>
-              <HStack gap="16px" alignItems="stretch">
-                <SpeedometerGraph
-                  label={t('dashboard.engagement.coaching-sessions-per-teacher-over-last-three-months')}
-                  value={dashboard.engagement.coachingSessionPerTeacher}
-                  maxValue={dashboard.engagement.coachingSessionPerTeacherGoal}
-                />
-                <DoughnutGraph
-                  labels={[
-                    t('dashboard.engagement.completed-a-second-coach-session'),
-                    'Without a second coach sessions',
-                  ]}
-                  values={[
-                    dashboard.engagement.teacherThatCompletedSecondSession,
-                    dashboard.engagement.teachersCoached - dashboard.engagement.teacherThatCompletedSecondSession,
-                  ]}
-                  label={t('dashboard.engagement.completed-a-second-coach-session') || ''}
-                  title={
-                    (dashboard.engagement.teachersCoached
-                      ? (dashboard.engagement.teacherThatCompletedSecondSession /
-                          dashboard.engagement.teachersCoached) *
-                        100
-                      : 0
-                    ).toFixed(0) + '%'
-                  }
-                  subTitle="Of teachers"
-                />
-              </HStack>
-            </VStack>
-
-            <VStack flex={2} alignItems="stretch">
-              <Text color="#111417" fontSize="24px" fontWeight={600}>
-                {t('dashboard.targeted-improvement-areas.title')}
-              </Text>
-              <Text color="#111417" fontSize="16px" lineHeight="24px">
-                {t('dashboard.targeted-improvement-areas.description')}
-              </Text>
-
+          <VStack gap="16px" w="full" alignItems="flex-start">
+            <Text color="#111417" fontSize="24px" fontWeight={600}>
+              {t('dashboard.engagement.title')}
+            </Text>
+            <Text color="#111417" fontSize="16px" lineHeight="24px">
+              {t('dashboard.engagement.description')}
+            </Text>
+            <HStack gap="16px" alignItems="stretch" w="full">
+              <CardValue
+                label={t('dashboard.engagement.teachers-coached')}
+                value={dashboard.engagement.teachersCoached}
+              />
+              <CardValue label={t('dashboard.engagement.active-coaches')} value={dashboard.engagement.activeCoaches} />
+              <CardValue
+                label={t('dashboard.engagement.coaching-sessions')}
+                value={dashboard.engagement.coachingSessions}
+              />
+              <CardValue
+                label={t('dashboard.teachers-did-not-have-a-feedback-session')}
+                value={selected.data.teacherWithoutFeedback}
+              />
+            </HStack>
+            <HStack gap="16px" w="full">
+              <SpeedometerGraph
+                label={t('dashboard.engagement.coaching-sessions-per-teacher-over-last-three-months')}
+                value={dashboard.engagement.coachingSessionPerTeacher}
+                maxValue={dashboard.engagement.coachingSessionPerTeacherGoal}
+              />
               <DoughnutGraph
-                showLegend={true}
-                labels={dashboard.teachingPractices.map((item) => item.name)}
-                values={dashboard.teachingPractices.map((item) => item.data.teachers)}
+                direction="column"
+                labels={[t('dashboard.engagement.completed-a-second-coach-session'), 'Without a second coach sessions']}
+                values={[
+                  dashboard.engagement.teacherThatCompletedSecondSession,
+                  dashboard.engagement.teachersCoached - dashboard.engagement.teacherThatCompletedSecondSession,
+                ]}
+                label={t('dashboard.engagement.completed-a-second-coach-session') || ''}
+                title={
+                  (dashboard.engagement.teachersCoached
+                    ? (dashboard.engagement.teacherThatCompletedSecondSession / dashboard.engagement.teachersCoached) *
+                      100
+                    : 0
+                  ).toFixed(0) + '%'
+                }
+                subTitle="Of teachers"
               />
-            </VStack>
-          </Flex>
+            </HStack>
+          </VStack>
+
+          <VStack w="full" alignItems="flex-start" my="24px">
+            <Text color="#111417" fontSize="24px" fontWeight={600}>
+              {t('dashboard.targeted-improvement-areas.title')}
+            </Text>
+            <Text color="#111417" fontSize="16px" lineHeight="24px" mb="8px">
+              {t('dashboard.targeted-improvement-areas.description')}
+            </Text>
+
+            <DoughnutGraph
+              direction="row"
+              showLegend={true}
+              labels={dashboard.teachingPractices.map((item) => item.name)}
+              values={dashboard.teachingPractices.map((item) => item.data.teachers)}
+            />
+          </VStack>
 
-          <Text mb="8px" color="#111417" fontWeight={500} fontSize={'16px'}>
+          <Text mb="8px" color="#111417" fontWeight={500} fontSize={'16px'} mt="24px">
             {t('dashboard.select-teaching-practices-to-show')}
           </Text>
 
@@ -200,10 +203,6 @@ const DashboardPage: React.FC = () => {
                   label={t('dashboard.teachers-and-coaches-chose-to-work-on-improving-this-practice')}
                   value={selected.data.teachers}
                 />
-                <CardValue
-                  label={t('dashboard.teachers-did-not-have-a-feedback-session')}
-                  value={selected.data.teacherWithoutFeedback}
-                />
               </HStack>
 
               <VStack justifyContent="center" flex={2} alignItems="center" bg="#F2F4F7" borderRadius="16px" p={'32px'}>
diff --git a/src/pages/Schools/SchoolForm/RegionSelect/index.tsx b/src/pages/Schools/SchoolForm/RegionSelect/index.tsx
index 63f314b..00d0e69 100644
--- a/src/pages/Schools/SchoolForm/RegionSelect/index.tsx
+++ b/src/pages/Schools/SchoolForm/RegionSelect/index.tsx
@@ -49,7 +49,7 @@ const RegionSelect: React.FC<Props> = ({ level, direction, region, onSelect, onC
       display="flex"
       flexDir={direction}
       mt={direction === 'column' ? '12px' : 0}
-      ml={direction === 'row' ? '12px' : 0}
+      ml={direction === 'row' ? (level === 0 ? 0 : '12px') : 0}
       w="full"
     >
       <VStack w="full" alignItems="flex-start">