diff --git a/App.tsx b/App.tsx
index 20dbe372f13db78ee1b31490b49d781ecfc1d65f..f801d8d2e7b5e4826c02ddc629d6c8d686b27789 100644
--- a/App.tsx
+++ b/App.tsx
@@ -2,13 +2,10 @@ import React from 'react';
 import { SafeAreaView, SafeAreaViewBase, ScrollView, StyleSheet, Text, View } from 'react-native';
 import PokemonsContainer from './containers/PokemonsContainer';
 import {ApolloClient, ApolloProvider, InMemoryCache} from "@apollo/client";
-import { Header } from './containers/Header';
+import { Header } from './components/Header';
 import {
   RecoilRoot,
-  atom,
-  selector,
-  useRecoilState,
-  useRecoilValue,
+  
 } from 'recoil';
 
 const App = () => {
diff --git a/containers/Header.tsx b/components/Header.tsx
similarity index 98%
rename from containers/Header.tsx
rename to components/Header.tsx
index 6c0fa972e4caca86f5c8e383cf9d1c2098135c95..3fcde88045a39b63b32a75a5a6adcf686eb10813 100644
--- a/containers/Header.tsx
+++ b/components/Header.tsx
@@ -2,13 +2,14 @@ import { Select } from '@mui/material';
 import React, { useEffect } from 'react';
 import { Image, Text, StyleSheet, View, TouchableOpacity } from "react-native";
 import SelectDropdown from 'react-native-select-dropdown'
-import {SearchBar} from "./SearchBar"
+import {SearchBar} from './SearchBar'
 import {useRecoilState} from 'recoil'
 import { capturedFilterState, typeState } from "../atoms/atoms";
 import { maxHeight, maxWidth } from '@mui/system';
 
 export const Header = () => {
 
+
     const [capturedSorting, setCapturedSorting] = useRecoilState(capturedFilterState)
     const [type, setType] = useRecoilState(typeState)
 
@@ -128,6 +129,7 @@ const styles = StyleSheet.create ({
         width: 300
     }
 })
+
 export default Header
 
 function typeFilter(arg0: () => void, typeFilter: any) {
diff --git a/components/PokemonCard.tsx b/components/PokemonCard.tsx
index cb879a82963d8fc6841fe237e450a00da2aca9c7..03d58ab10485a90ccefb4a129e74a156357d77c2 100644
--- a/components/PokemonCard.tsx
+++ b/components/PokemonCard.tsx
@@ -161,5 +161,4 @@ const styles = StyleSheet.create({
   }
 });
 
-
 export default PokemonCard
\ No newline at end of file
diff --git a/containers/SearchBar.tsx b/components/SearchBar.tsx
similarity index 99%
rename from containers/SearchBar.tsx
rename to components/SearchBar.tsx
index 899975ecaccffedff78902c4aaf590c66ef03079..e83b9f1ad79a95b69bf00e1568396e572d228d9e 100644
--- a/containers/SearchBar.tsx
+++ b/components/SearchBar.tsx
@@ -5,6 +5,7 @@ import { searchState } from "../atoms/atoms";
 
 export const SearchBar = () => {
 
+
     
     const [searchText, setSearchText] = useRecoilState(searchState)
 
diff --git a/containers/PokemonsContainer.tsx b/containers/PokemonsContainer.tsx
index fba5d0ef079c824964c5744189f4a496c005f6a2..dcf510e292a0a35fb17956b91e00759612fa2393 100644
--- a/containers/PokemonsContainer.tsx
+++ b/containers/PokemonsContainer.tsx
@@ -1,12 +1,11 @@
-import React, { useState } from 'react';
-import { Alert, Button, NativeSyntheticEvent, NativeTouchEvent, ScrollView, StyleSheet, Text, View } from 'react-native';
+import React, { useEffect, useState } from 'react';
+import { Alert, Image, Button, NativeSyntheticEvent, NativeTouchEvent, ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
 import PokemonCard from '../components/PokemonCard';
 import {SEARCH_POKEMONS} from '../graphql/get-pokemons';
 import {useQuery} from '@apollo/react-hooks';
 import {Pokemon} from "../types/types";
 import { useRecoilValue } from "recoil";
 import { capturedFilterState, searchState, typeState } from '../atoms/atoms';
-import { borderColor, borders } from '@mui/system';
 
 
 const PokemonsContainer = () => {
@@ -15,8 +14,7 @@ const PokemonsContainer = () => {
     const searchText = useRecoilValue(searchState)
     const typeText = useRecoilValue(typeState)
     const capturedState = useRecoilValue(capturedFilterState)
-
-    const [limit, setLimit] = useState(15)
+    const limit = 14
     const [skip, setSkip] = useState(0)
 
     const {loading, error, data} = useQuery(SEARCH_POKEMONS, {
@@ -32,10 +30,25 @@ const PokemonsContainer = () => {
         }
     })
 
+    const handlePaginationButton = (newPage: string) => {
+        if(newPage === 'prev'){
+            setSkip(skip - 14)
+        } else {
+            setSkip(skip + 14)
+        }
+    }
+
+    useEffect(() => {
+        setSkip(0)
+    }, [searchText, typeText, capturedState])
+
     if (loading){
         return (
             <Text>LOADING..</Text>
         )
+    } else if (data.searchPokemon === 0) {
+        <Text>No matches for this search</Text>
+
     }
     else{
         return (
@@ -43,7 +56,25 @@ const PokemonsContainer = () => {
             {data.searchPokemon && data.searchPokemon.map((pokemon: Pokemon) =>
                 <PokemonCard key={pokemon.id} pokemon={pokemon}/>)
             }
-            
+
+
+            <View style  = {styles.paginationContainers}>
+            {skip >= 14 && data.searchPokemon.length >= 4 &&
+            <TouchableOpacity style={styles.paginationButtonPrevPage} onPress={() => handlePaginationButton("prev")}>
+            <Image  
+                style = {styles.prevButton}
+                source={require('../resources/button.png')}
+                        />
+            </TouchableOpacity>}
+            {data.searchPokemon.length >= 14 &&
+            <TouchableOpacity  style={styles.paginationButtonNextPage} onPress={() => handlePaginationButton("next")}>
+            <Image 
+                style = {styles.nextButton}
+                source={require('../resources/button.png')}
+                        />
+            </TouchableOpacity>}
+            </View>
+           
         </View>
  
         )
@@ -63,6 +94,38 @@ const styles = StyleSheet.create({
        
 
     },
+    prevButton: {
+        width: "100%",
+        height: "100%"
+
+    },
+    nextButton: {
+        width: "100%",
+        height: "100%"
+
+    },
+    paginationButtonNextPage: {
+        width: 50,
+        height: 50,
+        color: "white"
+
+    },
+    paginationButtonPrevPage: {
+        width: 50,
+        height: 50,
+        color: "white",
+        transform: [           
+            {scaleX: -1} //horizontally flip for previous button
+        ]
+    },
+    paginationContainers: {
+        flex: 1, 
+        justifyContent: 'space-between',
+        flexDirection: 'row',
+        marginBottom: 15,
+        marginRight: 10,
+        marginLeft: 10
+    }
 
 });
 
diff --git a/resources/button.png b/resources/button.png
index 6f16ee6ec71df393333bfa1efd71f1f50aacdcbe..d48e4cd0e75a1d848c180cc0901d7944e9dbf51c 100644
Binary files a/resources/button.png and b/resources/button.png differ