diff --git a/src/components/AnimatedPagedView/index.tsx b/src/components/AnimatedPagedView/index.tsx
index 1d1c915..6ec5abe 100644
--- a/src/components/AnimatedPagedView/index.tsx
+++ b/src/components/AnimatedPagedView/index.tsx
@@ -90,7 +90,7 @@ export const AnimatedPagedView = forwardRef<AnimatedPagedScrollViewRef, Animated
 
     return (
       <GestureDetector gesture={gesture}>
-        <Animated.View style={[styles.container]}>
+        <Animated.View style={styles.container}>
           <Animated.View style={[styles.contentContainer, animatedStyle]}>
             {props.children}
           </Animated.View>
diff --git a/src/components/AnimatedPagedView/styles.ts b/src/components/AnimatedPagedView/styles.ts
index 8685d74..6320b44 100644
--- a/src/components/AnimatedPagedView/styles.ts
+++ b/src/components/AnimatedPagedView/styles.ts
@@ -4,7 +4,7 @@ export const styles = StyleSheet.create({
   container: {
     flex: 1,
     width: '100%',
-    overflow: 'hidden',
+    overflow: 'visible',
   },
   contentContainer: {
     flexDirection: 'row',
diff --git a/src/components/HeroCarousel/index.tsx b/src/components/HeroCarousel/index.tsx
index 8665fca..00b474b 100644
--- a/src/components/HeroCarousel/index.tsx
+++ b/src/components/HeroCarousel/index.tsx
@@ -7,6 +7,7 @@ import { useAutoScroll } from '../../hooks/useAutoScroll'
 import { useInfiniteScroll } from '../../hooks/useInfiniteScroll'
 import { DEFAULT_INTERVAL } from './index.preset'
 import { ItemAnimatedView } from '../ItemAnimatedView'
+import { useWindowDimensions, View } from 'react-native'
 
 export type HeroCarouselProps = {
   children: React.ReactNode[]
@@ -32,6 +33,7 @@ const HeroCarousel = ({ children }: HeroCarouselProps) => {
     scrollValue,
     disabled: disableInfiniteScroll,
   })
+  const { width: windowWidth } = useWindowDimensions()
 
   const autoScrollEnabled = !userInteracted
 
@@ -49,7 +51,7 @@ const HeroCarousel = ({ children }: HeroCarouselProps) => {
   })
 
   return (
-    <>
+    <View style={{ flex: 1, marginLeft: (windowWidth - slideWidth) / 2 }}>
       <HeroCarouselAdapter
         manualScrollValue={manualScrollValue}
         onScroll={(activeIndex: number) => {
@@ -70,7 +72,7 @@ const HeroCarousel = ({ children }: HeroCarouselProps) => {
           </HeroCarouselSlide>
         ))}
       </HeroCarouselAdapter>
-    </>
+    </View>
   )
 }
 
diff --git a/src/components/index.ts b/src/components/index.ts
index be36b76..59284a0 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -1 +1 @@
-export { HeroCarousel, HeroCarouselProps } from './HeroCarousel'
+export { HeroCarousel, type HeroCarouselProps } from './HeroCarousel'